From 14dedf0101139341dcbe472de28070bbf2f6a3bf Mon Sep 17 00:00:00 2001
From: Domagoj Kriskovic <dom.kriskovic@overleaf.com>
Date: Fri, 31 Jan 2025 11:05:16 +0100
Subject: [PATCH] Prevent adding multiple replies by hitting enter while
 submitting (#23240)

GitOrigin-RevId: 342aa30f89f3ac0b0b25ab931dd4df1d956aa4a1
---
 .../review-panel-comment-content.tsx          | 20 ++++++++++++++++---
 1 file changed, 17 insertions(+), 3 deletions(-)

diff --git a/services/web/frontend/js/features/review-panel-new/components/review-panel-comment-content.tsx b/services/web/frontend/js/features/review-panel-new/components/review-panel-comment-content.tsx
index c4f1284d36..c85c69d7b7 100644
--- a/services/web/frontend/js/features/review-panel-new/components/review-panel-comment-content.tsx
+++ b/services/web/frontend/js/features/review-panel-new/components/review-panel-comment-content.tsx
@@ -1,4 +1,4 @@
-import { memo, useCallback } from 'react'
+import { memo, useCallback, useState } from 'react'
 import { Change, CommentOperation } from '../../../../../types/change'
 import { ReviewPanelMessage } from './review-panel-message'
 import { useTranslation } from 'react-i18next'
@@ -38,10 +38,24 @@ export const ReviewPanelCommentContent = memo<{
     const { t } = useTranslation()
     const threads = useThreadsContext()
     const permissions = usePermissionsContext()
+    const [submitting, setSubmitting] = useState(false)
 
     const handleSubmit = useCallback(
-      (content, setContent) => onReply?.(content).then(() => setContent('')),
-      [onReply]
+      (content, setContent) => {
+        if (!onReply || submitting) {
+          return
+        }
+
+        setSubmitting(true)
+        onReply(content)
+          .then(() => {
+            setContent('')
+          })
+          .finally(() => {
+            setSubmitting(false)
+          })
+      },
+      [onReply, submitting]
     )
 
     const { handleChange, handleKeyPress, content } =