eleven-solutions-common-website-unique-web 1.0.33 → 1.0.35

package/src/components/admin/Users.tsx

@@ -1,359 +1,384 @@
-import React from "react";
-import { useState, useEffect } from "react";
+// import React from "react";
+// import { useState, useEffect } from "react";
 
-import { FaPlus } from "react-icons/fa";
+// import { FaPlus } from "react-icons/fa";
 
-import { fetchUsersApi, deleteUserApi } from "../api/user";
+// import { fetchUsersApi, deleteUserApi } from "../api/user";
 
-function Users() {
-  const [users, setUsers] = useState<any[]>([]);
-
-  const fetchUsersData = async () => {
-    const data = await fetchUsersApi();
-    if (data) {
-      setUsers(data as any[]);
-    } else {
-      console.error("Failed to fetch users");
-    }
-  };
+// function Users() {
+//   const [users, setUsers] = useState<any[]>([]);
 
-  useEffect(() => {
-    fetchUsersData();
-  }, []);
-  // const handleNav = (e: React.FormEvent) => {
-  //   e.preventDefault();
-  //   window.history.pushState({}, "", "/admin/users/userform");
+//   const fetchUsersData = async () => {
+//     const data = await fetchUsersApi();
+//     if (data) {
+//       setUsers(data as any[]);
+//     } else {
+//       console.error("Failed to fetch users");
+//     }
+//   };
 
-  //   // Trigger React's routing logic manually if required
-  //   const navEvent = new PopStateEvent("popstate");
-  //   window.dispatchEvent(navEvent);
-  // };
+//   useEffect(() => {
+//     fetchUsersData();
+//   }, []);
+//   // const handleNav = (e: React.FormEvent) => {
+//   //   e.preventDefault();
+//   //   window.history.pushState({}, "", "/admin/users/userform");
 
-  const handleNavigation = (event: React.MouseEvent, path: string) => {
-    event.preventDefault();
-    window.history.pushState({}, "", path);
-    window.dispatchEvent(new PopStateEvent("popstate"));
-  };
+//   //   // Trigger React's routing logic manually if required
+//   //   const navEvent = new PopStateEvent("popstate");
+//   //   window.dispatchEvent(navEvent);
+//   // };
 
-  const [currentPage, setCurrentPage] = useState(1);
-  const itemsPerPage = 10;
+//   const handleNavigation = (event: React.MouseEvent, path: string) => {
+//     event.preventDefault();
+//     window.history.pushState({}, "", path);
+//     window.dispatchEvent(new PopStateEvent("popstate"));
+//   };
 
-  const totalPages = Math.ceil(users.length / itemsPerPage);
+//   const [currentPage, setCurrentPage] = useState(1);
+//   const itemsPerPage = 10;
 
-  const handleNextPage = () => {
-    if (currentPage < totalPages) {
-      setCurrentPage(currentPage + 1);
-    }
-  };
+//   const totalPages = Math.ceil(users.length / itemsPerPage);
 
-  const handlePreviousPage = () => {
-    if (currentPage > 1) {
-      setCurrentPage(currentPage - 1);
-    }
-  };
+//   const handleNextPage = () => {
+//     if (currentPage < totalPages) {
+//       setCurrentPage(currentPage + 1);
+//     }
+//   };
 
-  const handlePageClick = (pageNumber: number) => {
-    setCurrentPage(pageNumber);
-  };
+//   const handlePreviousPage = () => {
+//     if (currentPage > 1) {
+//       setCurrentPage(currentPage - 1);
+//     }
+//   };
 
-  const paginatedUsers = users.slice(
-    (currentPage - 1) * itemsPerPage,
-    currentPage * itemsPerPage
-  );
+//   const handlePageClick = (pageNumber: number) => {
+//     setCurrentPage(pageNumber);
+//   };
 
-  const handleDeleteClick = async (id: string) => {
-    try {
-      await deleteUserApi(id);
-      alert("User deleted successfully");
+//   const paginatedUsers = users.slice(
+//     (currentPage - 1) * itemsPerPage,
+//     currentPage * itemsPerPage
+//   );
 
-      fetchUsersData();
-    } catch (error) {
-      console.error("Error deleting User:", error);
-    }
-  };
+//   const handleDeleteClick = async (id: string) => {
+//     try {
+//       await deleteUserApi(id);
+//       alert("User deleted successfully");
 
-  // const handleEditClick = (id: string) => {
-  //   navigate("/admin/user/userform", { state: { id } });
-  // };
+//       fetchUsersData();
+//     } catch (error) {
+//       console.error("Error deleting User:", error);
+//     }
+//   };
 
-  const handleEditClick = (id: string) => {
-    return (
-      <a
-        href={`/admin/users/userform?id=${id}`}
-        onClick={(e) => e.preventDefault()}
-      >
-        Edit User
-      </a>
-    );
+//   // const handleEditClick = (id: string) => {
+//   //   navigate("/admin/user/userform", { state: { id } });
+//   // };
+
+//   const handleEditClick = (id: string) => {
+//     return (
+//       <a
+//         href={`/admin/users/userform?id=${id}`}
+//         onClick={(e) => e.preventDefault()}
+//       >
+//         Edit User
+//       </a>
+//     );
+//   };
+
+//   return (
+//     <div className="container px-4 mx-auto mt-6">
+//       <div className="w-3/4">
+//         <h1 className="text-3xl font-bold text-blue-600 mb-5">Users</h1>
+//       </div>
+//       <div className="flex-grow ml-0 w-full mt-10">
+//         <form className="w-full ">
+//           <label
+//             htmlFor="default-search"
+//             className="mb-2 text-sm font-medium text-gray-900 sr-only dark:text-white"
+//           >
+//             Search
+//           </label>
+//           <div className="relative w-full">
+//             <div className="absolute inset-y-0 start-0 flex items-center ps-3 pointer-events-none">
+//               <svg
+//                 className="w-4 h-4 text-gray-500 dark:text-gray-400"
+//                 aria-hidden="true"
+//                 xmlns="http://www.w3.org/2000/svg"
+//                 fill="none"
+//                 viewBox="0 0 20 20"
+//               >
+//                 <path
+//                   stroke="currentColor"
+//                   stroke-linecap="round"
+//                   stroke-linejoin="round"
+//                   stroke-width="2"
+//                   d="m19 19-4-4m0-7A7 7 0 1 1 1 8a7 7 0 0 1 14 0Z"
+//                 />
+//               </svg>
+//             </div>
+//             <input
+//               type="search"
+//               id="default-search"
+//               className="inline-block min-w-full p-3 ps-10 outline-none text-sm text-gray-900 border border-gray-300 rounded-lg bg-gray-50 focus:ring-blue-500 focus:border-blue-500 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500"
+//               placeholder="Search Users"
+//               required
+//             />
+//             <button
+//               type="submit"
+//               className="text-white absolute end-1.5 bottom-1.5 bg-blue-700 hover:bg-blue-800 focus:ring-4 focus:outline-none focus:ring-blue-300 font-medium rounded-lg text-sm px-4 py-2 dark:bg-blue-600 dark:hover:bg-blue-700 dark:focus:ring-blue-800"
+//             >
+//               Search
+//             </button>
+//           </div>
+//         </form>
+//       </div>
+//       <div className="flex-grow ml-0 w-3/4">
+//         <form className="w-auto">{/* Search Form */}</form>
+//       </div>
+//       <div className="flex-grow ml-0 mt-4 w-full">
+//         <div className="overflow-hidden border border-gray-200 dark:border-gray-700 md:rounded-lg mt-6">
+//           <table className="min-w-full divide-y divide-gray-200 dark:divide-gray-700">
+//             <thead className="bg-gray-50 dark:bg-gray-800">
+//               <tr>
+//                 <th
+//                   scope="col"
+//                   className="px-4 py-3.5 text-md font-normal text-left rtl:text-right text-gray-500 dark:text-gray-400"
+//                 >
+//                   Edit/Delete
+//                 </th>
+//                 <th
+//                   scope="col"
+//                   className="py-3.5 px-4 text-md font-normal text-left rtl:text-right text-gray-500 dark:text-gray-400"
+//                 >
+//                   <div className="flex items-center gap-x-3">
+//                     <span>Name</span>
+//                   </div>
+//                 </th>
+
+//                 <th
+//                   scope="col"
+//                   className="px-4 py-3.5 text-md font-normal text-left rtl:text-right text-gray-500 dark:text-gray-400"
+//                 >
+//                   <button className="flex items-center gap-x-2">
+//                     <span>Email</span>
+//                   </button>
+//                 </th>
+
+//                 <th
+//                   scope="col"
+//                   className="px-4 py-3.5 text-md font-normal text-left rtl:text-right text-gray-500 dark:text-gray-400"
+//                 >
+//                   <button className="flex items-center gap-x-2">
+//                     <span>Mobile</span>
+//                   </button>
+//                 </th>
+
+//                 <th
+//                   scope="col"
+//                   className="px-4 py-3.5 text-md font-normal text-left rtl:text-right text-gray-500 dark:text-gray-400"
+//                 >
+//                   Address
+//                 </th>
+
+//                 <th
+//                   scope="col"
+//                   className="px-4 py-3.5 text-md font-normal text-left rtl:text-right text-gray-500 dark:text-gray-400"
+//                 >
+//                   Role Type
+//                 </th>
+//               </tr>
+//             </thead>
+//             <tbody className="bg-white divide-y divide-gray-200 dark:divide-gray-700 dark:bg-gray-900">
+//               {paginatedUsers.map((user, index) => (
+//                 <tr key={user.id || index}>
+//                   <td className="px-4 py-4 text-sm whitespace-nowrap">
+//                     <div className="flex items-center gap-x-6">
+//                       <button
+//                         onClick={() => handleDeleteClick(user.id)}
+//                         className="text-gray-500 transition-colors duration-200 dark:hover:text-red-600 dark:text-gray-300 hover:text-red-500 focus:outline-none"
+//                       >
+//                         <svg
+//                           xmlns="http://www.w3.org/2000/svg"
+//                           fill="none"
+//                           viewBox="0 0 24 24"
+//                           stroke-width="1.5"
+//                           stroke="currentColor"
+//                           className="w-5 h-5"
+//                         >
+//                           <path
+//                             stroke-linecap="round"
+//                             stroke-linejoin="round"
+//                             d="M14.74 9l-.346 9m-4.788 0L9.26 9m9.968-3.21c.342.052.682.107 1.022.166m-1.022-.165L18.16 19.673a2.25 2.25 0 01-2.244 2.077H8.084a2.25 2.25 0 01-2.244-2.077L4.772 5.79m14.456 0a48.108 48.108 0 00-3.478-.397m-12 .562c.34-.059.68-.114 1.022-.165m0 0a48.11 48.11 0 013.478-.397m7.5 0v-.916c0-1.18-.91-2.164-2.09-2.201a51.964 51.964 0 00-3.32 0c-1.18.037-2.09 1.022-2.09 2.201v.916m7.5 0a48.667 48.667 0 00-7.5 0"
+//                           />
+//                         </svg>
+//                       </button>
+
+//                       <a
+//                         href={`/admin/users/userform?id=${user.id}`}
+//                         onClick={(e) => {
+//                           e.preventDefault(); // Prevent default navigation
+//                           handleEditClick(user.id); // Trigger the edit functionality
+//                           window.location.href = `/admin/users/userform?id=${user.id}`; // Manually navigate
+//                         }}
+//                       >
+//                         <button className="text-gray-500 transition-colors duration-200 dark:hover:text-yellow-500 dark:text-gray-300 hover:text-yellow-500 focus:outline-none">
+//                           <svg
+//                             xmlns="http://www.w3.org/2000/svg"
+//                             fill="none"
+//                             viewBox="0 0 24 24"
+//                             strokeWidth="1.5"
+//                             stroke="currentColor"
+//                             className="w-5 h-5"
+//                           >
+//                             <path
+//                               strokeLinecap="round"
+//                               strokeLinejoin="round"
+//                               d="M16.862 4.487l1.687-1.688a1.875 1.875 0 112.652 2.652L10.582 16.07a4.5 4.5 0 01-1.897 1.13L6 18l.8-2.685a4.5 4.5 0 011.13-1.897l8.932-8.931zm0 0L19.5 7.125M18 14v4.75A2.25 2.25 0 0115.75 21H5.25A2.25 2.25 0 013 18.75V8.25A2.25 2.25 0 015.25 6H10"
+//                             />
+//                           </svg>
+//                         </button>
+//                       </a>
+//                     </div>
+//                   </td>
+//                   <td className="px-4 py-4 text-sm font-medium text-gray-700 whitespace-nowrap">
+//                     <div className="inline-flex items-center gap-x-3">
+//                       <div className="flex items-center gap-x-2">
+//                         <div>
+//                           <h2 className="  text-sm font-medium text-gray-800 dark:text-white ">
+//                             {user.name}
+//                           </h2>
+//                         </div>
+//                       </div>
+//                     </div>
+//                   </td>
+//                   <td className="px-4 py-4 text-sm text-gray-500 dark:text-gray-300 whitespace-nowrap">
+//                     {user.email}
+//                   </td>
+//                   <td className="px-4 py-4 text-sm text-gray-500 dark:text-gray-300 whitespace-nowrap">
+//                     {user?.mobile || "Not Provided"}
+//                   </td>
+//                   <td className="px-4 py-4 text-sm text-gray-500 dark:text-gray-300 whitespace-nowrap">
+//                     {user?.address || "Not Provided"}
+//                   </td>
+//                   <td className="px-4 py-4 text-sm text-gray-500 dark:text-gray-300 whitespace-nowrap">
+//                     {user.roleType === "1" ? "Guest" : "Admin"}
+//                   </td>
+//                 </tr>
+//               ))}
+//             </tbody>
+//           </table>
+//         </div>
+
+//         <div className="flex items-center justify-between mt-6">
+//           <button
+//             onClick={handlePreviousPage}
+//             disabled={currentPage === 1}
+//             className="flex items-center px-5 py-2 text-sm text-gray-700 capitalize transition-colors duration-200 bg-white border rounded-md gap-x-2 hover:bg-gray-100 dark:bg-gray-900 dark:text-gray-200 dark:border-gray-700 dark:hover:bg-gray-800"
+//           >
+//             <svg
+//               xmlns="http://www.w3.org/2000/svg"
+//               fill="none"
+//               viewBox="0 0 24 24"
+//               stroke-width="1.5"
+//               stroke="currentColor"
+//               className="w-5 h-5 rtl:-scale-x-100"
+//             >
+//               <path
+//                 stroke-linecap="round"
+//                 stroke-linejoin="round"
+//                 d="M6.75 15.75L3 12m0 0l3.75-3.75M3 12h18"
+//               />
+//             </svg>
+
+//             <span>previous</span>
+//           </button>
+
+//           <div className="items-center hidden lg:flex gap-x-3">
+//             {Array.from({ length: totalPages }, (_, index) => (
+//               <button
+//                 key={index + 1}
+//                 onClick={() => handlePageClick(index + 1)}
+//                 className={`px-2 py-1 text-sm ${
+//                   currentPage === index + 1
+//                     ? "text-blue-500 bg-blue-100"
+//                     : "text-gray-500 hover:bg-gray-100"
+//                 } rounded-md`}
+//               >
+//                 {index + 1}
+//               </button>
+//             ))}
+//           </div>
+//           <button
+//             onClick={handleNextPage}
+//             disabled={currentPage === totalPages}
+//             className="flex items-center px-5 py-2 text-sm text-gray-700 capitalize transition-colors duration-200 bg-white border rounded-md gap-x-2 hover:bg-gray-100 dark:bg-gray-900 dark:text-gray-200 dark:border-gray-700 dark:hover:bg-gray-800"
+//           >
+//             <span>Next</span>
+
+//             <svg
+//               xmlns="http://www.w3.org/2000/svg"
+//               fill="none"
+//               viewBox="0 0 24 24"
+//               stroke-width="1.5"
+//               stroke="currentColor"
+//               className="w-5 h-5 rtl:-scale-x-100"
+//             >
+//               <path
+//                 stroke-linecap="round"
+//                 stroke-linejoin="round"
+//                 d="M17.25 8.25L21 12m0 0l-3.75 3.75M21 12H3"
+//               />
+//             </svg>
+//           </button>
+//         </div>
+
+//         <div className="flex-grow ml-0 mt-4 w-0">
+//           {/* <a href="/admin/users/userform">
+//             <button
+//               type="button"
+//               className="flex items-center justify-center px-6 py-2 font-medium tracking-wide text-white capitalize transition-colors duration-300 transform bg-blue-600 rounded-lg hover:bg-blue-500 focus:outline-none focus:ring focus:ring-blue-300 focus:ring-opacity-80"
+//             >
+//               <FaPlus className="mr-2 font-medium" />
+//               User
+//             </button>
+//           </a> */}
+//           <button
+//             type="button"
+//             onClick={(event) => handleNavigation(event, "users/userform")}
+//             className="flex items-center justify-center px-6 py-2 font-medium tracking-wide text-white capitalize transition-colors duration-300 transform bg-blue-600 rounded-lg hover:bg-blue-500 focus:outline-none focus:ring focus:ring-blue-300 focus:ring-opacity-80"
+//           >
+//             <FaPlus className="mr-2 font-medium" />
+//             User
+//           </button>
+//         </div>
+//       </div>
+//     </div>
+//   );
+// }
+
+// export default Users;
+
+import React from "react";
+
+function Users() {
+  const handleNavigation = (event: React.MouseEvent, path: string) => {
+    event.preventDefault();
+    window.history.pushState({}, "", path);
+    window.dispatchEvent(new PopStateEvent("popstate"));
   };
 
   return (
-    <div className="container px-4 mx-auto mt-6">
-      <div className="w-3/4">
-        <h1 className="text-3xl font-bold text-blue-600 mb-5">Users</h1>
-      </div>
-      <div className="flex-grow ml-0 w-full mt-10">
-        <form className="w-full ">
-          <label
-            htmlFor="default-search"
-            className="mb-2 text-sm font-medium text-gray-900 sr-only dark:text-white"
-          >
-            Search
-          </label>
-          <div className="relative w-full">
-            <div className="absolute inset-y-0 start-0 flex items-center ps-3 pointer-events-none">
-              <svg
-                className="w-4 h-4 text-gray-500 dark:text-gray-400"
-                aria-hidden="true"
-                xmlns="http://www.w3.org/2000/svg"
-                fill="none"
-                viewBox="0 0 20 20"
-              >
-                <path
-                  stroke="currentColor"
-                  stroke-linecap="round"
-                  stroke-linejoin="round"
-                  stroke-width="2"
-                  d="m19 19-4-4m0-7A7 7 0 1 1 1 8a7 7 0 0 1 14 0Z"
-                />
-              </svg>
-            </div>
-            <input
-              type="search"
-              id="default-search"
-              className="inline-block min-w-full p-3 ps-10 outline-none text-sm text-gray-900 border border-gray-300 rounded-lg bg-gray-50 focus:ring-blue-500 focus:border-blue-500 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500"
-              placeholder="Search Users"
-              required
-            />
-            <button
-              type="submit"
-              className="text-white absolute end-1.5 bottom-1.5 bg-blue-700 hover:bg-blue-800 focus:ring-4 focus:outline-none focus:ring-blue-300 font-medium rounded-lg text-sm px-4 py-2 dark:bg-blue-600 dark:hover:bg-blue-700 dark:focus:ring-blue-800"
-            >
-              Search
-            </button>
-          </div>
-        </form>
-      </div>
-      <div className="flex-grow ml-0 w-3/4">
-        <form className="w-auto">{/* Search Form */}</form>
-      </div>
-      <div className="flex-grow ml-0 mt-4 w-full">
-        <div className="overflow-hidden border border-gray-200 dark:border-gray-700 md:rounded-lg mt-6">
-          <table className="min-w-full divide-y divide-gray-200 dark:divide-gray-700">
-            <thead className="bg-gray-50 dark:bg-gray-800">
-              <tr>
-                <th
-                  scope="col"
-                  className="px-4 py-3.5 text-md font-normal text-left rtl:text-right text-gray-500 dark:text-gray-400"
-                >
-                  Edit/Delete
-                </th>
-                <th
-                  scope="col"
-                  className="py-3.5 px-4 text-md font-normal text-left rtl:text-right text-gray-500 dark:text-gray-400"
-                >
-                  <div className="flex items-center gap-x-3">
-                    <span>Name</span>
-                  </div>
-                </th>
-
-                <th
-                  scope="col"
-                  className="px-4 py-3.5 text-md font-normal text-left rtl:text-right text-gray-500 dark:text-gray-400"
-                >
-                  <button className="flex items-center gap-x-2">
-                    <span>Email</span>
-                  </button>
-                </th>
-
-                <th
-                  scope="col"
-                  className="px-4 py-3.5 text-md font-normal text-left rtl:text-right text-gray-500 dark:text-gray-400"
-                >
-                  <button className="flex items-center gap-x-2">
-                    <span>Mobile</span>
-                  </button>
-                </th>
-
-                <th
-                  scope="col"
-                  className="px-4 py-3.5 text-md font-normal text-left rtl:text-right text-gray-500 dark:text-gray-400"
-                >
-                  Address
-                </th>
-
-                <th
-                  scope="col"
-                  className="px-4 py-3.5 text-md font-normal text-left rtl:text-right text-gray-500 dark:text-gray-400"
-                >
-                  Role Type
-                </th>
-              </tr>
-            </thead>
-            <tbody className="bg-white divide-y divide-gray-200 dark:divide-gray-700 dark:bg-gray-900">
-              {paginatedUsers.map((user, index) => (
-                <tr key={user.id || index}>
-                  <td className="px-4 py-4 text-sm whitespace-nowrap">
-                    <div className="flex items-center gap-x-6">
-                      <button
-                        onClick={() => handleDeleteClick(user.id)}
-                        className="text-gray-500 transition-colors duration-200 dark:hover:text-red-600 dark:text-gray-300 hover:text-red-500 focus:outline-none"
-                      >
-                        <svg
-                          xmlns="http://www.w3.org/2000/svg"
-                          fill="none"
-                          viewBox="0 0 24 24"
-                          stroke-width="1.5"
-                          stroke="currentColor"
-                          className="w-5 h-5"
-                        >
-                          <path
-                            stroke-linecap="round"
-                            stroke-linejoin="round"
-                            d="M14.74 9l-.346 9m-4.788 0L9.26 9m9.968-3.21c.342.052.682.107 1.022.166m-1.022-.165L18.16 19.673a2.25 2.25 0 01-2.244 2.077H8.084a2.25 2.25 0 01-2.244-2.077L4.772 5.79m14.456 0a48.108 48.108 0 00-3.478-.397m-12 .562c.34-.059.68-.114 1.022-.165m0 0a48.11 48.11 0 013.478-.397m7.5 0v-.916c0-1.18-.91-2.164-2.09-2.201a51.964 51.964 0 00-3.32 0c-1.18.037-2.09 1.022-2.09 2.201v.916m7.5 0a48.667 48.667 0 00-7.5 0"
-                          />
-                        </svg>
-                      </button>
-
-                      <a
-                        href={`/admin/users/userform?id=${user.id}`}
-                        onClick={(e) => {
-                          e.preventDefault(); // Prevent default navigation
-                          handleEditClick(user.id); // Trigger the edit functionality
-                          window.location.href = `/admin/users/userform?id=${user.id}`; // Manually navigate
-                        }}
-                      >
-                        <button className="text-gray-500 transition-colors duration-200 dark:hover:text-yellow-500 dark:text-gray-300 hover:text-yellow-500 focus:outline-none">
-                          <svg
-                            xmlns="http://www.w3.org/2000/svg"
-                            fill="none"
-                            viewBox="0 0 24 24"
-                            strokeWidth="1.5"
-                            stroke="currentColor"
-                            className="w-5 h-5"
-                          >
-                            <path
-                              strokeLinecap="round"
-                              strokeLinejoin="round"
-                              d="M16.862 4.487l1.687-1.688a1.875 1.875 0 112.652 2.652L10.582 16.07a4.5 4.5 0 01-1.897 1.13L6 18l.8-2.685a4.5 4.5 0 011.13-1.897l8.932-8.931zm0 0L19.5 7.125M18 14v4.75A2.25 2.25 0 0115.75 21H5.25A2.25 2.25 0 013 18.75V8.25A2.25 2.25 0 015.25 6H10"
-                            />
-                          </svg>
-                        </button>
-                      </a>
-                    </div>
-                  </td>
-                  <td className="px-4 py-4 text-sm font-medium text-gray-700 whitespace-nowrap">
-                    <div className="inline-flex items-center gap-x-3">
-                      <div className="flex items-center gap-x-2">
-                        <div>
-                          <h2 className="  text-sm font-medium text-gray-800 dark:text-white ">
-                            {user.name}
-                          </h2>
-                        </div>
-                      </div>
-                    </div>
-                  </td>
-                  <td className="px-4 py-4 text-sm text-gray-500 dark:text-gray-300 whitespace-nowrap">
-                    {user.email}
-                  </td>
-                  <td className="px-4 py-4 text-sm text-gray-500 dark:text-gray-300 whitespace-nowrap">
-                    {user?.mobile || "Not Provided"}
-                  </td>
-                  <td className="px-4 py-4 text-sm text-gray-500 dark:text-gray-300 whitespace-nowrap">
-                    {user?.address || "Not Provided"}
-                  </td>
-                  <td className="px-4 py-4 text-sm text-gray-500 dark:text-gray-300 whitespace-nowrap">
-                    {user.roleType === "1" ? "Guest" : "Admin"}
-                  </td>
-                </tr>
-              ))}
-            </tbody>
-          </table>
-        </div>
-
-        <div className="flex items-center justify-between mt-6">
-          <button
-            onClick={handlePreviousPage}
-            disabled={currentPage === 1}
-            className="flex items-center px-5 py-2 text-sm text-gray-700 capitalize transition-colors duration-200 bg-white border rounded-md gap-x-2 hover:bg-gray-100 dark:bg-gray-900 dark:text-gray-200 dark:border-gray-700 dark:hover:bg-gray-800"
-          >
-            <svg
-              xmlns="http://www.w3.org/2000/svg"
-              fill="none"
-              viewBox="0 0 24 24"
-              stroke-width="1.5"
-              stroke="currentColor"
-              className="w-5 h-5 rtl:-scale-x-100"
-            >
-              <path
-                stroke-linecap="round"
-                stroke-linejoin="round"
-                d="M6.75 15.75L3 12m0 0l3.75-3.75M3 12h18"
-              />
-            </svg>
-
-            <span>previous</span>
-          </button>
-
-          <div className="items-center hidden lg:flex gap-x-3">
-            {Array.from({ length: totalPages }, (_, index) => (
-              <button
-                key={index + 1}
-                onClick={() => handlePageClick(index + 1)}
-                className={`px-2 py-1 text-sm ${
-                  currentPage === index + 1
-                    ? "text-blue-500 bg-blue-100"
-                    : "text-gray-500 hover:bg-gray-100"
-                } rounded-md`}
-              >
-                {index + 1}
-              </button>
-            ))}
-          </div>
-          <button
-            onClick={handleNextPage}
-            disabled={currentPage === totalPages}
-            className="flex items-center px-5 py-2 text-sm text-gray-700 capitalize transition-colors duration-200 bg-white border rounded-md gap-x-2 hover:bg-gray-100 dark:bg-gray-900 dark:text-gray-200 dark:border-gray-700 dark:hover:bg-gray-800"
-          >
-            <span>Next</span>
-
-            <svg
-              xmlns="http://www.w3.org/2000/svg"
-              fill="none"
-              viewBox="0 0 24 24"
-              stroke-width="1.5"
-              stroke="currentColor"
-              className="w-5 h-5 rtl:-scale-x-100"
-            >
-              <path
-                stroke-linecap="round"
-                stroke-linejoin="round"
-                d="M17.25 8.25L21 12m0 0l-3.75 3.75M21 12H3"
-              />
-            </svg>
-          </button>
-        </div>
-
-        <div className="flex-grow ml-0 mt-4 w-0">
-          {/* <a href="/admin/users/userform">
-            <button
-              type="button"
-              className="flex items-center justify-center px-6 py-2 font-medium tracking-wide text-white capitalize transition-colors duration-300 transform bg-blue-600 rounded-lg hover:bg-blue-500 focus:outline-none focus:ring focus:ring-blue-300 focus:ring-opacity-80"
-            >
-              <FaPlus className="mr-2 font-medium" />
-              User
-            </button>
-          </a> */}
-          <button
-            type="button"
-            onClick={(event) => handleNavigation(event, "users/userform")}
-            className="flex items-center justify-center px-6 py-2 font-medium tracking-wide text-white capitalize transition-colors duration-300 transform bg-blue-600 rounded-lg hover:bg-blue-500 focus:outline-none focus:ring focus:ring-blue-300 focus:ring-opacity-80"
-          >
-            <FaPlus className="mr-2 font-medium" />
-            User
-          </button>
-        </div>
-      </div>
+    <div>
+      Users
+      <button
+        type="button"
+        onClick={(event) => handleNavigation(event, "users/userform")}
+        className="flex items-center justify-center px-6 py-2 font-medium tracking-wide text-white capitalize transition-colors duration-300 transform bg-blue-600 rounded-lg hover:bg-blue-500 focus:outline-none focus:ring focus:ring-blue-300 focus:ring-opacity-80"
+      >
+        User
+      </button>
     </div>
   );
 }