meri marzi

Author: Abh1noob

src/app/layout.tsx

@@ -44,12 +44,10 @@ export default function RootLayout({
             disableTransitionOnChange
           >
             <Toaster position="top-right" toastOptions={{ id: "_toast" }} />
-            <NavigationWrapper>
-              {children}
-            </NavigationWrapper>
+            <NavigationWrapper>{children}</NavigationWrapper>
           </ThemeProvider>
         </Providers>
       </body>
     </html>
   );
-}
+}

src/app/users/page.tsx

@@ -1,26 +1,25 @@
 "use client";
-import { DataTable } from "@/components/table/data-table";
 import userCol from "@/components/columns/UserCol";
+import { DataTable } from "@/components/table/data-table";
 // import { useEffect, useMemo, useState } from "react";
 // import { user } from "@/store/interfaces";
 // import useToast from "@/lib/toast";
-import { useQuery } from "@tanstack/react-query";
+import { downloadCSV } from "@/api/downloadCSV";
 import { fetchUsers } from "@/api/fetchUsers";
-import {type User } from "@/data/schema";
-import {  useState } from "react";
-import { useDebounce } from "use-debounce";
-import Image from "next/image";
 import loading from "@/assets/images/loading.gif";
-import { UserModal } from "@/components/table/user-modal";
 import { Button } from "@/components/ui/button";
-import { downloadCSV } from "@/api/downloadCSV";
+import { type User } from "@/data/schema";
+import { useQuery } from "@tanstack/react-query";
+import Image from "next/image";
+import { useState } from "react";
+import { useDebounce } from "use-debounce";
 
 export default function Users() {
   const [cursorHistory, setCursorHistory] = useState<string[]>([]);
   const [currentCursor, setCurrentCursor] = useState<string | undefined>(
     undefined,
   );
-  const [pageLimit, setPageLimit] =useState<number>(10);
+  const [pageLimit, setPageLimit] = useState<number>(10);
   const [theName, setTheName] = useState<string>("");
   // const queryClient = useQueryClient();
   const [nameDebounce] = useDebounce(theName, 1000);
@@ -31,7 +30,11 @@ export default function Users() {
   } = useQuery({
     queryKey: ["users", currentCursor, nameDebounce, pageLimit],
     queryFn: () =>
-      fetchUsers({ limit: pageLimit, cursorId: currentCursor, name: nameDebounce }),
+      fetchUsers({
+        limit: pageLimit,
+        cursorId: currentCursor,
+        name: nameDebounce,
+      }),
     placeholderData: (previousData) => previousData,
     // enabled: !!debouncedSearch,
   });
@@ -52,33 +55,28 @@ export default function Users() {
     }
   };
 
+  const onClick = async () => {
+    try {
+      const blob = await downloadCSV();
 
+      const url = window.URL.createObjectURL(blob.data as Blob);
+      const a = document.createElement("a");
+      a.href = url;
+      a.download = "users.csv"; // Set the filename for the downloaded file
+      document.body.appendChild(a);
 
+      a.click();
 
-  const onClick = async () => {
-      try {
-        const blob = await downloadCSV();
-    
-        const url = window.URL.createObjectURL(blob.data as Blob);
-        const a = document.createElement('a');
-        a.href = url;
-        a.download = 'users.csv'; // Set the filename for the downloaded file
-        document.body.appendChild(a);
-    
-        a.click();
-    
-        window.URL.revokeObjectURL(url);
-        document.body.removeChild(a);
-      } catch (err) {
-        console.error('Error downloading CSV:', err);
-        alert('Failed to download CSV. Please try again.');
-      }
-    };
+      window.URL.revokeObjectURL(url);
+      document.body.removeChild(a);
+    } catch (err) {
+      console.error("Error downloading CSV:", err);
+      alert("Failed to download CSV. Please try again.");
+    }
+  };
   return (
     <div className="p-4">
-      <div className="mb-4"></div>
-      {/* <DataTableUsers users={oosers} columns={userCol} /> */}
-      <div className="mb-4 flex flex items-start">
+      <div className="mb-4 flex items-start">
         <input
           className="bg-gray w-[50%] rounded-md border p-2 text-white"
           placeholder="Search"
@@ -88,9 +86,9 @@ export default function Users() {
         />
         <Button onClick={onClick}>Download CSV </Button>
       </div>
-      
+
       {isError && <div className="text-red-500">Error fetching team data</div>}
-      
+
       {isLoading && (
         <div className="flex justify-center">
           <Image
@@ -102,17 +100,18 @@ export default function Users() {
           />
         </div>
       )}
-      
-      
-      <DataTable<User, string>
-        setPageLimit={setPageLimit}
-        pageLimit={pageLimit}
-        columns={userCol}
-        data={userList?.users ?? []}
-        // data={oosers}
-        handleNextPage={handleNextPage}
-        handlePrevPage={handlePrevPage}
-      />
+
+      <div className="w-full overflow-hidden">
+        <DataTable<User, string>
+          setPageLimit={setPageLimit}
+          pageLimit={pageLimit}
+          columns={userCol}
+          data={userList?.users ?? []}
+          // data={oosers}
+          handleNextPage={handleNextPage}
+          handlePrevPage={handlePrevPage}
+        />
+      </div>
     </div>
   );
 }