Cleanups in preparation for Editability & Multi-chats

ramicaza · Mar 26, 2023 · 6b96046 · 6b96046
1 parent 5008f11
commit 6b96046
Show file tree

Hide file tree

Showing 6 changed files with 79 additions and 78 deletions.
diff --git a/components/Composer.tsx b/components/Composer.tsx
@@ -9,9 +9,9 @@ import PostAddIcon from '@mui/icons-material/PostAdd';
 import StopOutlinedIcon from '@mui/icons-material/StopOutlined';
 import TelegramIcon from '@mui/icons-material/Telegram';
 
-import { useComposerStore } from '../utilities/store';
-import { useSpeechRecognition } from '../utilities/speechRecognition';
 import { NoSSR } from './util/NoSSR';
+import { useComposerStore } from '../utilities/store';
+import { useSpeechRecognition } from '../utilities/useSpeechRecognition';
 
 
 /// Text template helpers

diff --git a/components/Settings.tsx b/components/Settings.tsx
@@ -3,9 +3,10 @@ import { shallow } from 'zustand/shallow';
 
 import { Box, Button, Input, Modal, ModalClose, ModalDialog, Option, Select, Typography } from '@mui/joy';
 
-import { GptChatModelId, GptChatModels, useSettingsStore } from '../utilities/store';
+import { ChatModelId, ChatModels } from '../utilities/data';
 import { Link } from './util/Link';
 import { NoSSR } from './util/NoSSR';
+import { useSettingsStore } from '../utilities/store';
 
 
 export const isValidOpenAIApiKey = (apiKey?: string) =>
