Restructured resource

src/components/Resources/resource-tab.tsx

+"use client";
+import Breadcrumb from "@/components/Breadcrumbs/Breadcrumb";
+import DefaultLayout from "@/components/Layouts/DefaultLayout";
+import React, { useEffect, useState } from "react";
+import { Tabs, Tab } from "@mui/material";
+import { usePathname } from "next/navigation";
+import ResourceTile from "@/components/Resources/resource-tile";
+
+const ResourceTab = () => {
+  const [activeTab, setActiveTab] = React.useState(0);
+  const pathname = usePathname();
+
+  const handleTabChange = (event: React.ChangeEvent<{}>, newValue: number) => {
+    setActiveTab(newValue);
+  };
+
+  const [resources, setResources] = useState<any[]>([]);
+  // const pathname = usePathname();
+  useEffect(() => {
+    fetchData();
+  }, []);
+
+  const fetchData = async () => {
+    try {
+      const response = await fetch(
+        "https://simplecharts.maheshlabs.com/api/resources?resource-category-id=" +
+          "1",
+      );
+      const data = await response.json();
+      setResources(data);
+    } catch (error) {
+      console.error("Error fetching resources:", error);
+    }
+  };
+
+  return (
+    <div>
+      <Tabs
+        value={activeTab}
+        onChange={handleTabChange}
+        aria-label="Choose Data tabs"
+      >
+        {/* Make below tabs bold */}
+        <Tab label="Workshop Slides" />
+        <Tab label="Activity Books" />
+        <Tab label="Auto-Graded Activities" />
+        <Tab label="Activities Created by Teachers" />
+      </Tabs>
+
+      <div role="tabpanel" hidden={activeTab !== 0}>
+        {/* Content for Choose Sample tab */}
+        <ResourceTile></ResourceTile>
+        {/* Add grid to display images */}
+      </div>
+
+      <div role="tabpanel" hidden={activeTab !== 1}>
+        {/* Content for Create Data tab */}
+
+        {/* Add form to create CSV data */}
+      </div>
+
+      <div role="tabpanel" hidden={activeTab !== 2}>
+        {/* Content for Upload File tab */}
+
+        {/* Add file upload input */}
+      </div>
+    </div>
+  );
+};
+
+export default ResourceTab;