added a exit button on the chat bot and make sure it still working

app/chatbot/page.tsx

@@ -1,20 +1,22 @@
 "use client";
 
 import { useState, useEffect, useRef, useCallback } from "react";
-import { useSearchParams } from "next/navigation";
+import { useSearchParams, useRouter } from "next/navigation";
 import ChatInput from "../utils/component/ui/ChatInput";
 import MessageWindow from "../utils/component/ui/MessageWindow";
 import { ChatHistory, ChatSetting, Message , MessageRole } from "@/app/exportType/types";
 
 export default function Home(){
   const [history, setHistory] = useState<ChatHistory>([])
+  const [loading, setLoading] = useState(false);
   const historyRef = useRef<ChatHistory>([]); // Create a ref for history
   const [settings] = useState<ChatSetting>({
     temperature:1,
     model:"gemini-2.5-pro",
-    sysTemInstructions:"you are a ai helper. Your goal is to expand the project idea and interact with the user on any problem or question they have with the project. You are not allow to code the project for them and stray away from your job"
+    systemInstruction:"you are a ai helper. Your goal is to expand the project idea and interact with the user on any problem or question they have with the project. You are not allow to code the project for them and stray away from your job"
     
   });
+  const router = useRouter();
   const searchParams = useSearchParams();
   const initialMessageSent = useRef(false);
 
@@ -32,6 +34,7 @@ export default function Home(){
       const currentHistory = [...prevHistory, newUserMessage];
       
       const sendApiRequest = async () => {
+        setLoading(true);
         try{
           const response = await fetch("/api/chat", {
             method: "POST",
@@ -49,6 +52,7 @@ export default function Home(){
 
           if (data.error) {
             console.error("AI Error:", data.error);
+            setLoading(false);
             return;
           }
 
@@ -63,6 +67,7 @@ export default function Home(){
         catch (error) {
           console.error("Request Failed:", error);
         }
+        setLoading(false);
       };
       sendApiRequest();
 
@@ -88,6 +93,7 @@ export default function Home(){
         }, 0);
 
         const sendInitialApiRequest = async () => {
+          setLoading(true);
           try {
             const response = await fetch("/api/chat", {
               method: "POST",
@@ -105,6 +111,7 @@ export default function Home(){
 
             if (data.error) {
               console.error("AI Error:", data.error);
+              setLoading(false);
               return;
             }
 
@@ -117,6 +124,7 @@ export default function Home(){
           } catch (error) {
             console.error("Request Failed:", error);
           }
+          setLoading(false);
         };
 
         sendInitialApiRequest();
@@ -128,7 +136,13 @@ export default function Home(){
 
   return (
     <div className="flex flex-col py-32">
-      <MessageWindow history={history} />
+      <button
+        onClick={() => router.push('/Dashboard')}
+        className="absolute top-4 right-4 bg-red-500 hover:bg-red-700 text-white font-bold py-2 px-4 rounded"
+      >
+        Exit
+      </button>
+      <MessageWindow history={history} isLoading={loading} />
       <ChatInput onSend={handleSend} onOpenSettings={() => {}} />
     </div>
   );