diff --git a/app/(main)/lottery/page.tsx b/app/(main)/lottery/page.tsx index 925e788..b3f088d 100644 --- a/app/(main)/lottery/page.tsx +++ b/app/(main)/lottery/page.tsx @@ -1,6 +1,6 @@ 'use client'; -import { useState } from 'react'; +import { useEffect, useState } from 'react'; import { useLotteryAuth } from '@/store/useLotteryAuth'; import ProtectedRoute from '@/components/lottery/auth/ProtectedRoute'; import LotteryHeader from '@/components/lottery/LotteryHeader'; @@ -10,11 +10,28 @@ import LotteryRulesSection from '@/components/lottery/rules/LotteryRulesSection' import LotteryCountDown from '@/components/lottery/countDown/LotteryCountDown'; import LotteryCountDownAllert from '@/components/lottery/countDown/countDownAllert/LotteryCountDownAllert'; import { LotteryWinnerDataSimplified } from '@/typings/lottery/lottery.types'; +import { Queries } from '@/api/queries'; const LotteryPage = () => { - const { lotteryData } = useLotteryAuth(); + const { lotteryData, setAuth } = useLotteryAuth(); const [status, setStatus] = useState<'not-started' | 'started' | 'ended'>('not-started'); + // ✅ Fetch fresh data on page load + useEffect(() => { + const phone = localStorage.getItem('lotteryPhone'); + const code = localStorage.getItem('lotteryCode'); + + if (phone && code) { + Queries.authenticateLottery(phone, code) + .then((response) => { + setAuth(response, phone, code); + }) + .catch((err) => { + console.error('Failed to fetch lottery data:', err); + }); + } + }, [setAuth]); + return (
diff --git a/components/lottery/auth/LotteryAuthForm.tsx b/components/lottery/auth/LotteryAuthForm.tsx index 16eb910..d1abdff 100644 --- a/components/lottery/auth/LotteryAuthForm.tsx +++ b/components/lottery/auth/LotteryAuthForm.tsx @@ -15,18 +15,30 @@ const LotteryAuthForm = () => { const validatePhone = (value: string) => { const phoneRegex = /^993\d{8}$/; - return phoneRegex.test(value); + const isValid = phoneRegex.test(value); + + console.log('Phone Input:', value); + console.log('Regex Check Result:', isValid); + + return isValid; }; const validateCode = (value: string) => { const codeRegex = /^\d-\d{10}$/; - return codeRegex.test(value); + const isValid = codeRegex.test(value); + + console.log('Code Input:', value); + console.log('Regex Check Result:', isValid); + + return isValid; }; const handleSubmit = async (e: FormEvent) => { e.preventDefault(); setError(null); + console.log('Submitting Phone:', phone); + if (!validatePhone(phone)) { setError('Telefon belgisi nädogry'); return; @@ -41,10 +53,14 @@ const LotteryAuthForm = () => { try { const response = await Queries.authenticateLottery(phone, code); - setAuth(response, phone, code); - if (response.errorMessage?.length) { + + if (response.errorMessage) { setError('Telefon belgisi ýa-da açar nädogry'); } else { + localStorage.setItem('lotteryPhone', phone); + localStorage.setItem('lotteryCode', code); + + setAuth(response, phone, code); router.replace('/lottery'); } } catch (err) { @@ -56,9 +72,8 @@ const LotteryAuthForm = () => { }; const handlePhoneChange = (e: React.ChangeEvent) => { - const value = e.target.value.replace(/\D/g, ''); // Remove non-digits + const value = e.target.value.replace(/\\D/g, ''); if (value.length <= 11) { - // Limit to 11 digits (993 + 8 digits) setPhone(value); } }; @@ -66,7 +81,6 @@ const LotteryAuthForm = () => { const handleCodeChange = (e: React.ChangeEvent) => { const value = e.target.value; if (value.length <= 12) { - // Limit to 12 characters (X-XXXXXXXXXX) setCode(value); } }; diff --git a/components/lottery/auth/ProtectedRoute.tsx b/components/lottery/auth/ProtectedRoute.tsx index b40deab..3366767 100644 --- a/components/lottery/auth/ProtectedRoute.tsx +++ b/components/lottery/auth/ProtectedRoute.tsx @@ -7,37 +7,40 @@ import { Queries } from '@/api/queries'; const ProtectedRoute = ({ children }: { children: React.ReactNode }) => { const router = useRouter(); - const { isAuthenticated, phone, code, setAuth } = useLotteryAuth(); + const { isAuthenticated, setAuth } = useLotteryAuth(); const [isLoading, setIsLoading] = useState(true); useEffect(() => { const checkAuth = async () => { - // First, check if we have credentials in localStorage + // ✅ Check credentials from localStorage + const phone = localStorage.getItem('lotteryPhone'); + const code = localStorage.getItem('lotteryCode'); + if (phone && code) { try { - // Try to authenticate with stored credentials + // ✅ Authenticate using stored credentials const response = await Queries.authenticateLottery(phone, code); if (response.errorMessage) { + // If authentication fails, redirect to the auth page router.replace('/lottery/auth'); } else { + // ✅ Set the authenticated state setAuth(response, phone, code); setIsLoading(false); } - return; // Exit early if authentication successful } catch (err) { console.error('Authentication failed:', err); - // Only redirect if API request fails router.replace('/lottery/auth'); } } else { - // Only redirect if no credentials found + // Redirect to the auth page if no credentials are found router.replace('/lottery/auth'); } }; checkAuth(); - }, []); + }, [router, setAuth]); // Show nothing while checking auth if (isLoading) {