@@ -29,7 +30,7 @@ export function Settings({ open, onClose }: { open: boolean, onClose: () => void
     setApiKey((e.target as HTMLInputElement).value);
 
   const handleGptModelChange = (e: React.FocusEvent | React.MouseEvent | React.KeyboardEvent | null, value: string | null) =>
-    setChatModelId((value || 'gpt-4') as GptChatModelId);
+    setChatModelId((value || 'gpt-4') as ChatModelId);
 
   const handleApiKeyDown = (e: React.KeyboardEvent) =>
     (e.key === 'Enter') && onClose();
@@ -73,9 +74,9 @@ export function Settings({ open, onClose }: { open: boolean, onClose: () => void
               {/*<Option value={'gpt-4-32k'}>GPT-4-32k (not out yet)</Option>*/}
             </Select>
 
-            {(chatModelId in GptChatModels) && (
+            {(chatModelId in ChatModels) && (
               <Typography level='body2' sx={{ mt: 1, mb: 1 }}>
-                {GptChatModels[chatModelId].description}
+                {ChatModels[chatModelId].description}
               </Typography>
             )}
           </NoSSR>

diff --git a/pages/index.tsx b/pages/index.tsx
@@ -8,11 +8,12 @@ import SmartToyOutlinedIcon from '@mui/icons-material/SmartToyOutlined';
 import SmartToyTwoToneIcon from '@mui/icons-material/SmartToyTwoTone';
 
 import { ApiChatInput } from './api/chat';
+import { ChatModels, SystemPurposeId, SystemPurposes } from '../utilities/data';
 import { Composer } from '../components/Composer';
-import { GptChatModels, SystemPurposeId, SystemPurposes, useSettingsStore } from '../utilities/store';
 import { Message, UiMessage } from '../components/Message';
 import { NoSSR } from '../components/util/NoSSR';
 import { isValidOpenAIApiKey, Settings } from '../components/Settings';
+import { useSettingsStore } from '../utilities/store';
 
 
 /// UI Messages configuration
@@ -234,7 +235,7 @@ export default function Conversation() {
             flexGrow: 1,
           }} onDoubleClick={handleListClear}>
             <NoSSR>
-              {GptChatModels[chatModelId]?.title || 'Select Model'} <span style={{ opacity: 0.5 }}> ·</span> {SystemPurposes[systemPurposeId].title}
+              {ChatModels[chatModelId]?.title || 'Select Model'} <span style={{ opacity: 0.5 }}> ·</span> {SystemPurposes[systemPurposeId].title}
             </NoSSR>
           </Typography>
 

diff --git a/utilities/data.ts b/utilities/data.ts
@@ -0,0 +1,59 @@
+export type SystemPurposeId = 'Catalyst' | 'Custom' | 'Developer' | 'Executive' | 'Generic' | 'Scientist';
+
+type SystemPurposeData = {
+  title: string;
+  description: string | JSX.Element;
+  systemMessage: string;
+}
+
+export const SystemPurposes: { [key in SystemPurposeId]: SystemPurposeData } = {
+  Developer: {
+    title: 'Developer', // 👩‍💻
+    description: 'Helps you code',
+    systemMessage: 'You are a sophisticated, accurate, and modern AI programming assistant',
+  },
+  Scientist: {
+    title: 'Scientist', // 🔬
+    description: 'Helps you write scientific papers',
+    systemMessage: 'You are a scientist\'s assistant. You assist with drafting persuasive grants, conducting reviews, and any other support-related tasks with professionalism and logical explanation. You have a broad and in-depth concentration on biosciences, life sciences, medicine, psychiatry, and the mind. Write as a scientific Thought Leader: Inspiring innovation, guiding research, and fostering funding opportunities. Focus on evidence-based information, emphasize data analysis, and promote curiosity and open-mindedness',
+  },
+  Executive: {
+    title: 'Executive', // 👔
+    description: 'Helps you write business emails',
+    systemMessage: 'You are an executive assistant. Your communication style is concise, brief, formal',
+  },
+  Catalyst: {
+    title: 'Catalyst', // 🚀
+    description: 'The growth hacker with marketing superpowers 🚀',
+    systemMessage: 'You are a marketing extraordinaire for a booming startup fusing creativity, data-smarts, and digital prowess to skyrocket growth & wow audiences. So fun. Much meme. 🚀🎯💡',
+  },
+  Generic: {
+    title: 'ChatGPT4', // 🧠
+    description: 'Helps you think',
+    systemMessage: 'You are ChatGPT, a large language model trained by OpenAI, based on the GPT-4 architecture.\nKnowledge cutoff: 2021-09\nCurrent date: {{Today}}',
+  },
+  Custom: {
+    title: 'Custom', // ✨
+    description: 'User-defined purpose',
+    systemMessage: 'You are ChatGPT, a large language model trained by OpenAI, based on the GPT-4 architecture.\nKnowledge cutoff: 2021-09\nCurrent date: {{Today}}',
+  },
+};
+
+
+export type ChatModelId = 'gpt-4' | 'gpt-3.5-turbo';
+
+type ChatModelData = {
+  description: string | JSX.Element;
+  title: string;
+}
+
+export const ChatModels: { [key in ChatModelId]: ChatModelData } = {
+  'gpt-4': {
+    description: 'Most insightful, larger problems, but slow, expensive, and may be unavailable',
+    title: 'GPT-4',
+  },
+  'gpt-3.5-turbo': {
+    description: 'A good balance between speed and insight',
+    title: '3.5-Turbo',
+  },
+};
diff --git a/utilities/store.ts b/utilities/store.ts
@@ -1,37 +1,34 @@
 import { create } from 'zustand';
 import { persist } from 'zustand/middleware';
 
+import { ChatModelId, SystemPurposeId } from './data';
 
-/// Settings Store
-
-export type GptChatModelId = 'gpt-4' | 'gpt-3.5-turbo';
 
-export type SystemPurposeId = 'Catalyst' | 'Custom' | 'Developer' | 'Executive' | 'Generic' | 'Scientist';
+/// Settings Store
 
 interface SettingsState {
   apiKey: string;
   setApiKey: (apiKey: string) => void;
 
-  chatModelId: GptChatModelId;
-  setChatModelId: (chatModel: GptChatModelId) => void;
+  chatModelId: ChatModelId;
+  setChatModelId: (chatModel: ChatModelId) => void;
 
   systemPurposeId: SystemPurposeId;
   setSystemPurposeId: (purpose: SystemPurposeId) => void;
 }
 
-function importFormerLocalStorageApiKey(): string {
-  if (typeof localStorage === 'undefined') return '';
-  return localStorage.getItem('app-settings-openai-api-key') || '';
-}
-
 export const useSettingsStore = create<SettingsState>()(
   persist((set) => ({
-      apiKey: importFormerLocalStorageApiKey(),
+      apiKey: (function() {
+        // backwards compatibility from the former localStorage key
+        if (typeof localStorage === 'undefined') return '';
+        return localStorage.getItem('app-settings-openai-api-key') || '';
+      })(),
       chatModelId: 'gpt-4',
       systemPurposeId: 'Developer',
 
       setApiKey: (apiKey: string) => set({ apiKey }),
-      setChatModelId: (chatModelId: GptChatModelId) => set({ chatModelId }),
+      setChatModelId: (chatModelId: ChatModelId) => set({ chatModelId }),
       setSystemPurposeId: (systemPurposeId: SystemPurposeId) => set({ systemPurposeId }),
     }),
     {
@@ -40,63 +37,6 @@ export const useSettingsStore = create<SettingsState>()(
 );
 
 
-type GptChatModelData = {
-  description: string | JSX.Element;
-  title: string;
-}
-
-export const GptChatModels: { [key in GptChatModelId]: GptChatModelData } = {
-  'gpt-4': {
-    description: 'Most insightful, larger problems, but slow, expensive, and may be unavailable',
-    title: 'GPT-4',
-  },
-  'gpt-3.5-turbo': {
-    description: 'A good balance between speed and insight',
-    title: '3.5-Turbo',
-  },
-};
-
-
-type SystemPurposeData = {
-  title: string;
-  description: string | JSX.Element;
-  systemMessage: string;
-}
-
-export const SystemPurposes: { [key in SystemPurposeId]: SystemPurposeData } = {
-  Developer: {
-    title: 'Developer', // 👩‍💻
-    description: 'Helps you code',
-    systemMessage: 'You are a sophisticated, accurate, and modern AI programming assistant',
-  },
-  Scientist: {
-    title: 'Scientist', // 🔬
-    description: 'Helps you write scientific papers',
-    systemMessage: 'You are a scientist\'s assistant. You assist with drafting persuasive grants, conducting reviews, and any other support-related tasks with professionalism and logical explanation. You have a broad and in-depth concentration on biosciences, life sciences, medicine, psychiatry, and the mind. Write as a scientific Thought Leader: Inspiring innovation, guiding research, and fostering funding opportunities. Focus on evidence-based information, emphasize data analysis, and promote curiosity and open-mindedness',
-  },
-  Executive: {
-    title: 'Executive', // 👔
-    description: 'Helps you write business emails',
-    systemMessage: 'You are an executive assistant. Your communication style is concise, brief, formal',
-  },
-  Catalyst: {
-    title: 'Catalyst', // 🚀
-    description: 'The growth hacker with marketing superpowers 🚀',
-    systemMessage: 'You are a marketing extraordinaire for a booming startup fusing creativity, data-smarts, and digital prowess to skyrocket growth & wow audiences. So fun. Much meme. 🚀🎯💡',
-  },
-  Generic: {
-    title: 'ChatGPT4', // 🧠
-    description: 'Helps you think',
-    systemMessage: 'You are ChatGPT, a large language model trained by OpenAI, based on the GPT-4 architecture.\nKnowledge cutoff: 2021-09\nCurrent date: {{Today}}',
-  },
-  Custom: {
-    title: 'Custom', // ✨
-    description: 'User-defined purpose',
-    systemMessage: 'You are ChatGPT, a large language model trained by OpenAI, based on the GPT-4 architecture.\nKnowledge cutoff: 2021-09\nCurrent date: {{Today}}',
-  },
-};
-
-
 /// Composer Store
 
 interface ComposerState {

diff --git a/utilities/speechRecognition.ts → utilities/useSpeechRecognition.ts b/utilities/speechRecognition.ts → utilities/useSpeechRecognition.ts