From d6e0e70fca9a1cf7dedc3513a0b406f8b2ee709a Mon Sep 17 00:00:00 2001 From: Zavier Miller Date: Tue, 14 Nov 2023 22:45:21 -0500 Subject: [PATCH 1/2] snackbar hook --- apps/applicant-tracking/src/app/layout.tsx | 37 ++++++++++++--- apps/applicant-tracking/src/app/page.tsx | 20 ++++++++- .../src/hooks/useSnackbar/SnackbarContext.tsx | 45 +++++++++++++++++++ .../src/hooks/useSnackbar/index.ts | 16 +++++++ 4 files changed, 112 insertions(+), 6 deletions(-) create mode 100644 apps/applicant-tracking/src/hooks/useSnackbar/SnackbarContext.tsx create mode 100644 apps/applicant-tracking/src/hooks/useSnackbar/index.ts diff --git a/apps/applicant-tracking/src/app/layout.tsx b/apps/applicant-tracking/src/app/layout.tsx index 5ee9057..3e7dd24 100644 --- a/apps/applicant-tracking/src/app/layout.tsx +++ b/apps/applicant-tracking/src/app/layout.tsx @@ -1,7 +1,12 @@ -export const metadata = { - title: 'Next.js', - description: 'Generated by Next.js', -}; +'use client'; +import { SnackbarProvider } from '@/hooks/useSnackbar'; +import { Alert, AlertColor, Snackbar } from '@mui/material'; +import React from 'react'; + +// export const metadata = { +// title: 'Next.js', +// description: 'Generated by Next.js', +// }; export default function RootLayout({ children, @@ -10,7 +15,29 @@ export default function RootLayout({ }) { return ( - {children} + + ( + + + {message} + + + )} + > + {children} + + ); } diff --git a/apps/applicant-tracking/src/app/page.tsx b/apps/applicant-tracking/src/app/page.tsx index 19b4b6a..f8b5cbb 100644 --- a/apps/applicant-tracking/src/app/page.tsx +++ b/apps/applicant-tracking/src/app/page.tsx @@ -1,3 +1,21 @@ +'use client'; + +import useSnackbar from '@/hooks/useSnackbar'; +import { Button } from '@mui/material'; + export default function DashboardPage() { - return

Dashboard page

; + const { openSnackbar } = useSnackbar(); + return ( + <> +

Dashboard page

+ + + ); } diff --git a/apps/applicant-tracking/src/hooks/useSnackbar/SnackbarContext.tsx b/apps/applicant-tracking/src/hooks/useSnackbar/SnackbarContext.tsx new file mode 100644 index 0000000..d425fae --- /dev/null +++ b/apps/applicant-tracking/src/hooks/useSnackbar/SnackbarContext.tsx @@ -0,0 +1,45 @@ +import React from 'react'; +import { createContext } from 'react'; + +export type SnackbarContextType = { + openSnackbar: (message: string, severity: string) => void; + closeSnackbar: () => void; +}; + +export const SnackbarContext = createContext(null); + +type SnackbarProviderProps = { + snackbar: ( + open: boolean, + onClose: () => void, + message?: string, + severity?: string + ) => React.ReactNode; + children: React.ReactNode; +}; + +const SnackbarProvider = ({ snackbar, children }: SnackbarProviderProps) => { + const [open, setOpen] = React.useState(false); + const [message, setMessage] = React.useState(''); + const [severity, setSeverity] = React.useState(''); + + const onClose = () => setOpen(false); + + return ( + { + setOpen(true); + setMessage(message); + setSeverity(severity); + }, + closeSnackbar: () => setOpen(false), + }} + > + {children} + {snackbar(open, onClose, message, severity)} + + ); +}; + +export default SnackbarProvider; diff --git a/apps/applicant-tracking/src/hooks/useSnackbar/index.ts b/apps/applicant-tracking/src/hooks/useSnackbar/index.ts new file mode 100644 index 0000000..7ba9ee7 --- /dev/null +++ b/apps/applicant-tracking/src/hooks/useSnackbar/index.ts @@ -0,0 +1,16 @@ +'use client'; +import { useContext } from 'react'; +import SnackbarProvider, { + SnackbarContext, + SnackbarContextType, +} from './SnackbarContext'; + +export default function useSnackbar() { + const { openSnackbar, closeSnackbar } = useContext( + SnackbarContext + ) as SnackbarContextType; + + return { openSnackbar, closeSnackbar }; +} + +export { SnackbarProvider }; From 5f9ce87977a74fbdda742d9332b26bb9fac498b7 Mon Sep 17 00:00:00 2001 From: Zavier Miller Date: Wed, 15 Nov 2023 18:09:10 -0500 Subject: [PATCH 2/2] wip --- apps/applicant-tracking/src/app/layout.tsx | 34 ++++--------------- .../src/components/ATSAppBar/index.tsx | 0 .../src/components/Layout/index.tsx | 34 +++++++++++++++++++ 3 files changed, 40 insertions(+), 28 deletions(-) create mode 100644 apps/applicant-tracking/src/components/ATSAppBar/index.tsx create mode 100644 apps/applicant-tracking/src/components/Layout/index.tsx diff --git a/apps/applicant-tracking/src/app/layout.tsx b/apps/applicant-tracking/src/app/layout.tsx index 3e7dd24..a7bdf53 100644 --- a/apps/applicant-tracking/src/app/layout.tsx +++ b/apps/applicant-tracking/src/app/layout.tsx @@ -1,12 +1,10 @@ -'use client'; -import { SnackbarProvider } from '@/hooks/useSnackbar'; -import { Alert, AlertColor, Snackbar } from '@mui/material'; +import Layout from '@/components/Layout'; import React from 'react'; -// export const metadata = { -// title: 'Next.js', -// description: 'Generated by Next.js', -// }; +export const metadata = { + title: 'Next.js', + description: 'Generated by Next.js', +}; export default function RootLayout({ children, @@ -16,27 +14,7 @@ export default function RootLayout({ return ( - ( - - - {message} - - - )} - > - {children} - + {children} ); diff --git a/apps/applicant-tracking/src/components/ATSAppBar/index.tsx b/apps/applicant-tracking/src/components/ATSAppBar/index.tsx new file mode 100644 index 0000000..e69de29 diff --git a/apps/applicant-tracking/src/components/Layout/index.tsx b/apps/applicant-tracking/src/components/Layout/index.tsx new file mode 100644 index 0000000..72f70fc --- /dev/null +++ b/apps/applicant-tracking/src/components/Layout/index.tsx @@ -0,0 +1,34 @@ +'use client'; + +import { SnackbarProvider } from '@/hooks/useSnackbar'; +import { Snackbar, Alert, AlertColor } from '@mui/material'; + +interface LayoutProps { + children: React.ReactNode; +} + +export default function Layout({ children }: LayoutProps) { + return ( + ( + + + {message} + + + )} + > + {children} + + ); +}