From 5a811b417db6ab0d237c11e4b5788ce80cc9e451 Mon Sep 17 00:00:00 2001
From: Sinclair Chen <abc.sinclair@gmail.com>
Date: Tue, 2 Aug 2022 16:59:27 -0700
Subject: [PATCH] Re-add submit on enter

---
 web/components/feed/feed-comments.tsx | 35 +++++++++++++++++++++++----
 1 file changed, 30 insertions(+), 5 deletions(-)

diff --git a/web/components/feed/feed-comments.tsx b/web/components/feed/feed-comments.tsx
index d4f7dddc..a53d1ce7 100644
--- a/web/components/feed/feed-comments.tsx
+++ b/web/components/feed/feed-comments.tsx
@@ -461,11 +461,39 @@ export function CommentInputTextArea(props: {
     isSubmitting,
     replyToUsername,
   } = props
-  const { width } = useWindowSize()
+  const isMobile = (useWindowSize().width ?? 0) < 768 // TODO: base off input device (keybord vs touch)
+
   useEffect(() => {
     editor?.setEditable(!isSubmitting)
   }, [isSubmitting, editor])
 
+  const submit = () => {
+    submitComment(presetId)
+    editor?.commands?.clearContent()
+  }
+
+  useEffect(() => {
+    editor?.setOptions({
+      editorProps: {
+        handleKeyDown: (view, event) => {
+          if (
+            event.key === 'Enter' &&
+            !event.shiftKey &&
+            (!isMobile || event.ctrlKey || event.metaKey) &&
+            // mention list is closed
+            !(view.state as any).mention$.active
+          ) {
+            submit()
+            event.preventDefault()
+            return true
+          }
+          return false
+        },
+      },
+    })
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [editor])
+
   // TODO: make at mention show up at beginning
   return (
     <>
@@ -479,10 +507,7 @@ export function CommentInputTextArea(props: {
                 (!editor || editor.isEmpty) &&
                   'pointer-events-none text-gray-500'
               )}
-              onClick={() => {
-                submitComment(presetId)
-                editor?.commands.clearContent()
-              }}
+              onClick={submit}
             >
               <PaperAirplaneIcon
                 className={'m-0 min-w-[22px] rotate-90 p-0 '}