From 58cafd20a5db7806d2b0b32d399619674dfd3f28 Mon Sep 17 00:00:00 2001
From: Jack Schedel <jackschedel@gmail.com>
Date: Tue, 9 May 2023 09:15:26 -0400
Subject: [PATCH] move clear conversation to settings + focus prompt searchbar
 + hid electron menubar (#285)

* hid electron menubar

* command prompt search bar automatically focused on button press

* moved clear conversation into settings, revamped to match style
---
 electron/index.cjs                                     |  1 +
 public/locales/en-US/main.json                         |  2 +-
 public/locales/en/main.json                            |  2 +-
 .../Message/CommandPrompt/CommandPrompt.tsx            | 10 ++++++++++
 src/components/Menu/MenuOptions/ClearConversation.tsx  |  5 ++---
 src/components/Menu/MenuOptions/MenuOptions.tsx        |  2 --
 src/components/SettingsMenu/SettingsMenu.tsx           |  2 ++
 7 files changed, 17 insertions(+), 7 deletions(-)

diff --git a/electron/index.cjs b/electron/index.cjs
index 03a2d2e..9374fb8 100644
--- a/electron/index.cjs
+++ b/electron/index.cjs
@@ -18,6 +18,7 @@ function createWindow() {
   autoUpdater.checkForUpdatesAndNotify();
 
   const win = new BrowserWindow({
+	autoHideMenuBar: true,
     show: false,
     icon: iconPath,
   });
diff --git a/public/locales/en-US/main.json b/public/locales/en-US/main.json
index a27cebb..3b7f25c 100644
--- a/public/locales/en-US/main.json
+++ b/public/locales/en-US/main.json
@@ -6,7 +6,7 @@
   "warning": "Warning",
   "clearMessageWarning": "Please be advised that by submitting this message, all subsequent messages will be deleted!",
   "clearConversationWarning": "Please be advised that by confirming this action, all messages will be deleted!",
-  "clearConversation": "Clear Conversation",
+  "clearConversation": "Clear Conversation History",
   "import": "Import",
   "export": "Export",
   "author": "Made by Jing Hua",
diff --git a/public/locales/en/main.json b/public/locales/en/main.json
index a27cebb..3b7f25c 100644
--- a/public/locales/en/main.json
+++ b/public/locales/en/main.json
@@ -6,7 +6,7 @@
   "warning": "Warning",
   "clearMessageWarning": "Please be advised that by submitting this message, all subsequent messages will be deleted!",
   "clearConversationWarning": "Please be advised that by confirming this action, all messages will be deleted!",
-  "clearConversation": "Clear Conversation",
+  "clearConversation": "Clear Conversation History",
   "import": "Import",
   "export": "Export",
   "author": "Made by Jing Hua",
diff --git a/src/components/Chat/ChatContent/Message/CommandPrompt/CommandPrompt.tsx b/src/components/Chat/ChatContent/Message/CommandPrompt/CommandPrompt.tsx
index e4c67e6..3ea628f 100644
--- a/src/components/Chat/ChatContent/Message/CommandPrompt/CommandPrompt.tsx
+++ b/src/components/Chat/ChatContent/Message/CommandPrompt/CommandPrompt.tsx
@@ -16,9 +16,18 @@ const CommandPrompt = ({
   const prompts = useStore((state) => state.prompts);
   const [_prompts, _setPrompts] = useState<Prompt[]>(prompts);
   const [input, setInput] = useState<string>('');
+  const inputRef = useRef<HTMLInputElement>(null);
 
   const [dropDown, setDropDown, dropDownRef] = useHideOnOutsideClick();
 
+
+  useEffect(() => {
+    if (dropDown && inputRef.current) {
+      // When dropdown is visible, focus the input
+      inputRef.current.focus();
+    }
+  }, [dropDown]);
+  
   useEffect(() => {
     const filteredPrompts = matchSorter(useStore.getState().prompts, input, {
       keys: ['name'],
@@ -46,6 +55,7 @@ const CommandPrompt = ({
       >
         <div className='text-sm px-4 py-2 w-max'>{t('promptLibrary')}</div>
         <input
+          ref={inputRef}
           type='text'
           className='text-gray-800 dark:text-white p-3 text-sm border-none bg-gray-200 dark:bg-gray-600 m-0 w-full mr-0 h-8 focus:outline-none'
           value={input}
diff --git a/src/components/Menu/MenuOptions/ClearConversation.tsx b/src/components/Menu/MenuOptions/ClearConversation.tsx
index f98f738..0926998 100644
--- a/src/components/Menu/MenuOptions/ClearConversation.tsx
+++ b/src/components/Menu/MenuOptions/ClearConversation.tsx
@@ -21,15 +21,14 @@ const ClearConversation = () => {
 
   return (
     <>
-      <a
-        className='flex py-2 px-2 items-center gap-3 rounded-md hover:bg-gray-500/10 transition-colors duration-200 text-white cursor-pointer text-sm'
+      <button className='btn btn-neutral'
         onClick={() => {
           setIsModalOpen(true);
         }}
       >
         <DeleteIcon />
         {t('clearConversation')}
-      </a>
+      </button>
       {isModalOpen && (
         <PopupModal
           setIsModalOpen={setIsModalOpen}
diff --git a/src/components/Menu/MenuOptions/MenuOptions.tsx b/src/components/Menu/MenuOptions/MenuOptions.tsx
index 0716fbb..c547f98 100644
--- a/src/components/Menu/MenuOptions/MenuOptions.tsx
+++ b/src/components/Menu/MenuOptions/MenuOptions.tsx
@@ -1,7 +1,6 @@
 import React from 'react';
 import useStore from '@store/store';
 
-import ClearConversation from './ClearConversation';
 import Api from './Api';
 import Me from './Me';
 import AboutMenu from '@components/AboutMenu';
@@ -27,7 +26,6 @@ const MenuOptions = () => {
         {countTotalTokens && <TotalTokenCostDisplay />}
         {googleClientId && <GoogleSync clientId={googleClientId} />}
         <AboutMenu />
-        <ClearConversation />
         <ImportExportChat />
         <Api />
         <SettingsMenu />
diff --git a/src/components/SettingsMenu/SettingsMenu.tsx b/src/components/SettingsMenu/SettingsMenu.tsx
index e11209f..b4431db 100644
--- a/src/components/SettingsMenu/SettingsMenu.tsx
+++ b/src/components/SettingsMenu/SettingsMenu.tsx
@@ -15,6 +15,7 @@ import PromptLibraryMenu from '@components/PromptLibraryMenu';
 import ChatConfigMenu from '@components/ChatConfigMenu';
 import EnterToSubmitToggle from './EnterToSubmitToggle';
 import TotalTokenCost, { TotalTokenCostToggle } from './TotalTokenCost';
+import ClearConversation from '@components/Menu/MenuOptions/ClearConversation';
 
 const SettingsMenu = () => {
   const { t } = useTranslation();
@@ -51,6 +52,7 @@ const SettingsMenu = () => {
               <AdvancedModeToggle />
               <TotalTokenCostToggle />
             </div>
+            <ClearConversation />
             <PromptLibraryMenu />
             <ChatConfigMenu />
             <TotalTokenCost />