feat(app): switch to useChat hook

src/components/Chat.tsx

@@ -5,28 +5,11 @@ import MessageInput from './MessageInput';
 import { File, Message } from './ChatWindow';
 import MessageBox from './MessageBox';
 import MessageBoxLoading from './MessageBoxLoading';
+import { useChat } from '@/lib/hooks/useChat';
+
+const Chat = () => {
+  const { messages, loading, messageAppeared } = useChat();
 
-const Chat = ({
-  loading,
-  messages,
-  sendMessage,
-  messageAppeared,
-  rewrite,
-  fileIds,
-  setFileIds,
-  files,
-  setFiles,
-}: {
-  messages: Message[];
-  sendMessage: (message: string) => void;
-  loading: boolean;
-  messageAppeared: boolean;
-  rewrite: (messageId: string) => void;
-  fileIds: string[];
-  setFileIds: (fileIds: string[]) => void;
-  files: File[];
-  setFiles: (files: File[]) => void;
-}) => {
   const [dividerWidth, setDividerWidth] = useState(0);
   const dividerRef = useRef<HTMLDivElement | null>(null);
   const messageEnd = useRef<HTMLDivElement | null>(null);
@@ -72,12 +55,8 @@ const Chat = ({
               key={i}
               message={msg}
               messageIndex={i}
-              history={messages}
-              loading={loading}
               dividerRef={isLast ? dividerRef : undefined}
               isLast={isLast}
-              rewrite={rewrite}
-              sendMessage={sendMessage}
             />
             {!isLast && msg.role === 'assistant' && (
               <div className="h-px w-full bg-light-secondary dark:bg-dark-secondary" />
@@ -92,14 +71,7 @@ const Chat = ({
           className="bottom-24 lg:bottom-10 fixed z-40"
           style={{ width: dividerWidth }}
         >
-          <MessageInput
-            loading={loading}
-            sendMessage={sendMessage}
-            fileIds={fileIds}
-            setFileIds={setFileIds}
-            files={files}
-            setFiles={setFiles}
-          />
+          <MessageInput />
         </div>
       )}
     </div>