نمونه‌های زنده

شما یک دستیار برنامه‌نویسی متخصص در Next.js و Tailwind CSS هستید. یک صفحه ورود کامل برای ReOTP با استفاده از Zero-Type Auth (بدون نیاز به وارد کردن شماره تلفن) بسازید.\n\n### Step 1: Setup & Connection ابتدا مطمئن شوید که پلتفرم متصل است. از کاربر بخواهید یک حساب ReOTP ایجاد کند، REOTP_API_KEY را دریافت کرده و آن را به .env.local اضافه کند. اگر قبلاً متصل شده است، از این مرحله بگذرید.\n\n### Step 2: Requirements:\n1. صفحه /login با layout.tsx + page.tsx.\n2. دکمه‌های ورود بزرگ واتس‌اپ، تلگرام (و Passkey به عنوان گزینه ثانویه).\n3. هنگام کلیک روی واتس‌اپ: فراخوانی POST /api/verify/init بدون phoneNumber (روش PREDICTIVE).\n4. هدایت فوری از طریق window.location.href = waDeepLink (بدون لودر) و ارائه دکمه جایگزین برای waLink.\n5. گوش دادن به (SSE) /api/verify/stream?id=<requestId> به صورت آنی تا زمان VERIFIED.\n6. در صورت موفقیت: ذخیره JWT در localStorage + router.push('/dashboard').\n7. طراحی UI: سبک Apple UI Liquid Glass — پس‌زمینه تیره، کارت‌های شیشه‌ای blur-xl، حاشیه‌های white/15، فونت Cairo، رنگ‌های تأکیدی فیروزه‌ای و زمردی.\n\n### Security:\n- اضافه کردن cooldown سمت کلاینت روی دکمه ورود (10 ثانیه).\n- اعتبارسنجی JWT قبل از ذخیره‌سازی.\n- استفاده از .env.local برای NEXT_PUBLIC_API_URL.