diff options
Diffstat (limited to 'client/src/components')
-rw-r--r-- | client/src/components/AdminLogin.tsx | 2 | ||||
-rw-r--r-- | client/src/components/Dashboard.tsx | 42 | ||||
-rw-r--r-- | client/src/components/RsvpForm.tsx | 2 |
3 files changed, 35 insertions, 11 deletions
diff --git a/client/src/components/AdminLogin.tsx b/client/src/components/AdminLogin.tsx index d9c1260..92e5335 100644 --- a/client/src/components/AdminLogin.tsx +++ b/client/src/components/AdminLogin.tsx @@ -5,7 +5,7 @@ import { Button, Paper, TextField, Typography } from '@mui/material'; import { useForm } from 'react-hook-form'; import { setAdmin } from '../slices/auth/adminSlice'; import { useLoginAdminMutation } from '../slices/api/adminSlice'; -import type { AdminLoginRequest } from '../slices/api/adminSlice'; +import type { AdminLoginRequest } from '../models'; function GuestLogin() { const dispatch = useDispatch(); diff --git a/client/src/components/Dashboard.tsx b/client/src/components/Dashboard.tsx index 20758fc..40c84f6 100644 --- a/client/src/components/Dashboard.tsx +++ b/client/src/components/Dashboard.tsx @@ -5,7 +5,7 @@ import { useMaterialReactTable, type MRT_ColumnDef, } from 'material-react-table'; -import type { Guest } from '../slices/api/adminSlice'; +import type { Guest } from '../models'; function Dashboard() { const guests: Guest[] = useOutletContext(); @@ -14,12 +14,12 @@ function Dashboard() { { accessorKey: 'firstName', header: 'First Name', - size: 150, + size: 50, }, { accessorKey: 'lastName', header: 'Last Name', - size: 150, + size: 50, }, { accessorKey: 'attendance', @@ -41,20 +41,44 @@ function Dashboard() { header: 'Party Size', size: 50, }, - // { - // accessorKey: 'partyList', - // header: 'Party List', - // size: 150, - // }, ], [] ); const table = useMaterialReactTable({ columns, data: guests, + renderDetailPanel: ({ row }) => + row.original.partySize > 1 + ? row.original.partyList.map((guest, index) => { + return ( + <div + key={index} + style={{ + width: '32%', + display: 'flex', + justifyContent: 'space-around', + }} + > + <p>{guest.firstName}</p> + <p>{guest.lastName}</p> + </div> + ); + }) + : null, }); - return <MaterialReactTable table={table} />; + return ( + <div + style={{ + display: 'flex', + justifyContent: 'center', + }} + > + <div style={{ marginTop: 128 }}> + <MaterialReactTable table={table} /> + </div> + </div> + ); } export default Dashboard; diff --git a/client/src/components/RsvpForm.tsx b/client/src/components/RsvpForm.tsx index d72b92d..c7c30f4 100644 --- a/client/src/components/RsvpForm.tsx +++ b/client/src/components/RsvpForm.tsx @@ -17,7 +17,7 @@ import { import MailIcon from '@mui/icons-material/Mail'; import { useForm, Controller, useFieldArray } from 'react-hook-form'; import { useUpdateGuestMutation } from '../slices/api/guestSlice'; -import type { Guest } from '../slices/api/guestSlice'; +import type { Guest } from '../models'; interface StatusProps { isError: boolean; |