fetch local chat history

dissorial · Jun 3, 2023 · d9ab09b · d9ab09b
1 parent a7cb32b
commit d9ab09b
Show file tree

Hide file tree

Showing 8 changed files with 123 additions and 254 deletions.
diff --git a/components/header/Header.tsx b/components/header/Header.tsx
@@ -1,22 +1,11 @@
 import React from 'react';
 import { Bars3Icon } from '@heroicons/react/24/outline';
-import ProfileDropdown from '../other/ProfileDropdown';
-import { signOut } from 'next-auth/react';
 
 interface HeaderProps {
   setSidebarOpen: React.Dispatch<React.SetStateAction<boolean>>;
-  userImage: string;
-  userName: string;
 }
 
-const Header: React.FC<HeaderProps> = ({
-  setSidebarOpen,
-  userImage,
-  userName,
-}) => {
-  const defaultUserImage = '/images/user.png';
-  const defaultUserName = 'User';
-
+const Header: React.FC<HeaderProps> = ({ setSidebarOpen }) => {
   return (
     <div className="sticky top-0 z-40 flex h-16 shrink-0 items-center gap-x-4 border-b border-gray-800 bg-gray-900 px-4 shadow-sm sm:gap-x-6 sm:px-6 lg:px-8">
       <button
@@ -32,18 +21,6 @@ const Header: React.FC<HeaderProps> = ({
         <span className="w-full text-center items-center rounded-md bg-blue-400/10 px-2 py-1 text-xs sm:text-sm md:text-md md:text-lg font-medium text-blue-400 ring-1 ring-inset ring-pink-blue/30">
           DOC CHATBOT
         </span>
-
-        <div className="flex items-center gap-x-4 lg:gap-x-6">
-          <div
-            className="hidden lg:block lg:h-6 lg:w-px lg:bg-gray-900/10"
-            aria-hidden="true"
-          />
-          <ProfileDropdown
-            userImage={userImage || defaultUserImage}
-            userName={userName || defaultUserName}
-            signOut={signOut}
-          />
-        </div>
       </div>
     </div>
   );

diff --git a/components/other/ProfileDropdown.tsx b/components/other/ProfileDropdown.tsx
diff --git a/components/sidebar/ListOfChats.tsx b/components/sidebar/ListOfChats.tsx
@@ -6,15 +6,15 @@ function classNames(...classes: string[]) {
 }
 
 const ListOfChats = ({
-  chatList,
+  filteredChatList,
   selectedChatId,
   setChatId,
   setSelectedChatId,
   chatNames,
   updateChatName,
   deleteChat,
 }: {
-  chatList: string[];
+  filteredChatList: string[];
   selectedChatId: string;
   setChatId: (chatId: string) => void;
   setSelectedChatId: (chatId: string) => void;
@@ -45,7 +45,7 @@ const ListOfChats = ({
       <div className="text-xs sm:text-sm font-semibold leading-6 text-blue-400">
         Your chats
       </div>
-      {chatList.map((chatId, index) => (
+      {filteredChatList.map((chatId, index) => (
         <li
           key={chatId}
           className={classNames(

diff --git a/components/sidebar/SidebarList.tsx b/components/sidebar/SidebarList.tsx
@@ -15,7 +15,7 @@ interface SidebarListProps {
   setReturnSourceDocuments: React.Dispatch<React.SetStateAction<boolean>>;
   modelTemperature: number;
   setModelTemperature: React.Dispatch<React.SetStateAction<number>>;
-  chatList: string[];
+  filteredChatList: string[];
   selectedChatId: string;
   setChatId: (value: string) => void;
   setSelectedChatId: React.Dispatch<React.SetStateAction<string>>;
@@ -33,7 +33,7 @@ const SidebarList: React.FC<SidebarListProps> = ({
   setReturnSourceDocuments,
   modelTemperature,
   setModelTemperature,
-  chatList,
+  filteredChatList,
   selectedChatId,
   setChatId,
   createChat,
@@ -75,10 +75,9 @@ const SidebarList: React.FC<SidebarListProps> = ({
             </div>
           )}
 
-          {/* desktop */}
           {selectedNamespace && nameSpaceHasChats ? (
             <ListOfChats
-              chatList={chatList}
+              filteredChatList={filteredChatList}
               selectedChatId={selectedChatId}
               setChatId={setChatId}
               setSelectedChatId={setSelectedChatId}

diff --git a/hooks/useChats.ts b/hooks/useChats.ts
@@ -1,4 +1,5 @@
-import { useState, useEffect, useMemo } from 'react';
+import { ChatMessage } from '@/types/chat';
+import { useState, useMemo, useCallback } from 'react';
 import { v4 as uuidv4 } from 'uuid';
 
 function useLocalStorage<T>(key: string, initialValue: T) {
@@ -18,10 +19,15 @@ function useLocalStorage<T>(key: string, initialValue: T) {
   return [storedValue, setValue] as const;
 }
 
-export function useChats(namespace: string, userEmail: string | undefined) {
+export function useChats(namespace: string) {
+  const [allConversations, setAllConversations] = useLocalStorage<{
+    [key: string]: { messages: ChatMessage[]; history: [string, string][] };
+  }>('allConversations', {});
+
   const [allChats, setAllChats] = useLocalStorage<
     { namespace: string; chatId: string }[]
   >('allChats', []);
+
   const chatList = useMemo(
     () => allChats.filter((chat) => chat.namespace === namespace),
     [allChats, namespace],
@@ -32,32 +38,48 @@ export function useChats(namespace: string, userEmail: string | undefined) {
     {},
   );
 
-  console.log(chatList, 'chatList');
-
   const [selectedChatId, setSelectedChatId] = useState<string>('');
 
+  const getConversation = useCallback(
+    (chatId: string) => {
+      return allConversations[chatId] || { messages: [], history: [] };
+    },
+    [allConversations],
+  );
+
+  function updateConversation(
+    chatId: string,
+    conversation: { messages: ChatMessage[]; history: [string, string][] },
+  ) {
+    const updatedConversations = {
+      ...allConversations,
+      [chatId]: conversation,
+    };
+    setAllConversations(updatedConversations);
+  }
+
   function updateChatName(chatId: string, newChatName: string) {
     const updatedChatNames = { ...chatNames, [chatId]: newChatName };
     setChatNames(updatedChatNames);
   }
 
   function createChat() {
     const newChatId = uuidv4();
-    const updatedChatList = [...chatList, { namespace, chatId: newChatId }];
-    setAllChats(updatedChatList);
+    const updatedAllChats = [...allChats, { namespace, chatId: newChatId }];
+    setAllChats(updatedAllChats);
 
     return newChatId;
   }
 
-  async function deleteChat(chatIdToDelete: string) {
-    const updatedChatList = chatList.filter(
+  function deleteChat(chatIdToDelete: string) {
+    const updatedAllChats = allChats.filter(
       (chat) => chat.chatId !== chatIdToDelete,
     );
-    setAllChats(updatedChatList);
+    setAllChats(updatedAllChats);
 
     if (chatIdToDelete === selectedChatId) {
       const newSelectedChatId =
-        updatedChatList.length > 0 ? updatedChatList[0].chatId : '';
+        updatedAllChats.length > 0 ? updatedAllChats[0].chatId : '';
       setSelectedChatId(newSelectedChatId);
     }
   }
@@ -66,12 +88,6 @@ export function useChats(namespace: string, userEmail: string | undefined) {
     (chat) => chat.namespace === namespace,
   );
 
-  console.log(filteredChatList, 'filteredChatList');
-
-  useEffect(() => {
-    console.log('selectedChatId changed:', selectedChatId);
-  }, [selectedChatId]);
-
   return {
     chatList,
     selectedChatId,
@@ -80,7 +96,8 @@ export function useChats(namespace: string, userEmail: string | undefined) {
     deleteChat,
     chatNames,
     updateChatName,
-    userEmail,
     filteredChatList,
+    getConversation,
+    updateConversation,
   };
 }
diff --git a/hooks/useNamespaces.ts b/hooks/useNamespaces.ts
@@ -1,33 +1,31 @@
 import { useState, useEffect } from 'react';
 import { useRouter } from 'next/router';
 
-export default function useNamespaces(userEmail: string | undefined) {
+export default function useNamespaces() {
   const [namespaces, setNamespaces] = useState<string[]>([]);
   const [selectedNamespace, setSelectedNamespace] = useState<string>('');
 
   const router = useRouter();
 
   useEffect(() => {
-    if (userEmail) {
-      const fetchNamespaces = async () => {
-        try {
-          const response = await fetch(`/api/getNamespaces`);
-          const data = await response.json();
+    const fetchNamespaces = async () => {
+      try {
+        const response = await fetch(`/api/getNamespaces`);
+        const data = await response.json();
 
-          console.log(data);
-          if (response.ok) {
-            setNamespaces(data);
-          } else {
-            console.error(data.error);
-          }
-        } catch (error: any) {
-          console.error(error.message);
+        console.log(data);
+        if (response.ok) {
+          setNamespaces(data);
+        } else {
+          console.error(data.error);
         }
-      };
+      } catch (error: any) {
+        console.error(error.message);
+      }
+    };
 
-      fetchNamespaces();
-    }
-  }, [userEmail]);
+    fetchNamespaces();
+  }, []);
 
   useEffect(() => {
     const namespaceFromUrl = router.query.namespace;

diff --git a/pages/api/chat.ts b/pages/api/chat.ts
@@ -1,11 +1,8 @@
 import { NextApiRequest, NextApiResponse } from 'next';
 import { OpenAIEmbeddings } from 'langchain/embeddings/openai';
 import { PineconeStore } from 'langchain/vectorstores/pinecone';
-import { SourceDoc } from '@/types';
-import connectDB from '@/utils/mongoConnection';
 import { makeChain } from '@/utils/makechain';
 import { pinecone } from '@/utils/pinecone-client';
-import Message from '@/models/Message';
 
 export default async function handler(
   req: NextApiRequest,
@@ -16,7 +13,6 @@ export default async function handler(
     history,
     chatId,
     selectedNamespace,
-    userEmail,
     returnSourceDocuments,
     modelTemperature,
   } = req.body;
@@ -31,8 +27,6 @@ export default async function handler(
     return res.status(400).json({ message: 'No question in the request' });
   }
 
-  await connectDB();
-
   const sanitizedQuestion = question.trim().replaceAll('\n', ' ');
 
   try {
@@ -47,16 +41,6 @@ export default async function handler(
       },
     );
 
-    const userMessage = new Message({
-      sender: 'user',
-      content: sanitizedQuestion,
-      chatId: chatId,
-      namespace: selectedNamespace,
-      userEmail: userEmail,
-    });
-
-    await userMessage.save();
-
     const chain = makeChain(
       vectorStore,
       returnSourceDocuments,
@@ -67,22 +51,6 @@ export default async function handler(
       chat_history: history || [],
     });
 
-    const botMessage = new Message({
-      sender: 'bot',
-      content: response.text.toString(),
-      chatId: chatId,
-      namespace: selectedNamespace,
-      userEmail: userEmail,
-      sourceDocs: response.sourceDocuments
-        ? response.sourceDocuments.map((doc: SourceDoc) => ({
-            pageContent: doc.pageContent,
-            metadata: { source: doc.metadata.source },
-          }))
-        : [],
-    });
-
-    await botMessage.save();
-
     res
       .status(200)
       .json({ text: response.text, sourceDocuments: response.sourceDocuments });