From 55338c557631d2237dcb1e9de4fe663b2de1adf6 Mon Sep 17 00:00:00 2001
From: Jackson Harper <jacksonh@gmail.com>
Date: Thu, 14 Jul 2022 17:44:37 -0700
Subject: [PATCH] Put the Add Note form in a form element so submit works

---
 .../templates/article/HighlightNoteModal.tsx  | 48 +++++++++++--------
 1 file changed, 28 insertions(+), 20 deletions(-)

diff --git a/packages/web/components/templates/article/HighlightNoteModal.tsx b/packages/web/components/templates/article/HighlightNoteModal.tsx
index cece1ecb5..38283f7cb 100644
--- a/packages/web/components/templates/article/HighlightNoteModal.tsx
+++ b/packages/web/components/templates/article/HighlightNoteModal.tsx
@@ -82,26 +82,34 @@ export function HighlightNoteModal(
           event.preventDefault()
         }}
       >
-        <VStack>
-          <ModalTitleBar title="Notes" onOpenChange={props.onOpenChange} />
-          <StyledTextArea
-            css={{
-              mt: '16px',
-              p: '6px',
-              width: '100%',
-              height: '248px',
-              fontSize: '14px',
-              border: '1px solid $textNonessential',
-              borderRadius: '6px'
-            }}
-            autoFocus
-            placeholder={'Add your note here'}
-            value={noteContent}
-            onChange={handleNoteContentChange}
-            maxLength={4000}
-          />
-          <ModalButtonBar onOpenChange={props.onOpenChange} acceptButtonLabel="Save" />
-        </VStack>
+        <form
+          onSubmit={(event) => {
+            event.preventDefault()
+            saveNoteChanges()
+            props.onOpenChange(false)
+          }}
+        >
+          <VStack>
+            <ModalTitleBar title="Notes" onOpenChange={props.onOpenChange} />
+            <StyledTextArea
+              css={{
+                mt: '16px',
+                p: '6px',
+                width: '100%',
+                height: '248px',
+                fontSize: '14px',
+                border: '1px solid $textNonessential',
+                borderRadius: '6px'
+              }}
+              autoFocus
+              placeholder={'Add your note here'}
+              value={noteContent}
+              onChange={handleNoteContentChange}
+              maxLength={4000}
+            />
+            <ModalButtonBar onOpenChange={props.onOpenChange} acceptButtonLabel="Save" />
+          </VStack>
+        </form>
       </ModalContent>
     </ModalRoot>
   )