From 38107910f98a34d48c34141707e8d034c38d8f3a Mon Sep 17 00:00:00 2001
From: Peng Xiao <pengxiao@outlook.com>
Date: Thu, 17 Jul 2025 15:23:40 +0800
Subject: [PATCH] fix(core): comment action button bg color (#13250)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

fix BS-3623

Also use enter instead of enter+CMD/CTRL to commit comment/reply

#### PR Dependency Tree


* **PR #13250** 👈

This tree was auto-generated by
[Charcoal](https://github.com/danerwilliams/charcoal)

<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->

## Summary by CodeRabbit

* **New Features**
* Updated comment editor so comments are now submitted by pressing Enter
(without CMD or CTRL).
* **Style**
* Improved visual styling for action buttons in the comment sidebar for
a more consistent appearance.

<!-- end of auto-generated comment: release notes by coderabbit.ai -->
---
 .../core/src/components/comment/comment-editor/index.tsx    | 6 +++---
 .../frontend/core/src/components/comment/sidebar/index.tsx  | 2 ++
 .../core/src/components/comment/sidebar/style.css.ts        | 4 ++++
 3 files changed, 9 insertions(+), 3 deletions(-)

diff --git a/packages/frontend/core/src/components/comment/comment-editor/index.tsx b/packages/frontend/core/src/components/comment/comment-editor/index.tsx
index f948ea4a28..bec8847550 100644
--- a/packages/frontend/core/src/components/comment/comment-editor/index.tsx
+++ b/packages/frontend/core/src/components/comment/comment-editor/index.tsx
@@ -514,7 +514,7 @@ export const CommentEditor = forwardRef<CommentEditorRef, CommentEditorProps>(
       return;
     }, [doc, onChange, snapshotHelper]);
 
-    // Add keydown handler to commit on CMD/CTRL + Enter key
+    // Add keydown handler to commit on Enter key
     const handleKeyDown = useCallback(
       (e: React.KeyboardEvent) => {
         if (readonly) return;
@@ -523,8 +523,8 @@ export const CommentEditor = forwardRef<CommentEditorRef, CommentEditorProps>(
         const activeElement = document.activeElement;
         if (!editorRef.current?.contains(activeElement)) return;
 
-        // If Enter is pressed with CMD/CTRL key, commit the comment
-        if (e.key === 'Enter' && (e.metaKey || e.ctrlKey)) {
+        // If Enter is pressed without CMD/CTRL key, commit the comment
+        if (e.key === 'Enter' && !(e.metaKey || e.ctrlKey)) {
           e.preventDefault();
           e.stopPropagation();
           handleCommit();
diff --git a/packages/frontend/core/src/components/comment/sidebar/index.tsx b/packages/frontend/core/src/components/comment/sidebar/index.tsx
index 395bb935a1..fb860810a6 100644
--- a/packages/frontend/core/src/components/comment/sidebar/index.tsx
+++ b/packages/frontend/core/src/components/comment/sidebar/index.tsx
@@ -157,6 +157,7 @@ const ActionMenu = ({
       }
     >
       <IconButton
+        className={styles.actionButton}
         variant="solid"
         icon={<MoreHorizontalIcon />}
         disabled={disabled}
@@ -491,6 +492,7 @@ const CommentItem = ({
       >
         {canResolveComment && (
           <IconButton
+            className={styles.actionButton}
             variant="solid"
             onClick={handleResolve}
             icon={<DoneIcon />}
diff --git a/packages/frontend/core/src/components/comment/sidebar/style.css.ts b/packages/frontend/core/src/components/comment/sidebar/style.css.ts
index 9f431c4f58..150775ba52 100644
--- a/packages/frontend/core/src/components/comment/sidebar/style.css.ts
+++ b/packages/frontend/core/src/components/comment/sidebar/style.css.ts
@@ -163,6 +163,10 @@ export const commentActions = style({
   },
 });
 
+export const actionButton = style({
+  backgroundColor: cssVarV2('button/buttonOverHover'),
+});
+
 export const readonlyCommentContainer = style({
   display: 'flex',
   flexDirection: 'column',