feat: option for enterToSubmit / shiftEnterToSubmit

Fixes #88

public/locales/da/main.json

@@ -35,5 +35,6 @@
   },
   "newFolder": "Ny mappe",
   "cloneChat": "Clone Chat",
-  "cloned": "Cloned"
+  "cloned": "Cloned",
+  "enterToSubmit": "Enter to submit"
 }

public/locales/en/main.json

@@ -35,5 +35,6 @@
   },
   "newFolder": "New Folder",
   "cloneChat": "Clone Chat",
-  "cloned": "Cloned"
+  "cloned": "Cloned",
+  "enterToSubmit": "Enter to submit"
 }

public/locales/es/main.json

@@ -35,5 +35,6 @@
   },
   "newFolder": "Nueva Carpeta",
   "cloneChat": "Clone Chat",
-  "cloned": "Cloned"
+  "cloned": "Cloned",
+  "enterToSubmit": "Enter to submit"
 }

public/locales/fr/main.json

@@ -35,5 +35,6 @@
   },
   "newFolder": "Nouveau Dossier",
   "cloneChat": "Clone Chat",
-  "cloned": "Cloned"
+  "cloned": "Cloned",
+  "enterToSubmit": "Enter to submit"
 }

public/locales/ja/main.json

@@ -35,5 +35,6 @@
   },
   "newFolder": "新しいフォルダー",
   "cloneChat": "Clone Chat",
-  "cloned": "Cloned"
+  "cloned": "Cloned",
+  "enterToSubmit": "Enter to submit"
 }

public/locales/ms/main.json

@@ -35,5 +35,6 @@
   },
   "newFolder": "Folder Baru",
   "cloneChat": "Clone Chat",
-  "cloned": "Cloned"
+  "cloned": "Cloned",
+  "enterToSubmit": "Enter to submit"
 }

public/locales/nb/main.json

@@ -35,5 +35,6 @@
   },
   "newFolder": "Ny mappe",
   "cloneChat": "Clone Chat",
-  "cloned": "Cloned"
+  "cloned": "Cloned",
+  "enterToSubmit": "Enter to submit"
 }

public/locales/sv/main.json

@@ -35,5 +35,6 @@
   },
   "newFolder": "Ny mapp",
   "cloneChat": "Clone Chat",
-  "cloned": "Cloned"
+  "cloned": "Cloned",
+  "enterToSubmit": "Enter to submit"
 }

public/locales/zh-CN/main.json

@@ -35,5 +35,6 @@
   },
   "newFolder": "新文件夹",
   "cloneChat": "Clone Chat",
-  "cloned": "Cloned"
+  "cloned": "Cloned",
+  "enterToSubmit": "Enter to submit"
 }

public/locales/zh-HK/main.json

@@ -35,5 +35,6 @@
   },
   "newFolder": "新資料夾",
   "cloneChat": "Clone Chat",
-  "cloned": "Cloned"
+  "cloned": "Cloned",
+  "enterToSubmit": "Enter to submit"
 }

public/locales/zh-TW/main.json

@@ -35,5 +35,6 @@
   },
   "newFolder": "新資料夾",
   "cloneChat": "Clone Chat",
-  "cloned": "Cloned"
+  "cloned": "Cloned",
+  "enterToSubmit": "Enter to submit"
 }

src/components/Chat/ChatContent/Message/MessageContent.tsx

