eleven-solutions-common-website-unique-web 20.0.24 → 20.0.26

package/dist/components/admin/Users.js

@@ -33,9 +33,10 @@ const Users = ({ url }) => {
     };
     const [currentPage, setCurrentPage] = useState(1);
     const itemsPerPage = 10;
-    const filteredUsers = users.filter((user) => user.name.toLowerCase().includes(searchTerm.toLowerCase()) ||
-        user.email.toLowerCase().includes(searchTerm.toLowerCase()) ||
-        user.mobile.toString().includes(searchTerm));
+    const filteredUsers = users.filter((user) => searchTerm.length >= 2 &&
+        (user.name.toLowerCase().includes(searchTerm.toLowerCase()) ||
+            user.email.toLowerCase().includes(searchTerm.toLowerCase()) ||
+            user.mobile.toString().includes(searchTerm)));
     const totalPages = Math.ceil(filteredUsers.length / itemsPerPage);
     const handleNextPage = () => {
         if (currentPage < totalPages) {
@@ -50,7 +51,6 @@ const Users = ({ url }) => {
     const handlePageClick = (pageNumber) => {
         setCurrentPage(pageNumber);
     };
-    const paginatedUsers = filteredUsers.slice((currentPage - 1) * itemsPerPage, currentPage * itemsPerPage);
     const handleDeleteClick = (id) => __awaiter(void 0, void 0, void 0, function* () {
         try {
             yield deleteUserApi(url, id);
@@ -74,15 +74,16 @@ const Users = ({ url }) => {
         const query = event.target.value;
         if (query.length >= 2) {
             console.log("Triggering search...");
-            setSearchTerm(query);
             setCurrentPage(1);
         }
+        setSearchTerm(query);
         console.log("Query Length:", query.length);
     };
     const handleSearchSubmit = (event) => {
         event.preventDefault();
-        setCurrentPage(1); // Reset to the first page after a search
+        setCurrentPage(1);
     };
+    const paginatedUsers = filteredUsers.slice((currentPage - 1) * itemsPerPage, currentPage * itemsPerPage);
     return (_jsxs("div", { className: "container px-4 mx-auto mt-6", children: [_jsx("div", { className: "w-3/4", children: _jsx("h1", { className: "text-3xl font-bold text-blue-600 mb-5", children: "Users" }) }), _jsx("div", { className: "flex-grow ml-0 w-full mt-10", children: _jsxs("form", { className: "w-full ", onSubmit: handleSearchSubmit, children: [_jsx("label", { htmlFor: "default-search", className: "mb-2 text-sm font-medium text-gray-900 sr-only dark:text-white", children: "Search" }), _jsxs("div", { className: "relative w-full", children: [_jsx("div", { className: "absolute inset-y-0 start-0 flex items-center ps-3 pointer-events-none", children: _jsx("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", children: _jsx("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" }) }) }), _jsx("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 by Name, Email or Mobile", value: searchTerm, onChange: handleSearchChange, required: true }), _jsx("button", { type: "button", 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", children: "Search" })] })] }) }), _jsx("div", { className: "flex-grow ml-0 w-3/4", children: _jsx("form", { className: "w-auto" }) }), _jsxs("div", { className: "flex-grow ml-0 mt-4 w-full", children: [_jsx("div", { className: "overflow-hidden border border-gray-200 dark:border-gray-700 md:rounded-lg mt-6", children: _jsxs("table", { className: "min-w-full divide-y divide-gray-200 dark:divide-gray-700", children: [_jsx("thead", { className: "bg-gray-50 dark:bg-gray-800", children: _jsxs("tr", { children: [_jsx("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", children: "Edit/Delete" }), _jsx("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", children: _jsx("div", { className: "flex items-center gap-x-3", children: _jsx("span", { children: "Name" }) }) }), _jsx("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", children: _jsx("button", { className: "flex items-center gap-x-2", children: _jsx("span", { children: "Email" }) }) }), _jsx("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", children: _jsx("button", { className: "flex items-center gap-x-2", children: _jsx("span", { children: "Mobile" }) }) }), _jsx("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", children: "Address" }), _jsx("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", children: "Gender" }), _jsx("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", children: "Role Type" })] }) }), _jsx("tbody", { className: "bg-white divide-y divide-gray-200 dark:divide-gray-700 dark:bg-gray-900", children: paginatedUsers.map((user, index) => (_jsxs("tr", { children: [_jsx("td", { className: "px-4 py-4 text-sm whitespace-nowrap", children: _jsxs("div", { className: "flex items-center gap-x-6", children: [_jsx("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", children: _jsx("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", children: _jsx("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" }) }) }), _jsx("button", { onClick: (event) => handleEditClick(event, "/admin/users/userform?id=", user.id), className: "text-gray-500 transition-colors duration-200 dark:hover:text-yellow-500 dark:text-gray-300 hover:text-yellow-500 focus:outline-none", children: _jsx("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", children: _jsx("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" }) }) })] }) }), _jsx("td", { className: "px-4 py-4 text-sm font-medium text-gray-700 whitespace-nowrap", children: _jsx("div", { className: "inline-flex items-center gap-x-3", children: _jsx("div", { className: "flex items-center gap-x-2", children: _jsx("div", { children: _jsx("h2", { className: "  text-sm font-medium text-gray-800 dark:text-white ", children: user.name }) }) }) }) }), _jsx("td", { className: "px-4 py-4 text-sm text-gray-500 dark:text-gray-300 whitespace-nowrap", children: user.email }), _jsx("td", { className: "px-4 py-4 text-sm text-gray-500 dark:text-gray-300 whitespace-nowrap", children: user.mobile }), _jsx("td", { className: "px-4 py-4 text-sm text-gray-500 dark:text-gray-300 whitespace-nowrap", children: user.address }), _jsx("td", { className: "px-4 py-4 text-sm text-gray-500 dark:text-gray-300 whitespace-nowrap", children: user.gender != null
                                                     ? user.gender === 1
                                                         ? "Male"

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "eleven-solutions-common-website-unique-web",
-  "version": "20.0.24",
+  "version": "20.0.26",
   "main": "./dist/index.js",
   "scripts": {
     "build": "tsc",

package/src/components/admin/Users.tsx

@@ -37,9 +37,10 @@ const Users = ({ url }: UsersProps) => {
 
   const filteredUsers = users.filter(
     (user) =>
-      user.name.toLowerCase().includes(searchTerm.toLowerCase()) ||
-      user.email.toLowerCase().includes(searchTerm.toLowerCase()) ||
-      user.mobile.toString().includes(searchTerm)
+      searchTerm.length >= 2 &&
+      (user.name.toLowerCase().includes(searchTerm.toLowerCase()) ||
+        user.email.toLowerCase().includes(searchTerm.toLowerCase()) ||
+        user.mobile.toString().includes(searchTerm))
   );
 
   const totalPages = Math.ceil(filteredUsers.length / itemsPerPage);
@@ -60,11 +61,6 @@ const Users = ({ url }: UsersProps) => {
     setCurrentPage(pageNumber);
   };
 
-  const paginatedUsers = filteredUsers.slice(
-    (currentPage - 1) * itemsPerPage,
-    currentPage * itemsPerPage
-  );
-
   const handleDeleteClick = async (id: string) => {
     try {
       await deleteUserApi(url, id);
@@ -94,17 +90,22 @@ const Users = ({ url }: UsersProps) => {
     const query = event.target.value;
     if (query.length >= 2) {
       console.log("Triggering search...");
-      setSearchTerm(query);
 
       setCurrentPage(1);
     }
+    setSearchTerm(query);
     console.log("Query Length:", query.length);
   };
 
   const handleSearchSubmit = (event: React.FormEvent<HTMLFormElement>) => {
     event.preventDefault();
-    setCurrentPage(1); // Reset to the first page after a search
+    setCurrentPage(1);
   };
+
+  const paginatedUsers = filteredUsers.slice(
+    (currentPage - 1) * itemsPerPage,
+    currentPage * itemsPerPage
+  );
   return (
     <div className="container px-4 mx-auto mt-6">
       <div className="w-3/4">