diff --git a/app/src/components/common/Header.tsx b/app/src/components/common/Header.tsx index 6f86ec42..1093a225 100644 --- a/app/src/components/common/Header.tsx +++ b/app/src/components/common/Header.tsx @@ -18,7 +18,17 @@ import {useAuth} from '../../app/hooks/useAuth'; import {useSignOutMutation} from '../../services/auth'; import {useAppDispatch} from '../../app/hooks/store'; import {setCredentials} from '../../app/authSlice'; -import {useNavigate} from 'react-router-dom'; +import {Link, useNavigate} from 'react-router-dom'; + +const userName = 'Hank Hill'; + +function getInitials(name: string) { + const splitName = name.split(' '); + + if (splitName.length === 1) return splitName[0][0]; + + return splitName[0][0] + splitName[splitName.length - 1][0]; +} interface Props { /** @@ -104,23 +114,12 @@ export const Header = (props: Props) => { Home Unite Us logo - - Home Unite Us - - {!user ? ( {navItems.map(({title, href}) => { @@ -142,7 +141,8 @@ export const Header = (props: Props) => { - + {/* Replace with real user name */} + {getInitials(userName)} { open={Boolean(anchorElUser)} onClose={handleCloseUserMenu} > - - {user.email} + + Settings - - Account + + Help Logout diff --git a/app/src/main.tsx b/app/src/main.tsx index 0079908d..6a40e97b 100644 --- a/app/src/main.tsx +++ b/app/src/main.tsx @@ -35,6 +35,7 @@ import { EmailVerificationError, ForgotPasswordCode, ForgotPasswordSuccess, + Settings, } from './views'; import {AccountVerification} from './views/AccountVerification'; import {AppLayout, Header} from './components/common'; @@ -59,6 +60,7 @@ function HuuApp() { } /> } /> } /> + } /> { + return ( + + Settings + + ); +}; diff --git a/app/src/views/index.ts b/app/src/views/index.ts index 4dd17cf7..356bea88 100644 --- a/app/src/views/index.ts +++ b/app/src/views/index.ts @@ -12,3 +12,4 @@ export {EmailVerificationSuccess} from './EmailVerificationSuccess'; export {EmailVerificationError} from './EmailVerificationError'; export {ForgotPasswordCode} from './ForgotPasswordCode'; export {ForgotPasswordSuccess} from './ForgotPasswordSuccess'; +export {Settings} from './Settings';