@@ -342,12 +342,20 @@ const EditView = ({
   };
 
   const handleKeyDown = (e: React.KeyboardEvent<HTMLTextAreaElement>) => {
-    if ((e.ctrlKey || e.shiftKey) && e.key === 'Enter') {
+    if (e.key === 'Enter') {
-      e.preventDefault();
+      const enterToSubmit = useStore.getState().enterToSubmit;
       if (sticky) {
+        if (
+          (enterToSubmit && !e.shiftKey) ||
+          (!enterToSubmit && (e.ctrlKey || e.shiftKey))
+        ) {
+          e.preventDefault();
           handleSaveAndSubmit();
           resetTextAreaHeight();
-      } else handleSave();
+        }
+      } else if (e.ctrlKey || e.shiftKey) {
+        handleSave();
+      }
     }
   };
 

src/components/SettingsMenu/EnterToSubmitToggle.tsx

@@ -0,0 +1,28 @@
+import React, { useEffect, useState } from 'react';
+import { useTranslation } from 'react-i18next';
+import useStore from '@store/store';
+import Toggle from '@components/Toggle';
+
+const EnterToSubmitToggle = () => {
+  const { t } = useTranslation();
+
+  const setEnterToSubmit = useStore((state) => state.setEnterToSubmit);
+
+  const [isChecked, setIsChecked] = useState<boolean>(
+    useStore.getState().enterToSubmit
+  );
+
+  useEffect(() => {
+    setEnterToSubmit(isChecked);
+  }, [isChecked]);
+
+  return (
+    <Toggle
+      label={t('enterToSubmit') as string}
+      isChecked={isChecked}
+      setIsChecked={setIsChecked}
+    />
+  );
+};
+
+export default EnterToSubmitToggle;

src/components/SettingsMenu/SettingsMenu.tsx

@@ -9,6 +9,7 @@ import LanguageSelector from '@components/LanguageSelector';
 import AutoTitleToggle from './AutoTitleToggle';
 import PromptLibraryMenu from '@components/PromptLibraryMenu';
 import ChatConfigMenu from '@components/ChatConfigMenu';
+import EnterToSubmitToggle from './EnterToSubmitToggle';
 
 const SettingsMenu = () => {
   const { t } = useTranslation();
@@ -38,7 +39,10 @@ const SettingsMenu = () => {
           <div className='p-6 border-b border-gray-200 dark:border-gray-600 flex flex-col items-center gap-4'>
             <LanguageSelector />
             <ThemeSwitcher />
+            <div className='flex flex-col gap-3'>
               <AutoTitleToggle />
+              <EnterToSubmitToggle />
+            </div>
             <PromptLibraryMenu />
             <ChatConfigMenu />
           </div>

src/store/config-slice.ts

@@ -11,6 +11,7 @@ export interface ConfigSlice {
   defaultChatConfig: ConfigInterface;
   defaultSystemMessage: string;
   hideSideMenu: boolean;
+  enterToSubmit: boolean;
   setOpenConfig: (openConfig: boolean) => void;
   setTheme: (theme: Theme) => void;
   setAutoTitle: (autoTitle: boolean) => void;
@@ -18,6 +19,7 @@ export interface ConfigSlice {
   setDefaultSystemMessage: (defaultSystemMessage: string) => void;
   setHideMenuOptions: (hideMenuOptions: boolean) => void;
   setHideSideMenu: (hideSideMenu: boolean) => void;
+  setEnterToSubmit: (enterToSubmit: boolean) => void;
 }
 
 export const createConfigSlice: StoreSlice<ConfigSlice> = (set, get) => ({
@@ -26,6 +28,7 @@ export const createConfigSlice: StoreSlice<ConfigSlice> = (set, get) => ({
   hideMenuOptions: false,
   hideSideMenu: false,
   autoTitle: false,
+  enterToSubmit: true,
   defaultChatConfig: _defaultChatConfig,
   defaultSystemMessage: _defaultSystemMessage,
   setOpenConfig: (openConfig: boolean) => {
@@ -70,4 +73,10 @@ export const createConfigSlice: StoreSlice<ConfigSlice> = (set, get) => ({
       hideSideMenu: hideSideMenu,
     }));
   },
+  setEnterToSubmit: (enterToSubmit: boolean) => {
+    set((prev: ConfigSlice) => ({
+      ...prev,
+      enterToSubmit: enterToSubmit,
+    }));
+  },
 });

src/store/store.ts

@@ -61,6 +61,7 @@ const useStore = create<StoreState>()(
         hideSideMenu: state.hideSideMenu,
         foldersName: state.foldersName,
         foldersExpanded: state.foldersExpanded,
+        enterToSubmit: state.enterToSubmit,
       }),
       version: 7,
       migrate: (persistedState, version) => {