turkmentv_front/app/(main)/lottery/page.tsx

54 lines
2.0 KiB
TypeScript
Raw Normal View History

2025-01-02 10:04:54 +00:00
'use client';
2024-12-23 19:13:36 +00:00
2025-01-02 10:04:54 +00:00
import { useState } from 'react';
import { useLotteryAuth } from '@/store/useLotteryAuth';
import ProtectedRoute from '@/components/lottery/auth/ProtectedRoute';
import LotteryHeader from '@/components/lottery/LotteryHeader';
2024-12-23 19:32:36 +00:00
2025-01-02 10:04:54 +00:00
import LotteryWinnersSection from '@/components/lottery/LotteryWinnersSection';
import LotteryRulesSection from '@/components/lottery/rules/LotteryRulesSection';
import LotteryCountDown from '@/components/lottery/countDown/LotteryCountDown';
import LotteryCountDownAllert from '@/components/lottery/countDown/countDownAllert/LotteryCountDownAllert';
2025-01-02 12:47:39 +00:00
import { LotteryWinnerDataSimplified } from '@/typings/lottery/lottery.types';
2024-12-23 19:13:36 +00:00
2024-12-23 19:32:36 +00:00
const LotteryPage = () => {
2024-12-23 19:13:36 +00:00
const { lotteryData } = useLotteryAuth();
2025-01-02 10:04:54 +00:00
const [status, setStatus] = useState<'not-started' | 'started' | 'ended'>('not-started');
2024-12-29 18:02:23 +00:00
2024-12-23 19:13:36 +00:00
return (
<ProtectedRoute>
2024-12-29 18:02:23 +00:00
<div className="flex flex-col md:gap-[128px] gap-[80px] font-roboto md:pt-[64px] sm:pt-[48px] pt-[40px] ms:pb-[128px] pb-[80px] text-lightOnSurface">
2024-12-23 19:13:36 +00:00
{lotteryData && (
2024-12-29 18:02:23 +00:00
<div className="flex flex-col sm:gap-[64px] gap-[40px]">
<LotteryHeader
title={lotteryData.data.title}
description={lotteryData.data.description}
image={lotteryData.data.image}
smsCode={lotteryData.data.sms_code}
/>
2024-12-23 19:13:36 +00:00
2025-01-02 10:04:54 +00:00
{status === 'not-started' ? (
2024-12-29 18:02:23 +00:00
<div className="container">
<LotteryCountDown
lotteryStatus={status}
setLotteryStatus={setStatus}
endDate={lotteryData.data.end_time}
startDate={lotteryData.data.start_time}
/>
</div>
) : null}
</div>
)}
2024-12-25 13:46:20 +00:00
2024-12-23 19:13:36 +00:00
<LotteryRulesSection />
2025-01-02 10:04:54 +00:00
{lotteryData && (status === 'ended' || status === 'started') && (
2025-01-02 12:47:39 +00:00
<LotteryWinnersSection lotteryStatus={status} />
2024-12-29 18:02:23 +00:00
)}
2024-12-23 19:13:36 +00:00
</div>
</ProtectedRoute>
);
};
2024-12-23 19:32:36 +00:00
export default LotteryPage;