diff --git a/components/ChatView/Header.tsx b/components/ChatView/Header.tsx index 35a819c..70599f8 100644 --- a/components/ChatView/Header.tsx +++ b/components/ChatView/Header.tsx @@ -1,15 +1,14 @@ import { Menu, Popover } from "@headlessui/react"; import Link from "next/link"; import { toast } from "react-hot-toast"; -import { useChatStore, useMessageStore, useUserStore } from "../../store"; +import { getAssistantById, useChatStore, useMessageStore } from "../../store"; import Icon from "../Icon"; const Header = () => { - const userStore = useUserStore(); const chatStore = useChatStore(); const messageStore = useMessageStore(); const currentChat = chatStore.currentChat; - const assistant = userStore.getAssistantById(currentChat?.assistantId)!; + const assistant = getAssistantById(currentChat?.assistantId)!; const handleClearMessage = () => { messageStore.clearMessage((message) => message.chatId !== currentChat?.id); diff --git a/components/ChatView/MessageTextarea.tsx b/components/ChatView/MessageTextarea.tsx index ca6b8ef..0e22b86 100644 --- a/components/ChatView/MessageTextarea.tsx +++ b/components/ChatView/MessageTextarea.tsx @@ -1,7 +1,7 @@ import { useEffect, useRef, useState } from "react"; import { toast } from "react-hot-toast"; import TextareaAutosize from "react-textarea-autosize"; -import { useChatStore, useMessageStore, useUserStore } from "../../store"; +import { localUser, useChatStore, useMessageStore } from "../../store"; import { generateUUID } from "../../utils"; import Icon from "../Icon"; @@ -12,7 +12,6 @@ interface Props { const MessageTextarea = (props: Props) => { const { disabled, sendMessage } = props; - const userStore = useUserStore(); const chatStore = useChatStore(); const messageStore = useMessageStore(); const [value, setValue] = useState(""); @@ -45,7 +44,7 @@ const MessageTextarea = (props: Props) => { messageStore.addMessage({ id: generateUUID(), chatId: chatStore.currentChat.id, - creatorId: userStore.currentUser.id, + creatorId: localUser.id, createdAt: Date.now(), content: value, }); diff --git a/components/ChatView/MessageView.tsx b/components/ChatView/MessageView.tsx index 4ef5467..192f61d 100644 --- a/components/ChatView/MessageView.tsx +++ b/components/ChatView/MessageView.tsx @@ -1,5 +1,5 @@ import { marked } from "marked"; -import { useUserStore } from "../../store"; +import { localUser } from "../../store"; import { Message } from "../../types"; interface Props { @@ -8,9 +8,7 @@ interface Props { const MessageView = (props: Props) => { const message = props.message; - const userStore = useUserStore(); - const currentUser = userStore.currentUser; - const isCurrentUser = message.creatorId === currentUser.id; + const isCurrentUser = message.creatorId === localUser.id; return (
diff --git a/components/ChatView/index.tsx b/components/ChatView/index.tsx index 6ab3986..79e4932 100644 --- a/components/ChatView/index.tsx +++ b/components/ChatView/index.tsx @@ -1,6 +1,6 @@ import axios from "axios"; import { useEffect, useRef, useState } from "react"; -import { defaultChat, getPromptOfAssistant, useChatStore, useMessageStore, useUserStore } from "../../store"; +import { defaultChat, getAssistantById, getPromptOfAssistant, localUser, useChatStore, useMessageStore } from "../../store"; import { Chat, Message, UserRole } from "../../types"; import { generateUUID } from "../../utils"; import Icon from "../Icon"; @@ -10,7 +10,6 @@ import MessageTextarea from "./MessageTextarea"; const ChatView = () => { const chatStore = useChatStore(); - const userStore = useUserStore(); const messageStore = useMessageStore(); const [messageList, setMessageList] = useState([]); const [currentChat, setCurrentChat] = useState(null); @@ -18,11 +17,11 @@ const ChatView = () => { const chatViewRef = useRef(null); useEffect(() => { - if (!userStore.getAssistantById(chatStore.currentChat.assistantId)) { + if (!getAssistantById(chatStore.currentChat.assistantId)) { chatStore.setCurrentChat(defaultChat); } setCurrentChat(chatStore.currentChat); - }, [chatStore, userStore]); + }, [chatStore]); useEffect(() => { setMessageList(messageStore.messageList.filter((message) => message.chatId === currentChat?.id)); @@ -47,7 +46,7 @@ const ChatView = () => { setIsRequesting(true); const messageList = messageStore.getState().messageList.filter((message) => message.chatId === currentChat.id); - const prompt = getPromptOfAssistant(userStore.getAssistantById(currentChat.assistantId)!); + const prompt = getPromptOfAssistant(getAssistantById(currentChat.assistantId)!); const { data } = await axios.post("/api/chat", { messages: [ { @@ -55,7 +54,7 @@ const ChatView = () => { content: prompt, }, ...messageList.map((message) => ({ - role: message.creatorId === userStore.currentUser.id ? UserRole.User : UserRole.Assistant, + role: message.creatorId === localUser.id ? UserRole.User : UserRole.Assistant, content: message.content, })), ], diff --git a/store/assistant.ts b/store/assistant.ts index 558c0b9..15bd2b5 100644 --- a/store/assistant.ts +++ b/store/assistant.ts @@ -1,4 +1,4 @@ -import { User, UserRole } from "../types"; +import { Id, User, UserRole } from "../types"; // Assistant is a special user. export const assistantList: User[] = [ @@ -11,6 +11,11 @@ export const assistantList: User[] = [ }, ]; +export const getAssistantById = (id: Id) => { + const user = assistantList.find((user) => user.id === id); + return user || undefined; +}; + // getPromptOfAssistant define the special prompt for each assistant. export const getPromptOfAssistant = (assistant: User) => { if (assistant.id === "assistant-dba") { diff --git a/store/user.ts b/store/user.ts index e5f6d68..d8aa722 100644 --- a/store/user.ts +++ b/store/user.ts @@ -1,26 +1,9 @@ -import { create } from "zustand"; -import { assistantList } from "."; -import { Id, User, UserRole } from "../types"; +import { User, UserRole } from "../types"; -const localUser: User = { +export const localUser: User = { id: "local-user", name: "Local user", description: "", avatar: "", role: UserRole.User, }; - -interface UserState { - assistantList: User[]; - currentUser: User; - getAssistantById: (id: string) => User | undefined; -} - -export const useUserStore = create()(() => ({ - assistantList: assistantList, - currentUser: localUser, - getAssistantById: (id: Id) => { - const user = assistantList.find((user) => user.id === id); - return user || undefined; - }, -}));