save client information for switch between conversations

Signed-off-by: cbh778899 <[email protected]>

Author: cbh778899

src/components/chat/Conversation.jsx

@@ -4,9 +4,10 @@ import { FileImageFill, FileTextFill, Paperclip, Send, StopCircleFill } from 're
 import useIDB from "../../utils/idb";
 import { isModelLoaded, loadModel } from '../../utils/workers/worker'
 import { getCompletionFunctions } from "../../utils/workers";
-import { setClient } from "../../utils/workers/aws-worker";
+import { setClient as setAwsClient } from "../../utils/workers/aws-worker";
+import { setClient as setOpenaiClient } from "../../utils/workers/openai-worker";
 
-export default function Conversation({ uid, client }) {
+export default function Conversation({ uid, client, updateClient }) {
 
     const [conversation, setConversation] = useState([]);
     const [message, setMessage] = useState('');
@@ -130,15 +131,21 @@ export default function Conversation({ uid, client }) {
     useEffect(()=>{
         if(!chat_functions.current) return;
 
-        if(chat_functions.current.platform === 'AWS') {
+        const platform = chat_functions.current.platform
+        if(platform) {
             (async function() {
-                if(await setClient(client)) {
-                    await idb.updateOne('chat-history', {client}, [{uid}])
+                let set_result = 
+                    platform === "AWS" ? await setAwsClient(client) :
+                    platform === "OpenAI" ? await setOpenaiClient(client) :
+                    null;
+                
+                if(set_result) {
+                    updateClient(set_result);
                 }
             })()
         }
     // eslint-disable-next-line
-    }, [chat_functions, client])
+    }, [client])
 
     return (
         <div className="conversation-main">

src/components/chat/Tickets.jsx

@@ -1,17 +1,16 @@
-import { useEffect, useState } from "react";
+import { useEffect } from "react";
 import Ticket from "./Ticket";
 import useIDB from "../../utils/idb";
 import { genRandomID } from "../../utils/tools";
 
-export default function Tickets({selectChat, current_chat}) {
+export default function Tickets({selectChat, current_chat, history, setHistory}) {
 
-    const [tickets, setTickets] = useState([]);
     const idb = useIDB();
 
     async function syncHistory() {
         const history = await idb.getAll('chat-history')
         history.sort((a, b)=>b.updatedAt - a.updatedAt)
-        setTickets(history)
+        setHistory(history)
     }
 
     async function startNewConversation() {
@@ -27,9 +26,9 @@ export default function Tickets({selectChat, current_chat}) {
         )
         const new_conv_info = await idb.getByID('chat-history', conv_id);
         new_conv_info &&
-        setTickets([
+        setHistory([
             new_conv_info,
-            ...tickets
+            ...history
         ])
         selectChat(new_conv_info)
     }
@@ -47,7 +46,7 @@ export default function Tickets({selectChat, current_chat}) {
             >
                 <div>Start New Chat</div>
             </div>
-            { tickets.map(elem => {
+            { history.map(elem => {
                 const { title, uid } = elem;
                 return (
                     <Ticket 

src/components/chat/index.jsx

@@ -1,15 +1,32 @@
 import { useState } from "react";
 import Tickets from "./Tickets";
 import Conversation from "./Conversation";
+import useIDB from "../../utils/idb";
 
 export default function Chat() {
 
     const [chat, selectChat] = useState({});
+    const [history, setHistory] = useState([]);
+    const idb = useIDB();
+
+    function updateChatClient(client) {
+        selectChat({
+            ...chat, client
+        })
+        
+        let history_cp = [...history];
+        history_cp[
+            history_cp.findIndex(e=>e.uid === chat.uid)
+        ].client = client;
+        setHistory(history_cp);
+
+        idb.updateOne('chat-history', {client}, [{uid:chat.uid}])
+    }
 
     return (
         <div className="chat">
-            <Tickets selectChat={selectChat} current_chat={chat} />
-            <Conversation uid={chat.uid} client={chat.client} />
+            <Tickets selectChat={selectChat} setHistory={setHistory} history={history} current_chat={chat} />
+            <Conversation uid={chat.uid} client={chat.client} updateClient={updateChatClient} />
         </div>
     )
 }