1 files changed, 19 insertions, 17 deletions
diff --git a/src/components/RsvpForm.tsx b/src/components/RsvpForm.tsx
index 448401e..6c43ae8 100644
--- a/src/components/RsvpForm.tsx
+++ b/src/components/RsvpForm.tsx
@@ -36,7 +36,7 @@ function RsvpForm() {
   };
 
   return (
-    <Container component="form" maxWidth="sm" onSubmit={handleSubmit(onSubmit)}>
+    <Container component="form" maxWidth="sm" noValidate onSubmit={handleSubmit(onSubmit)}>
       <Grid container spacing={2} sx={{ mt: 8 }}>
         <Grid item xs={12} md={4} lg={4}>
           <Typography>Date: April 14, 2025</Typography>
@@ -49,12 +49,12 @@ function RsvpForm() {
         </Grid>
         <Grid item lg={12}>
           <FormControl>
-            <Box 
-              sx={{ display: "flex", 
-              flexDirection: "row", 
+            <Box
+              sx={{ display: "flex",
+              flexDirection: "row",
               alignItems: "center" }}
             >
-              <FormLabel sx={{ mr: 2 }} error={!!errors.attendance}>
+              <FormLabel sx={{ mr: 2 }} error={!!errors.attendance} required>
                 Will you attend?
               </FormLabel>
               <Controller
@@ -86,10 +86,11 @@ function RsvpForm() {
             fullWidth
             error={!!errors.email}
             helperText={errors.email?.message}
-            {...register("email", 
-              { required: "Please enter your email address", 
-                pattern: { value: /\S+@\S+\.\S+/, 
-                  message: "Please enter a valid email address" } 
+            required
+            {...register("email",
+              { required: "This field is required",
+                pattern: { value: /\S+@\S+\.\S+/,
+                  message: "Please enter a valid email address" }
               })}
           />
         </Grid>
@@ -101,9 +102,10 @@ function RsvpForm() {
             fullWidth
             error={!!errors.partySize}
             helperText={errors.partySize?.message}
-            {...register("partySize", 
-              { required: "Please enter your party size", 
-                min: { value: 1, message: "Please enter a positive integer" }, 
+            required
+            {...register("partySize",
+              { required: "This field is required",
+                min: { value: 1, message: "Please enter a positive integer" },
                 max: { value: 9, message: "Please enter an integer less than 10" } })}
           />
         </Grid>
@@ -118,13 +120,13 @@ function RsvpForm() {
           />
         </Grid>
         <Grid item xs={12}>
-          <Box 
-            sx={{ display: "flex", 
-            flexDirection: "column", 
+          <Box
+            sx={{ display: "flex",
+            flexDirection: "column",
             alignItems: "center" }}
           >
-            <Button 
-              type="submit" 
+            <Button
+              type="submit"
               variant="contained"
             >
               RSVP