diff --git a/src/app/auth/page.tsx b/src/app/auth/page.tsx index ea76592..547e6b0 100644 --- a/src/app/auth/page.tsx +++ b/src/app/auth/page.tsx @@ -9,6 +9,7 @@ import StepEnterOtp from '@/features/auth/components/StepEnterOtp'; import { AUTH_PAGE_ELEMENT, AUTH_STEP } from '@/enums'; import { useCountdown } from '@/hooks/useCountdown'; import StepNewPassword from '@/features/auth/components/StepNewPassword'; +import AuthFormWrapper from '@/features/auth/components/AuthFormWrapper'; // import { useLogin } from '@/hooks/auth/useLogin'; // import { useSignup } from '@/hooks/auth/useSignup'; // import { useCheckUserExistsLazy } from '@/hooks/auth/useCheckUserExists'; @@ -172,14 +173,18 @@ function AuthIndex({ }: Props) { } const stepMap = { - [AUTH_STEP.ENTER_NUMBER]: , - [AUTH_STEP.ENTER_PASSWORD]: , - [AUTH_STEP.ENTER_OTP]: , - [AUTH_STEP.ENTER_NEW_PASSWORD]: , - [AUTH_STEP.ENTER_RESET_PASSWORD]: , + [AUTH_STEP.ENTER_NUMBER]: , + [AUTH_STEP.ENTER_PASSWORD]: , + [AUTH_STEP.ENTER_OTP]: , + [AUTH_STEP.ENTER_NEW_PASSWORD]: , + [AUTH_STEP.ENTER_RESET_PASSWORD]: , } - return stepMap[step] || 'say what now?' + return ( + + {stepMap[step] || 'say what now?'} + + ) } export default AuthIndex diff --git a/src/features/auth/components/AuthFormWrapper.tsx b/src/features/auth/components/AuthFormWrapper.tsx new file mode 100644 index 0000000..89a5095 --- /dev/null +++ b/src/features/auth/components/AuthFormWrapper.tsx @@ -0,0 +1,17 @@ +import React from 'react' + +type Props = { + +} & Omit, "id">; + +function AuthFormWrapper({ children, ...restProps }: Props) { + return ( +
+
+ {children} +
+
+ ) +} + +export default AuthFormWrapper \ No newline at end of file diff --git a/src/features/auth/components/StepEnterNumber.tsx b/src/features/auth/components/StepEnterNumber.tsx index a0292a5..3c81a6e 100644 --- a/src/features/auth/components/StepEnterNumber.tsx +++ b/src/features/auth/components/StepEnterNumber.tsx @@ -5,45 +5,41 @@ import Image from 'next/image'; import React from 'react' type Props = { - onSubmit: React.FormEventHandler | undefined; onChange: ((e: React.ChangeEvent) => void) & React.ChangeEventHandler; value: string; } -function StepEnterNumber({ onSubmit, onChange, value }: Props) { +function StepEnterNumber({ onChange, value }: Props) { return ( -
-
- login banner -
-
-
-
ورود به سیستم
-

برای ورود شماره همراه خود را وارد نمایید.

-
- + <> + login banner +
+
+
+
ورود به سیستم
+

برای ورود شماره همراه خود را وارد نمایید.

- +
- +
- + ) } diff --git a/src/features/auth/components/StepEnterOtp.tsx b/src/features/auth/components/StepEnterOtp.tsx index 006f64f..d461968 100644 --- a/src/features/auth/components/StepEnterOtp.tsx +++ b/src/features/auth/components/StepEnterOtp.tsx @@ -5,7 +5,6 @@ import Image from 'next/image'; import React from 'react' type Props = { - onSubmit: React.FormEventHandler | undefined; onChange: ((e: React.ChangeEvent) => void) & React.ChangeEventHandler; onClick: React.MouseEventHandler | undefined; value: string; @@ -14,59 +13,57 @@ type Props = { secondsLeft: number; } -function StepEnterOtp({ onSubmit, onChange, onClick, value, phoneNumber, timerRunning, secondsLeft }: Props) { +function StepEnterOtp({ onChange, onClick, value, phoneNumber, timerRunning, secondsLeft }: Props) { return ( -
-
- login banner -
-
- {/* // TODO: add persian digits font */} -
کد فعالسازی را وارد کنید
-

کد ۶ رقمی ارسال شده به شماره {phoneNumber} را وارد نمایید.

-
-
- -
- -
-
- {timerRunning ? -
{secondsLeft} ثانیه دیگر تا دریافت کد
: -
- کد را دریافت نکردید؟ - - - -
- } -
-
- + <> + login banner +
+
+ {/* // TODO: add persian digits font */} +
کد فعالسازی را وارد کنید
+

کد ۶ رقمی ارسال شده به شماره {phoneNumber} را وارد نمایید.

+
+ +
+ +
+
+ {timerRunning ? +
{secondsLeft} ثانیه دیگر تا دریافت کد
: +
+ کد را دریافت نکردید؟ + + + +
+ } +
+
+
- + ) } diff --git a/src/features/auth/components/StepEnterPassword.tsx b/src/features/auth/components/StepEnterPassword.tsx index 7897136..8b69cb7 100644 --- a/src/features/auth/components/StepEnterPassword.tsx +++ b/src/features/auth/components/StepEnterPassword.tsx @@ -6,7 +6,6 @@ import Image from 'next/image'; import React from 'react' type Props = { - onSubmit: React.FormEventHandler | undefined; onChange: ((e: React.ChangeEvent) => void) & React.ChangeEventHandler; onClick: React.MouseEventHandler | undefined; value: string; @@ -14,52 +13,49 @@ type Props = { rememberMe: boolean; } -function StepEnterPassword({ onSubmit, onChange, onClick, value, passwordVisible, rememberMe }: Props) { +function StepEnterPassword({ onChange, onClick, value, passwordVisible, rememberMe }: Props) { return ( -
-
- login banner -
-
-
-
ورود به سیستم
-

کلمه عبور خود را وارد نمایید.

-
- - - -
- - -
- {/* TODO: customize checkbox */} - -
-
+ <> + login banner +
+
+
+
ورود به سیستم
+

کلمه عبور خود را وارد نمایید.

- -
+ + + +
+ +
+ {/* TODO: customize checkbox */} + +
+
+
+
- + ) } diff --git a/src/features/auth/components/StepNewPassword.tsx b/src/features/auth/components/StepNewPassword.tsx index e0a0e7b..ac420b7 100644 --- a/src/features/auth/components/StepNewPassword.tsx +++ b/src/features/auth/components/StepNewPassword.tsx @@ -6,7 +6,6 @@ import Image from 'next/image'; import React from 'react' type Props = { - onSubmit: React.FormEventHandler | undefined; onChange: ((e: React.ChangeEvent) => void) & React.ChangeEventHandler; onClick: React.MouseEventHandler | undefined; value: string; @@ -16,59 +15,56 @@ type Props = { repeatPasswordVisible: boolean; } -function StepNewPassword({ reset = false, onSubmit, onChange, onClick, value, repeatValue, passwordVisible, repeatPasswordVisible }: Props) { +function StepNewPassword({ reset = false, onChange, onClick, value, repeatValue, passwordVisible, repeatPasswordVisible }: Props) { return ( -
-
- login banner -
-
-
-
- {reset ? "تغییر کلمه عبور" : "انتخاب کلمه عبور"} -
-

کلمه عبور جدید باید ترکیبی از حروف بزرگ و کوچک و نشانه ها باشد مثل A126bdz@

-
- - - - - - + <> + login banner +
+
+
+
+ {reset ? "تغییر کلمه عبور" : "انتخاب کلمه عبور"} +
+

کلمه عبور جدید باید ترکیبی از حروف بزرگ و کوچک و نشانه ها باشد مثل A126bdz@

- + + + + + +
- +
- + ) }