Fix

hackclub · Feb 3, 2025 · c9a59e1 · c9a59e1
1 parent 187db6c
commit c9a59e1
Showing 1 changed file with 37 additions and 15 deletions.
diff --git a/src/app/harbor/tavern/tavern.tsx b/src/app/harbor/tavern/tavern.tsx
@@ -58,6 +58,7 @@ const RsvpStatusSwitcher = ({
   const [editedFlag, setEditedFlag] = useState(false)
   const [attendeeNoOrganizerModal, setAttendeeNoOrganizerModal] =
     useState(false)
+  const [submitting, setSubmitting] = useState(false)
 
   const { toast } = useToast()
 
@@ -128,21 +129,40 @@ const RsvpStatusSwitcher = ({
       </Modal>
 
       <form
-        action={async (formData: FormData) => {
-          const rsvpResponse = JSON.parse(await rspvForTavern(formData))
-
-          if (rsvpResponse.success) {
-            toast({
-              title: 'Saved',
-              description:
-                editMessages[Math.floor(Math.random() * editMessages.length)],
+        onSubmit={(e) => {
+          e.preventDefault() // Prevent default form submission
+          setSubmitting(true)
+
+          rspvForTavern(new FormData(e.currentTarget))
+            .then((res) => {
+              const rsvpResponse = JSON.parse(res)
+
+              if (rsvpResponse.success) {
+                toast({
+                  title: 'Saved',
+                  description:
+                    editMessages[
+                      Math.floor(Math.random() * editMessages.length)
+                    ],
+                })
+              } else {
+                toast({
+                  title: 'Error',
+                  description: `Failed to save your changes:\n${rsvpResponse.error}`,
+                })
+              }
+              setSubmitting(false)
+              setEditedFlag(false)
             })
-          } else {
-            toast({
-              title: 'Error',
-              description: `Failed to save your changes:\n${rsvpResponse.error}`,
+            .catch((error) => {
+              console.error('Submission error:', error)
+              toast({
+                title: 'Error',
+                description: 'An unexpected error occurred',
+              })
+              setSubmitting(false)
+              setEditedFlag(false)
             })
-          }
         }}
         className="flex flex-col justify-items-stretch gap-2"
       >
@@ -263,8 +283,10 @@ const RsvpStatusSwitcher = ({
             <p className="text-orange-500">You have unsaved changes!</p>
           ) : null}
 
-          <Button type="submit" disabled={!editedFlag}>
-            Submit {editedFlag ? ' your changes' : ''}
+          <Button type="submit" disabled={!editedFlag || submitting}>
+            {submitting
+              ? 'Submitting, please be patient!'
+              : `Submit ${editedFlag ? ' your changes' : ''}`}
           </Button>
         </div>
       </form>