From 228f92e9eda94352c1f681e749b5d3113f70f6ea Mon Sep 17 00:00:00 2001 From: Naufal Azmi <109430358+BoboiAzumi@users.noreply.github.com> Date: Sun, 13 Jul 2025 03:40:23 +0700 Subject: [PATCH] Mentor Register Page (#48) * feat: responsive * fix: success register * feat: auth login responsive && auth login implementation * fix: login page button disabled & register page * fix: conflict * fix: button disabled when loading * feat: register and otp integration * Update middleware.ts * feat: OTP Resend * fix: minor * stash * feat: mentor register pages * feat: mentor status page pending and success --- apps/dimentorin/src/app/auth/login/page.tsx | 5 + .../src/app/auth/register-mentor/layout.tsx | 12 + .../src/app/auth/register-mentor/page.tsx | 242 ++++++++++++++++++ .../auth/register-mentor/pending/layout.tsx | 12 + .../app/auth/register-mentor/pending/page.tsx | 41 +++ .../auth/register-mentor/success/layout.tsx | 12 + .../app/auth/register-mentor/success/page.tsx | 57 +++++ .../src/app/auth/register/otp/page.tsx | 4 +- apps/dimentorin/src/app/page.tsx | 12 + apps/dimentorin/src/main.tsx | 7 +- apps/dimentorin/src/middleware.ts | 3 + libs/service/src/hooks/auth/index.ts | 2 +- libs/ui/src/atoms/index.ts | 1 + libs/ui/src/atoms/select/index.ts | 1 + libs/ui/src/atoms/select/select.tsx | 50 ++++ libs/ui/src/molecules/index.ts | 4 +- .../molecules/register-mentor-step/index.ts | 1 + .../register-mentor-step.tsx | 53 ++++ libs/ui/src/molecules/select-field/index.ts | 1 + .../molecules/select-field/select-field.tsx | 93 +++++++ .../src/organisms/auth-banner/auth-banner.tsx | 4 +- 21 files changed, 609 insertions(+), 8 deletions(-) create mode 100644 apps/dimentorin/src/app/auth/register-mentor/layout.tsx create mode 100644 apps/dimentorin/src/app/auth/register-mentor/page.tsx create mode 100644 apps/dimentorin/src/app/auth/register-mentor/pending/layout.tsx create mode 100644 apps/dimentorin/src/app/auth/register-mentor/pending/page.tsx create mode 100644 apps/dimentorin/src/app/auth/register-mentor/success/layout.tsx create mode 100644 apps/dimentorin/src/app/auth/register-mentor/success/page.tsx create mode 100644 apps/dimentorin/src/app/page.tsx create mode 100644 libs/ui/src/atoms/select/index.ts create mode 100644 libs/ui/src/atoms/select/select.tsx create mode 100644 libs/ui/src/molecules/register-mentor-step/index.ts create mode 100644 libs/ui/src/molecules/register-mentor-step/register-mentor-step.tsx create mode 100644 libs/ui/src/molecules/select-field/index.ts create mode 100644 libs/ui/src/molecules/select-field/select-field.tsx diff --git a/apps/dimentorin/src/app/auth/login/page.tsx b/apps/dimentorin/src/app/auth/login/page.tsx index 152f955..20d405a 100644 --- a/apps/dimentorin/src/app/auth/login/page.tsx +++ b/apps/dimentorin/src/app/auth/login/page.tsx @@ -51,6 +51,11 @@ export const Components: FC = (): ReactElement => { Daftar Disini +
+ + Daftar Sebagai Mentor + +
Or diff --git a/apps/dimentorin/src/app/auth/register-mentor/layout.tsx b/apps/dimentorin/src/app/auth/register-mentor/layout.tsx new file mode 100644 index 0000000..2d8a74d --- /dev/null +++ b/apps/dimentorin/src/app/auth/register-mentor/layout.tsx @@ -0,0 +1,12 @@ +import { FC, ReactElement } from 'react'; +import { Outlet } from 'react-router-dom'; + +export const AppLayout: FC = (): ReactElement => { + return ( +
+ +
+ ); +}; + +export default AppLayout; diff --git a/apps/dimentorin/src/app/auth/register-mentor/page.tsx b/apps/dimentorin/src/app/auth/register-mentor/page.tsx new file mode 100644 index 0000000..88b6305 --- /dev/null +++ b/apps/dimentorin/src/app/auth/register-mentor/page.tsx @@ -0,0 +1,242 @@ +import { FC, ReactElement, useState } from 'react'; +import { ControlledInputField, RegisterResetBanner } from '@imphnen-frontend-service/ui/organisms'; +import { Button, Select } from '@imphnen-frontend-service/ui/atoms'; +import { ArrowLeftOutlined, ArrowRightOutlined } from '@ant-design/icons'; +import { InputField, RegisterMentorStep, SelectField } from '@imphnen-frontend-service/ui/molecules'; + +export const Components: FC = (): ReactElement => { + const [ step, setStep ] = useState(1) + + return ( +
+
+ +
+
+ + +

+ Register +

+
+ Welcome to the team, Mentor - powered by IMPHNEN +
+
+
+
+ +
+ + + + + +
+ +
+ + + + + +
+ + + + + + + +
+
+
+
+ + + + + + + + + + +
+
+
+
+ + + + + + + + + +
Silahkan isi dalam angka (Contoh:500.000)
+
+
+
+
+ + + +
+
+
+ + + +
+
+
+
+
+
+ ); +}; + +export default Components; diff --git a/apps/dimentorin/src/app/auth/register-mentor/pending/layout.tsx b/apps/dimentorin/src/app/auth/register-mentor/pending/layout.tsx new file mode 100644 index 0000000..2d8a74d --- /dev/null +++ b/apps/dimentorin/src/app/auth/register-mentor/pending/layout.tsx @@ -0,0 +1,12 @@ +import { FC, ReactElement } from 'react'; +import { Outlet } from 'react-router-dom'; + +export const AppLayout: FC = (): ReactElement => { + return ( +
+ +
+ ); +}; + +export default AppLayout; diff --git a/apps/dimentorin/src/app/auth/register-mentor/pending/page.tsx b/apps/dimentorin/src/app/auth/register-mentor/pending/page.tsx new file mode 100644 index 0000000..d25e357 --- /dev/null +++ b/apps/dimentorin/src/app/auth/register-mentor/pending/page.tsx @@ -0,0 +1,41 @@ +import { FC, ReactElement, useEffect } from 'react'; +import { RegisterResetBanner } from '@imphnen-frontend-service/ui/organisms'; +import { Button } from '@imphnen-frontend-service/ui/atoms'; +import { ArrowRightOutlined } from '@ant-design/icons'; + +export const Components: FC = (): ReactElement => { + return ( +
+
+ +
+
+

+ Register Akun Mentor Berhasil +

+

+ Data kamu telah kami terima dan sedang dalam proses verifikasi. +

+ + + + + + +

+ Mohon tunggu maksimal 2 hari kerja untuk proses aktivasi akun. Kami akan menghubungi kamu jika proses telah selesai. +

+ + + +
+
+
+
+ ); +}; + +export default Components; diff --git a/apps/dimentorin/src/app/auth/register-mentor/success/layout.tsx b/apps/dimentorin/src/app/auth/register-mentor/success/layout.tsx new file mode 100644 index 0000000..2d8a74d --- /dev/null +++ b/apps/dimentorin/src/app/auth/register-mentor/success/layout.tsx @@ -0,0 +1,12 @@ +import { FC, ReactElement } from 'react'; +import { Outlet } from 'react-router-dom'; + +export const AppLayout: FC = (): ReactElement => { + return ( +
+ +
+ ); +}; + +export default AppLayout; diff --git a/apps/dimentorin/src/app/auth/register-mentor/success/page.tsx b/apps/dimentorin/src/app/auth/register-mentor/success/page.tsx new file mode 100644 index 0000000..c318b6b --- /dev/null +++ b/apps/dimentorin/src/app/auth/register-mentor/success/page.tsx @@ -0,0 +1,57 @@ +import { FC, ReactElement, useEffect } from 'react'; +import { RegisterResetBanner } from '@imphnen-frontend-service/ui/organisms'; +import { Button } from '@imphnen-frontend-service/ui/atoms'; +import { ArrowRightOutlined } from '@ant-design/icons'; + +export const Components: FC = (): ReactElement => { + return ( +
+
+ +
+
+

+ Register Akun Mentor Berhasil +

+

+ Akun Kamu Telah Berhasil Diverifikasi! +

+ + + + + +

+ Kamu sekarang bisa login dan mulai menggunakan layanan kami. Selamat bergabung! SENPAIIII +

+ + + +
+
+
+
+ ); +}; + +export default Components; diff --git a/apps/dimentorin/src/app/auth/register/otp/page.tsx b/apps/dimentorin/src/app/auth/register/otp/page.tsx index a79b525..9026713 100644 --- a/apps/dimentorin/src/app/auth/register/otp/page.tsx +++ b/apps/dimentorin/src/app/auth/register/otp/page.tsx @@ -32,7 +32,7 @@ export const Components: FC = (): ReactElement => { const m = Math.floor(seconds / 60); const s = seconds % 60; return `${m}:${s.toString().padStart(2, '0')}`; - }; + }; return (
@@ -51,7 +51,7 @@ export const Components: FC = (): ReactElement => { name={'otp'} maxLength={6} control={form.control} - /> + />
-
+
Logo