feat: Create new conversations from default

Author: s-diez

client/src/components/Chat/Menus/HeaderNewChat.tsx

@@ -3,7 +3,7 @@ import { useChatContext } from '~/Providers';
 import { useMediaQuery, useLocalize } from '~/hooks';
 
 export default function HeaderNewChat() {
-  const { newConversation } = useChatContext();
+  const { newDefaultConversation } = useChatContext();
   const isSmallScreen = useMediaQuery('(max-width: 768px)');
   const localize = useLocalize();
   if (isSmallScreen) {
@@ -15,7 +15,7 @@ export default function HeaderNewChat() {
       aria-label={localize("com_ui_new_chat")}
       type="button"
       className="btn btn-neutral btn-small border-token-border-medium relative ml-2 flex hidden h-9 w-9 items-center justify-center whitespace-nowrap rounded-lg rounded-lg border focus:border-black-500 dark:focus:border-white-500 md:flex"
-      onClick={() => newConversation()}
+      onClick={() => newDefaultConversation()}
     >
       <div className="flex w-full items-center justify-center gap-2">
         <NewChatIcon />

client/src/components/Nav/MobileNav.tsx

@@ -10,7 +10,7 @@ export default function MobileNav({
   setNavVisible: Dispatch<SetStateAction<boolean>>;
 }) {
   const localize = useLocalize();
-  const { newConversation } = useNewConvo(0);
+  const { newDefaultConversation } = useNewConvo(0);
   const conversation = useRecoilValue(store.conversationByIndex(0));
   const { title = 'New Chat' } = conversation || {};
 
@@ -52,7 +52,7 @@ export default function MobileNav({
         type="button"
         aria-label={localize('com_ui_new_chat')}
         className="m-1 inline-flex size-10 items-center justify-center rounded-full hover:bg-surface-hover"
-        onClick={() => newConversation()}
+        onClick={() => newDefaultConversation()}
       >
         <svg
           width="24"

client/src/components/Nav/NewChat.tsx

@@ -66,7 +66,7 @@ export default function NewChat({
   isSmallScreen: boolean;
 }) {
   /** Note: this component needs an explicit index passed if using more than one */
-  const { newConversation: newConvo } = useNewConvo(index);
+  const { newDefaultConversation: newConvo } = useNewConvo(index);
   const navigate = useNavigate();
   const localize = useLocalize();
 

client/src/hooks/Chat/useChatHelpers.ts

@@ -18,7 +18,7 @@ export default function useChatHelpers(index = 0, paramId?: string) {
   const queryClient = useQueryClient();
   const { isAuthenticated } = useAuthContext();
 
-  const { newConversation } = useNewConvo(index);
+  const { newConversation, newDefaultConversation } = useNewConvo(index);
   const { useCreateConversationAtom } = store;
   const { conversation, setConversation } = useCreateConversationAtom(index);
   const { conversationId } = conversation ?? {};
@@ -143,6 +143,7 @@ export default function useChatHelpers(index = 0, paramId?: string) {
 
   return {
     newConversation,
+    newDefaultConversation,
     conversation,
     setConversation,
     // getConvos,

client/src/hooks/useNewConvo.ts

@@ -262,10 +262,28 @@ const useNewConvo = (index = 0) => {
       mutateAsync,
     ],
   );
+  const newDefaultConversation = useRecoilCallback(() => () => {
+    let preset = defaultPreset;
+    const defaultModelSpec = getDefaultModelSpec(startupConfig?.modelSpecs?.list);
+    if (!preset && defaultModelSpec) {
+      preset = {
+        ...defaultModelSpec.preset,
+        iconURL: getModelSpecIconURL(defaultModelSpec),
+        spec: defaultModelSpec.name,
+      } as TConversation;
+    }
+    return newConversation({ conversation: {}, preset })
+  }, [
+    defaultPreset,
+    startupConfig,
+    switchToConversation,
+  ])
+
 
   return {
     switchToConversation,
     newConversation,
+    newDefaultConversation,
   };
 };