From 0ddd2d2a894ae4d60e2eb1d64075c75eaaae3d28 Mon Sep 17 00:00:00 2001
From: Deng Junhai <DengJunHai@foxmail.com>
Date: Fri, 21 Jun 2024 18:26:45 +0800
Subject: [PATCH] fix: support meta+enter send key in macos platform (#160)

Co-Authored-By: Minghan Zhang <112773885+zmh-program@users.noreply.github.com>
---
 app/src/components/home/assemblies/ChatInput.tsx |  9 ++++-----
 app/src/utils/base.ts                            | 13 +++++++++++++
 2 files changed, 17 insertions(+), 5 deletions(-)

diff --git a/app/src/components/home/assemblies/ChatInput.tsx b/app/src/components/home/assemblies/ChatInput.tsx
index 7ff662b..d21913a 100644
--- a/app/src/components/home/assemblies/ChatInput.tsx
+++ b/app/src/components/home/assemblies/ChatInput.tsx
@@ -6,7 +6,7 @@ import { useSelector } from "react-redux";
 import { senderSelector } from "@/store/settings.ts";
 import { blobEvent } from "@/events/blob.ts";
 import { cn } from "@/components/ui/lib/utils.ts";
-import { isEnter } from "@/utils/base.ts";
+import { isEnter, withCtrl, withShift } from "@/utils/base.ts";
 
 type ChatInputProps = {
   className?: string;
@@ -47,7 +47,7 @@ function ChatInput({
             // on Enter, clear the input
             // on Ctrl + Enter or Shift + Enter, keep the input
 
-            if (!e.ctrlKey && !e.shiftKey) {
+            if (!withCtrl(e) && !withShift(e)) {
               e.preventDefault();
               onEnterPressed();
             } else {
@@ -67,9 +67,8 @@ function ChatInput({
               onValueChange(input.value);
             }
           } else {
-            // on Enter, keep the input
-            // on Ctrl + Enter, clear the input
-            if (e.ctrlKey) {
+            // on Enter, keep the input & on Ctrl + Enter, send the input
+            if (withCtrl(e)) {
               e.preventDefault();
               onEnterPressed();
             }
diff --git a/app/src/utils/base.ts b/app/src/utils/base.ts
index 41f1d9d..3017c9e 100644
--- a/app/src/utils/base.ts
+++ b/app/src/utils/base.ts
@@ -100,6 +100,19 @@ export function isEnter<T extends HTMLElement>(
   return e.key === "Enter" && e.keyCode != 229;
 }
 
+export function withCtrl<T extends HTMLElement>(
+  e: React.KeyboardEvent<T> | KeyboardEvent,
+): boolean {
+  // if platform is Mac, use Command instead of Ctrl
+  return e.ctrlKey || e.metaKey;
+}
+
+export function withShift<T extends HTMLElement>(
+  e: React.KeyboardEvent<T> | KeyboardEvent,
+): boolean {
+  return e.shiftKey;
+}
+
 export function resetJsArray<T>(arr: T[], target: T[]): T[] {
   /**
    * this function is used to reset an array to another array without changing the *pointer