chat loading fix

Author: followDev

client/src/App.tsx

@@ -30,6 +30,7 @@ type User = {
 export default function App() {
   const [messages, setMessages] = useState<Message[]>([]);
   const [loading, setLoading] = useState<boolean>(false);
+  const [chatLoading, setChatloading] = useState(true);
   const [auth, setAuth] = useState<User | undefined>(() => {
     const user = localStorage.getItem("auth");
     if (!user) return undefined;
@@ -69,6 +70,9 @@ export default function App() {
       })
       .catch((err) => {
         console.log(err);
+      })
+      .finally(() => {
+        setChatloading(false);
       });
   }, [auth]);
 
@@ -108,6 +112,7 @@ export default function App() {
                 )}
 
                 <Input
+                  chatLoading={chatLoading}
                   handlelogout={handlelogout}
                   img={auth?.avatar}
                   apiKey={auth?.apiKey}

client/src/components/Input.tsx

@@ -10,6 +10,7 @@ type InputProps = {
   apiKey: string;
   img: string;
   handlelogout: () => void;
+  chatLoading: boolean;
 };
 
 export default function Input({
@@ -18,6 +19,7 @@ export default function Input({
   apiKey,
   img,
   handlelogout,
+  chatLoading,
 }: InputProps) {
   const [input, setInput] = useState<string>("");
   function handleInput() {
@@ -69,6 +71,7 @@ export default function Input({
         }}
       >
         <input
+          disabled={chatLoading}
           autoFocus={true}
           onKeyDown={(e) => e.keyCode === 13 && input != "" && handleInput()}
           onChange={(e) => setInput(e.target.value)}