feat: complete day 20 react task

2025-07-23 23:25:19 +01:00
parent 743187b216
commit b0d86465f2
259 changed files with 42427 additions and 11 deletions
@@ -0,0 +1,80 @@
+import React, { useState } from "react";
+import Chat from "./Chat";
+import MobileSiderbar from "./MobileSidebar";
+import Sidebar from "./Sidebar";
+import MkdSDK from "Utils/MkdSDK";
+import { BiRefresh } from "react-icons/bi";
+
+function ChatBot() {
+  const [chatRooms, setChatRooms] = React.useState(["old"]);
+  const [runPod, setRunPod] = React.useState("");
+  const [currentRoom, setCurrentRoom] = React.useState(0);
+  const [isComponentVisible, setIsComponentVisible] = useState(false);
+  const d = chatRooms.filter((room, index) => index === currentRoom);
+  let sdk = new MkdSDK();
+
+  const toggleComponentVisibility = () => {
+    setIsComponentVisible(!isComponentVisible);
+  };
+
+  const runPodStatus = async () => {
+    try {
+      const response = await sdk.runPodStatus();
+
+      if (!response.error) {
+        setRunPod(response.status);
+      }
+    } catch (error) {
+      console.log(error);
+    }
+  };
+
+  React.useEffect(() => {
+    runPodStatus();
+  }, []);
+
+  return (
+    <div className="relative text-center">
+      <main className="overflow-hidde relative flex h-screen w-full">
+        {isComponentVisible ? (
+          <MobileSiderbar
+            setCurrentRoom={setCurrentRoom}
+            chatRooms={chatRooms}
+            setChatRooms={setChatRooms}
+            toggleComponentVisibility={toggleComponentVisibility}
+          />
+        ) : null}
+        <div className="dark hidden flex-shrink-0 bg-gray-900 md:flex md:w-[260px] md:flex-col">
+          <div className="flex h-full min-h-0 flex-col ">
+            <Sidebar
+              setCurrentRoom={setCurrentRoom}
+              chatRooms={chatRooms}
+              setChatRooms={setChatRooms}
+            />
+          </div>
+        </div>
+        {chatRooms.map((chatRoom, index) => (
+          <Chat
+            key={index}
+            index={index}
+            currentRoom={currentRoom}
+            toggleComponentVisibility={toggleComponentVisibility}
+          />
+        ))}
+      </main>
+      <div className="absolute right-2 top-12 flex items-center gap-2 sm:right-4 sm:top-7">
+        <span className="rounded-md bg-white p-2 text-xs font-bold">
+          RunPod: {runPod}
+        </span>
+        <BiRefresh
+          onClick={() => runPodStatus()}
+          className="text-xl text-green-600 hover:cursor-pointer"
+        />
+      </div>
+    </div>
+  );
+}
+
+export default ChatBot;
+
+