From 42491f737a4783e9b792d6c700822da5783bb1c3 Mon Sep 17 00:00:00 2001 From: Job Date: Thu, 29 Aug 2024 16:29:41 +1200 Subject: [PATCH 1/5] feat: admin login page --- web/src/app/Router.tsx | 9 ++ .../components/AuthForms/AdminLoginForm.tsx | 89 +++++++++++++++++++ web/src/app/pages/Admin/AdminLogin.page.tsx | 28 ++++++ 3 files changed, 126 insertions(+) create mode 100644 web/src/app/components/AuthForms/AdminLoginForm.tsx create mode 100644 web/src/app/pages/Admin/AdminLogin.page.tsx diff --git a/web/src/app/Router.tsx b/web/src/app/Router.tsx index ba3b266..9f63c01 100644 --- a/web/src/app/Router.tsx +++ b/web/src/app/Router.tsx @@ -18,6 +18,7 @@ import { SponsorSignUp } from './pages/Sponsor/SponsorSignup.page'; import { AlumniSignUp } from './pages/Alumni/AlumniSignup.page'; import { AdminSignUp } from './pages/Admin/AdminSignup.page'; import SignupSwitcher from './pages/General/SignupSwitcher.page'; +import { AdminLogin } from './pages/Admin/AdminLogin.page'; // Protected route is currently commented out. To be enabled once the Authentication Logic has been implemented const router = createBrowserRouter([ @@ -37,6 +38,14 @@ const router = createBrowserRouter([ ), }, + { + path: '/adminlogin', + element: ( + + + + ), + }, { path: '/signup', element: ( diff --git a/web/src/app/components/AuthForms/AdminLoginForm.tsx b/web/src/app/components/AuthForms/AdminLoginForm.tsx new file mode 100644 index 0000000..92f669e --- /dev/null +++ b/web/src/app/components/AuthForms/AdminLoginForm.tsx @@ -0,0 +1,89 @@ +import { + Flex, + TextInput, + PasswordInput, + Checkbox, + Button, + Title, + Text, + useMantineTheme, +} from '@mantine/core'; +import styles from './authform.module.css'; +import { NavLink } from 'react-router-dom'; +import { useNavigate } from 'react-router-dom'; +import { useDispatch } from 'react-redux'; +import { setUserType } from '../../features/user/userSlice'; +import { toast } from 'react-toastify'; + +export function AdminLoginForm() { + const dispatch = useDispatch(); + const navigate = useNavigate(); + const theme = useMantineTheme(); + const handleLoginAs = (userType: 'student' | 'sponsor' | 'alumni' | 'admin') => { + // Simulate successful login (to be replaced with the actual authentication logic) + const mockToken = 'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9...'; + localStorage.setItem('accessToken', mockToken); + // If authentication is successful: Update Redux store with userType + dispatch(setUserType(userType)); + // Redirect to the appropriate profile page based on userType + const profilePath = { + student: '/profile/student', + sponsor: '/profile/sponsor', + alumni: '/profile/alumni', + admin: '/profile/admin', + }[userType]; + toast.success('Logged in as ' + userType); + navigate(profilePath, { replace: true }); + }; + + const handleLogin = () => { + console.log('Login button clicked'); + }; + + return ( + +
+ + Login + + + + + + + + + + + Don't have an account?{' '} + + Sign up + + + + Forget your{' '} + + password? + + + +
+ ); +} diff --git a/web/src/app/pages/Admin/AdminLogin.page.tsx b/web/src/app/pages/Admin/AdminLogin.page.tsx new file mode 100644 index 0000000..4112dff --- /dev/null +++ b/web/src/app/pages/Admin/AdminLogin.page.tsx @@ -0,0 +1,28 @@ +import { AdminLoginForm } from '@/app/components/AuthForms/AdminLoginForm'; +import { LoginForm } from '../../components/AuthForms/LoginForm'; +import { LoginSideImage } from '../../components/LoginSideImage/LoginSideImage'; +import { Grid } from '@mantine/core'; +import { useMediaQuery } from '@mantine/hooks'; + +export function AdminLogin() { + const isSmallScreen = useMediaQuery('(max-width: 768px)'); + + return ( + + {isSmallScreen ? ( + + + + ) : ( + <> + + + + + + + + )} + + ); +} From 49628631c6c98ca17588ba15dcf9d90e4adde83e Mon Sep 17 00:00:00 2001 From: Job Date: Thu, 29 Aug 2024 19:19:15 +1200 Subject: [PATCH 2/5] fix: removed signup and forgot password, need to change router 2 be more secure --- web/src/app/components/AuthForms/AdminLoginForm.tsx | 12 ------------ 1 file changed, 12 deletions(-) diff --git a/web/src/app/components/AuthForms/AdminLoginForm.tsx b/web/src/app/components/AuthForms/AdminLoginForm.tsx index 92f669e..d7b10fb 100644 --- a/web/src/app/components/AuthForms/AdminLoginForm.tsx +++ b/web/src/app/components/AuthForms/AdminLoginForm.tsx @@ -71,18 +71,6 @@ export function AdminLoginForm() { Temp Admin Login - - Don't have an account?{' '} - - Sign up - - - - Forget your{' '} - - password? - - ); From 02f88f8ef1f98b2d1f449e6db680ab423b55946b Mon Sep 17 00:00:00 2001 From: Job Date: Wed, 4 Sep 2024 15:09:28 +1200 Subject: [PATCH 3/5] fix: update router for admin login --- web/src/app/Router.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/web/src/app/Router.tsx b/web/src/app/Router.tsx index 9f63c01..5ad98dc 100644 --- a/web/src/app/Router.tsx +++ b/web/src/app/Router.tsx @@ -39,7 +39,7 @@ const router = createBrowserRouter([ ), }, { - path: '/adminlogin', + path: '/fsae-administrator-login', element: ( From 7ded4b4fc57bb3a42d1ade2c9fe43de432bd6e01 Mon Sep 17 00:00:00 2001 From: Job Date: Thu, 5 Sep 2024 01:21:58 +1200 Subject: [PATCH 4/5] chore: remove unused imports --- web/src/app/components/AuthForms/AdminLoginForm.tsx | 1 - web/src/app/pages/Admin/AdminLogin.page.tsx | 1 - 2 files changed, 2 deletions(-) diff --git a/web/src/app/components/AuthForms/AdminLoginForm.tsx b/web/src/app/components/AuthForms/AdminLoginForm.tsx index d7b10fb..1b99bb7 100644 --- a/web/src/app/components/AuthForms/AdminLoginForm.tsx +++ b/web/src/app/components/AuthForms/AdminLoginForm.tsx @@ -5,7 +5,6 @@ import { Checkbox, Button, Title, - Text, useMantineTheme, } from '@mantine/core'; import styles from './authform.module.css'; diff --git a/web/src/app/pages/Admin/AdminLogin.page.tsx b/web/src/app/pages/Admin/AdminLogin.page.tsx index 4112dff..f70cf95 100644 --- a/web/src/app/pages/Admin/AdminLogin.page.tsx +++ b/web/src/app/pages/Admin/AdminLogin.page.tsx @@ -1,5 +1,4 @@ import { AdminLoginForm } from '@/app/components/AuthForms/AdminLoginForm'; -import { LoginForm } from '../../components/AuthForms/LoginForm'; import { LoginSideImage } from '../../components/LoginSideImage/LoginSideImage'; import { Grid } from '@mantine/core'; import { useMediaQuery } from '@mantine/hooks'; From 129c4dd9de287e5be0de04738d9d4c6674b51b55 Mon Sep 17 00:00:00 2001 From: Kinzi <100537572+Kinzi-c@users.noreply.github.com> Date: Sun, 8 Sep 2024 06:54:52 +1200 Subject: [PATCH 5/5] Remove unused imports and add missing FC imports in settings --- web/src/app/components/Tabs/EmailTab.tsx | 5 ++--- web/src/app/components/Tabs/PasswordTab.tsx | 4 ++-- 2 files changed, 4 insertions(+), 5 deletions(-) diff --git a/web/src/app/components/Tabs/EmailTab.tsx b/web/src/app/components/Tabs/EmailTab.tsx index 7ddbb9f..aecad36 100644 --- a/web/src/app/components/Tabs/EmailTab.tsx +++ b/web/src/app/components/Tabs/EmailTab.tsx @@ -1,6 +1,6 @@ -import { Stack, TextInput, PasswordInput, Flex } from '@mantine/core'; +import { Stack, TextInput, Flex } from '@mantine/core'; import styles from '../Tabs/Settings.module.css'; -import { useState } from 'react'; +import { useState, FC } from 'react'; interface EmailTabProp { email: string; @@ -9,7 +9,6 @@ interface EmailTabProp { const EmailTab: FC = ({ email }) => { const [isPortrait, setIsPortrait] = useState(window.innerHeight > window.innerWidth); - return ( diff --git a/web/src/app/components/Tabs/PasswordTab.tsx b/web/src/app/components/Tabs/PasswordTab.tsx index 49b3622..4fc5357 100644 --- a/web/src/app/components/Tabs/PasswordTab.tsx +++ b/web/src/app/components/Tabs/PasswordTab.tsx @@ -1,6 +1,6 @@ -import { Stack, TextInput, PasswordInput, Flex } from '@mantine/core'; +import { Stack, PasswordInput, Flex } from '@mantine/core'; import styles from '../Tabs/Settings.module.css'; -import { useState } from 'react'; +import { useState, FC } from 'react'; interface PasswordTabProp { password: string;