diff --git a/src/features/auth/login/ui/form.tsx b/src/features/auth/login/ui/form.tsx index 67d567a..c7becde 100644 --- a/src/features/auth/login/ui/form.tsx +++ b/src/features/auth/login/ui/form.tsx @@ -9,8 +9,7 @@ import { import PhonePrefix from '../../../../shared/ui/phonePrefix'; import { MotionWrapper } from '../../../../shared/ui/motion'; import { useLoginForm } from '../lib/useLoginForm'; -import { useLoginModal } from '@/shared/zustand/auth'; -import Link from 'next/link'; +import { useLoginModal, useRegisterModal } from '@/shared/zustand/auth'; import { useTranslations } from 'next-intl'; export function LoginForm() { @@ -20,6 +19,9 @@ export function LoginForm() { const { phone, setPhone, submit, error, loading } = useLoginForm(); const toggleLoginModal = useLoginModal((state) => state.toggleLoginModal); + const toggleRegisterModal = useRegisterModal( + (state) => state.toggleRegisterModal, + ); const handlePhoneChange = useCallback( (e: React.ChangeEvent) => { @@ -149,14 +151,17 @@ export function LoginForm() { {/* Register hint */} -

+

{t('registerPrompt')} - { + toggleLoginModal(); + toggleRegisterModal(); + }} + className="text-stone-800 hover:cursor-pointer underline underline-offset-2 hover:text-stone-600 transition-colors" > {t('registerLink')} - +

diff --git a/src/features/auth/register/ui/form.tsx b/src/features/auth/register/ui/form.tsx index 61a3b7d..6e6f89c 100644 --- a/src/features/auth/register/ui/form.tsx +++ b/src/features/auth/register/ui/form.tsx @@ -5,6 +5,7 @@ import { useRegisterForm } from '../lib/useRegisterForm'; import { formatPhone, normalizeDigits } from '@/shared/lib/formatPhone'; import PhonePrefix from '@/shared/ui/phonePrefix'; import { useTranslations } from 'next-intl'; +import { useLoginModal, useRegisterModal } from '@/shared/zustand/auth'; function Field({ id, @@ -66,6 +67,7 @@ function Field({ export function RegisterFormUI() { const [phone, setPhone] = React.useState(''); const t = useTranslations('Auth.Register'); + const t_login = useTranslations('Auth.Login'); const tCommon = useTranslations('Common'); const { registerData, @@ -77,6 +79,10 @@ export function RegisterFormUI() { handleSubmit, setItem, } = useRegisterForm(); + const toggleLoginModal = useLoginModal((state) => state.toggleLoginModal); + const toggleRegisterModal = useRegisterModal( + (state) => state.toggleRegisterModal, + ); const [isFocused, setIsFocused] = React.useState(false); const handlePhoneChange = useCallback( (e: React.ChangeEvent) => { @@ -233,6 +239,29 @@ export function RegisterFormUI() { )} + + {/* Divider */} +
+ + + {tCommon('or')} + + +
+ + {/* Register hint */} +

+ {t('loginPrompt')} +

{ + toggleLoginModal(); + toggleRegisterModal(); + }} + className="text-stone-800 hover:cursor-pointer underline underline-offset-2 hover:text-stone-600 transition-colors" + > + {t_login('title')} +

+

); } diff --git a/src/shared/config/i18n/messages/en.json b/src/shared/config/i18n/messages/en.json index 86f1d54..3ed7a48 100644 --- a/src/shared/config/i18n/messages/en.json +++ b/src/shared/config/i18n/messages/en.json @@ -188,7 +188,8 @@ "namePlaceholder": "Ali", "surnamePlaceholder": "Karimov", "terms": "I agree to the Terms of Service and Privacy Policy", - "submitButton": "Create account" + "submitButton": "Create account", + "loginPrompt": "Already have an account?" } }, "Payment": { diff --git a/src/shared/config/i18n/messages/ru.json b/src/shared/config/i18n/messages/ru.json index ee3c5ce..5073b39 100644 --- a/src/shared/config/i18n/messages/ru.json +++ b/src/shared/config/i18n/messages/ru.json @@ -188,7 +188,8 @@ "namePlaceholder": "Али", "surnamePlaceholder": "Каримов", "terms": "Я согласен с Условиями обслуживания и Политикой конфиденциальности", - "submitButton": "Создать аккаунт" + "submitButton": "Создать аккаунт", + "loginPrompt": "Уже есть аккаунт?" } }, "Payment": { diff --git a/src/shared/config/i18n/messages/uz.d.json.ts b/src/shared/config/i18n/messages/uz.d.json.ts index 709d3f1..95a0d10 100644 --- a/src/shared/config/i18n/messages/uz.d.json.ts +++ b/src/shared/config/i18n/messages/uz.d.json.ts @@ -192,6 +192,7 @@ declare const messages: { surnamePlaceholder: 'Karimov'; terms: "Men Xizmat ko'rsatish shartlari va Maxfiylik siyosatiga roziman"; submitButton: 'Hisob yaratish'; + loginPrompt: 'Hisobingiz bormi?'; }; }; Payment: { diff --git a/src/shared/config/i18n/messages/uz.json b/src/shared/config/i18n/messages/uz.json index bf1078e..7b2462d 100644 --- a/src/shared/config/i18n/messages/uz.json +++ b/src/shared/config/i18n/messages/uz.json @@ -188,7 +188,8 @@ "namePlaceholder": "Ali", "surnamePlaceholder": "Karimov", "terms": "Men Xizmat ko'rsatish shartlari va Maxfiylik siyosatiga roziman", - "submitButton": "Hisob yaratish" + "submitButton": "Hisob yaratish", + "loginPrompt": "Hisobingiz bormi?" } }, "Payment": { diff --git a/src/widgets/home/components/Hero.tsx b/src/widgets/home/components/Hero.tsx index 612be62..31ad2d1 100644 --- a/src/widgets/home/components/Hero.tsx +++ b/src/widgets/home/components/Hero.tsx @@ -1,5 +1,10 @@ -import type { FC } from 'react'; -import { motion, type MotionStyle, type MotionValue } from 'framer-motion'; +'use client'; +import { + motion, + useScroll, + useTransform, + type MotionStyle, +} from 'framer-motion'; import { fadeUp, stagger } from '../animations'; import { C } from '../tokens'; import { STATS } from '../constants'; @@ -10,16 +15,15 @@ import Section from './Section'; import Stat from './Stat'; import StartButton from './StartButton'; import { useTranslations } from 'next-intl'; +import { useLoginModal } from '@/shared/zustand/auth'; -interface HeroProps { - onStart: () => void; - blobY: MotionValue; -} - -const Hero: FC = ({ onStart, blobY }) => { +const Hero = () => { const isMobile = useIsMobile(); const t = useTranslations('Hero'); const tStats = useTranslations('Stats'); + const { scrollY } = useScroll(); + const blobY = useTransform(scrollY, [0, 600], [0, 80]); + const toggleLoginModal = useLoginModal((state) => state.toggleLoginModal); const getTranslatedLabel = (label: string) => { switch (label) { @@ -149,7 +153,7 @@ const Hero: FC = ({ onStart, blobY }) => { flexWrap: 'wrap', }} > - + toggleLoginModal()} /> ; - onScrollTop: () => void; -} - -const StepsSection: FC = ({ stepsRef, onScrollTop }) => { +const StepsSection = () => { const isMobile = useIsMobile(); const t = useTranslations('StepsSection'); + const stepsRef = useRef(null); + const toggleLoginModal = useLoginModal((state) => state.toggleLoginModal); return (
= ({ stepsRef, onScrollTop }) => { {t('ctaDescription')}

- + toggleLoginModal()} /> diff --git a/src/widgets/home/index.tsx b/src/widgets/home/index.tsx index 51c310a..dc2bc1a 100644 --- a/src/widgets/home/index.tsx +++ b/src/widgets/home/index.tsx @@ -1,27 +1,16 @@ 'use client'; -import { useRef, type FC } from 'react'; -import { useScroll, useTransform } from 'framer-motion'; import Hero from './components/Hero'; import InfoSection from './components/InfoSection'; import StepsSection from './components/StepsSection'; import Ticker from './components/Ticker'; -const PlagiarismLanding: FC = () => { - const stepsRef = useRef(null); - const { scrollY } = useScroll(); - const blobY = useTransform(scrollY, [0, 600], [0, 80]); - - const scrollToSteps = () => - stepsRef.current?.scrollIntoView({ behavior: 'smooth', block: 'start' }); - - const scrollToTop = () => window.scrollTo({ top: 0, behavior: 'smooth' }); - +const PlagiarismLanding = () => { return ( <> - + - + ); };