bugfix/fwf-4155:Fixed page limit issue in users

AOT-Technologies · Jan 7, 2025 · c91c75b · c91c75b
1 parent a92f553
commit c91c75b
Show file tree

Hide file tree

Showing 4 changed files with 15 additions and 6 deletions.
diff --git a/forms-flow-admin/src/components/roles/roles.tsx b/forms-flow-admin/src/components/roles/roles.tsx
@@ -272,6 +272,7 @@ const Roles = React.memo((props: any) => {
       rowData.name,
       null,
       null,
+      null,
       (results) => {
         setUsers(results.data);
         setLoading(false);

diff --git a/forms-flow-admin/src/components/users/index.tsx b/forms-flow-admin/src/components/users/index.tsx
@@ -21,14 +21,16 @@ const UserManagement = React.memo((props: any) => {
   const [filter, setFilter] = React.useState(undefined);
   const [total, setTotal] = React.useState(undefined);
   const { t } = useTranslation();
-
+  const [sizePerPage, setSizePerPage] = React.useState(5);
+
   React.useEffect(() => {
     if (filter === undefined) return;
     setLoading(true);
     fetchUsers(
       filter,
       1,
       search,
+      sizePerPage,
       (results) => {
         setUsers(removeTenantIdFromUserRoles(results.data));
         setInvalidated(false);
@@ -54,6 +56,7 @@ const UserManagement = React.memo((props: any) => {
         filter,
         1,
         search,
+        sizePerPage,
         (results) => {
           setUsers(removeTenantIdFromUserRoles(results.data));
           setInvalidated(false);
@@ -80,6 +83,7 @@ const UserManagement = React.memo((props: any) => {
         filter,
         pageNo,
         search,
+        sizePerPage,
         (results) => {
           setUsers(removeTenantIdFromUserRoles(results.data));
           setTotal(results.count);
@@ -103,6 +107,7 @@ const UserManagement = React.memo((props: any) => {
       null,
       pageNo,
       null,
+      sizePerPage,
       (results) => {
 
         setUsers(removeTenantIdFromUserRoles(results.data));
@@ -122,7 +127,7 @@ const UserManagement = React.memo((props: any) => {
       setError(err);
       toast.error(t("Failed to fetch roles!"))
     });
-  }, []);
+  }, [sizePerPage]);
 
   const removeTenantIdFromUserRoles = (data)=>{
     let updatedUserData = []
@@ -151,6 +156,7 @@ const UserManagement = React.memo((props: any) => {
         setFilter={setFilter}
         total={total}
         error={error}
+        limit = {{sizePerPage , setSizePerPage}}
       />
     </>
   );

diff --git a/forms-flow-admin/src/components/users/users.tsx b/forms-flow-admin/src/components/users/users.tsx
@@ -26,7 +26,6 @@ const Users = React.memo((props: any) => {
   const [error, setError] = React.useState(null); // Initialize error state with null instead of undefined
   const [loading, setLoading] = React.useState(false);
   const [activePage, setActivePage] = React.useState(1);
-  const [sizePerPage, setSizePerPage] = React.useState(5);
   const [selectedFilter, setSelectedFilter] = React.useState(null); // Initialize selectedFilter with null
   const [searchKey, setSearchKey] = React.useState("");
   const [showInviteModal, setShowInviteModal] = React.useState(false); // Add state for managing invite modal
@@ -113,7 +112,8 @@ const Users = React.memo((props: any) => {
   };
 
   const handleLimitChange = (newLimit: number) => {
-    setSizePerPage(newLimit);
+    props.limit?.setSizePerPage(newLimit);
+    props.page.setPageNo(1);
     setActivePage(1); 
   };
 
@@ -524,7 +524,7 @@ const Users = React.memo((props: any) => {
           <table className="table mt-3">
             <tfoot>
               <TableFooter
-                  limit={sizePerPage}
+                  limit={props?.limit?.sizePerPage}
                   activePage={activePage} 
                   totalCount={props.total}
                   handlePageChange={handlePageChange}

diff --git a/forms-flow-admin/src/services/users/index.ts b/forms-flow-admin/src/services/users/index.ts
@@ -6,14 +6,16 @@ export const fetchUsers = (
   group: string | null,
   pageNo: number | null,
   search: string | null,
+  sizePerPage : number | null ,
   callback: any,
   errorHandler: any,
   role = true,
   count = true
 ) => {
   let url = `${API.GET_USERS}?role=${role}&count=${count}`;
   if (group) url += `&memberOfGroup=${group}`;
-  if (pageNo) url += `&pageNo=${pageNo}&limit=5`;
+  if (pageNo) url += `&pageNo=${pageNo}`;
+  if(sizePerPage) url += `&limit=${sizePerPage}`;
   if (search) url += `&search=${search}`;
 
   RequestService.httpGETRequest(url)