diff options
Diffstat (limited to 'src/components/Rsvp.tsx')
-rw-r--r-- | src/components/Rsvp.tsx | 118 |
1 files changed, 20 insertions, 98 deletions
diff --git a/src/components/Rsvp.tsx b/src/components/Rsvp.tsx index 81f37fc..858ca71 100644 --- a/src/components/Rsvp.tsx +++ b/src/components/Rsvp.tsx @@ -1,107 +1,29 @@ import { useState } from 'react'; -import Button from '@mui/material/Button'; -import Paper from '@mui/material/Paper'; -import Grid from '@mui/material/Grid'; -import TextField from '@mui/material/TextField'; -import Typography from '@mui/material/Typography'; -import Radio from '@mui/material/Radio'; -import RadioGroup from '@mui/material/RadioGroup'; -import FormControlLabel from '@mui/material/FormControlLabel'; -import FormControl from '@mui/material/FormControl'; -import FormLabel from '@mui/material/FormLabel'; +import RsvpForm from './RsvpForm'; +import GuestLogin from './GuestLogin'; +import { useGetGuestsQuery } from '../apiSlice' function Rsvp() { - const [guestList, setGuestList] = useState([]); + // Enter your name to RSVP; query the database + const [loggedIn, setLoggedIn] = useState(false); - const onAddBtnClick = event => { - setGuestList(guestList.concat( - <Grid container spacing={2}> - <Grid item xs={6} md={6} lg={6}> - <TextField key={guestList.length} label="Name" variant="outlined" /> - </Grid> - <Grid item xs={6} md={6} lg={6}> - <FormControl> - <FormLabel>Meal Preference</FormLabel> - <RadioGroup> - <FormControlLabel - value="Beef" - control={<Radio />} - label="Beef" - /> - <FormControlLabel - value="Chicken" - control={<Radio />} - label="Chicken" - /> - <FormControlLabel - value="Fish" - control={<Radio />} - label="Fish" - /> - <FormControlLabel - value="Vegetarian" - control={<Radio />} - label="Vegetarian" - /> - </RadioGroup> - </FormControl> - </Grid> - </Grid> - )); - } + const { + data: guests, + isLoading, + isSuccess, + isError, + error + } = useGetGuestsQuery() return ( - <Paper> - <Grid container spacing={2}> - <Grid item xs={4} md={4} lg={4}> - <Typography>Date: April 14, 2025</Typography> - </Grid> - <Grid item xs={4} md={4} lg={4}> - <Typography>Location: </Typography> - </Grid> - <Grid item xs={4} md={4} lg={4}> - <Typography>RSVP Deadline: </Typography> - </Grid> - <Grid item xs={4} md={4} lg={4}> - <TextField required label="Name" variant="outlined" /> - </Grid> - <Grid item xs={4} md={4} lg={4}> - <FormControl> - <FormLabel>Are you attending?</FormLabel> - <RadioGroup> - <FormControlLabel value="Yes" control={<Radio />} label="Yes" /> - <FormControlLabel value="No" control={<Radio />} label="No" /> - </RadioGroup> - </FormControl> - </Grid> - <Grid item xs={4} md={4} lg={4}> - <Button - onClick={onAddBtnClick} - sx={{ maxWidth: 240 }} - variant="contained"> - Add Additional Guests - {/* TODO: only allow guests we've selected; allow kids? */} - </Button> - </Grid> - {guestList} - <Grid item xs={6} md={6} lg={6}> - <TextField - label="Dietary Restrictions" - variant="outlined" - /> - </Grid> - <Grid item xs={6} md={6} lg={6}> - <TextField - label="Song Request" - variant="outlined" - /> - </Grid> - <Grid item> - <Button sx={{ maxWidth: 80 }} variant="contained">Submit</Button> - </Grid> - </Grid> - </Paper> - ); + <> + {loggedIn ? ( + <RsvpForm /> + ) : ( + <GuestLogin loggedIn={loggedIn} setLoggedIn={setLoggedIn} /> + )} + </> + ) } export default Rsvp; |