This is an automated email from the ASF dual-hosted git repository.

dineshkumar pushed a commit to branch master
in repository https://gitbox.apache.org/repos/asf/ranger.git


The following commit(s) were added to refs/heads/master by this push:
     new ad762546b RANGER-4297: Scroll to newly added row functionality in 
listing tables is not working
ad762546b is described below

commit ad762546b193ff7303788ad6910dbc22ae21e31d
Author: Brijesh Bhalala <brijeshbhalala2...@gmail.com>
AuthorDate: Mon Jul 10 16:31:10 2023 +0530

    RANGER-4297: Scroll to newly added row functionality in listing tables is 
not working
    
    Signed-off-by: Dineshkumar Yadav <dineshkumar.ya...@outlook.com>
---
 .../react-webapp/src/components/CommonComponents.jsx      |  9 ++++++---
 .../src/views/PolicyListing/PolicyListing.jsx             | 15 ++++++---------
 .../UserGroupRoleListing/groups_details/GroupListing.jsx  | 15 ++++++---------
 .../UserGroupRoleListing/role_details/RoleListing.jsx     | 12 +++++++-----
 .../UserGroupRoleListing/users_details/UserListing.jsx    | 15 ++++++---------
 5 files changed, 31 insertions(+), 35 deletions(-)

diff --git 
a/security-admin/src/main/webapp/react-webapp/src/components/CommonComponents.jsx
 
b/security-admin/src/main/webapp/react-webapp/src/components/CommonComponents.jsx
index c2aa0a018..1fca37866 100644
--- 
a/security-admin/src/main/webapp/react-webapp/src/components/CommonComponents.jsx
+++ 
b/security-admin/src/main/webapp/react-webapp/src/components/CommonComponents.jsx
@@ -17,7 +17,7 @@
  * under the License.
  */
 
-import { isEmpty, isObject } from "lodash";
+import { isEmpty, isObject, lastIndexOf } from "lodash";
 import moment from "moment-timezone";
 import React, { Component, useEffect, useMemo, useState } from "react";
 import {
@@ -505,10 +505,13 @@ export const selectCustomStyles = {
   }
 };
 
-export const scrollToNewData = (usrData, resultSize) => {
+export const scrollToNewData = (usrData) => {
   let newRowAdded;
-  newRowAdded = document.getElementById(usrData[resultSize - 1].id);
+  let lastIndex = lastIndexOf(usrData);
+  newRowAdded = document.getElementById(usrData?.[lastIndex - 1]?.id);
+
   if (newRowAdded) {
+    localStorage.removeItem("newDataAdded");
     newRowAdded.scrollIntoView({
       behavior: "smooth",
       block: "center",
diff --git 
a/security-admin/src/main/webapp/react-webapp/src/views/PolicyListing/PolicyListing.jsx
 
b/security-admin/src/main/webapp/react-webapp/src/views/PolicyListing/PolicyListing.jsx
index efe0435b6..6d6facb91 100644
--- 
a/security-admin/src/main/webapp/react-webapp/src/views/PolicyListing/PolicyListing.jsx
+++ 
b/security-admin/src/main/webapp/react-webapp/src/views/PolicyListing/PolicyListing.jsx
@@ -155,7 +155,11 @@ function PolicyListing(props) {
     setPageLoader(false);
     localStorage.setItem("newDataAdded", state && state.showLastPage);
   }, [searchParams]);
-
+  useEffect(() => {
+    if (localStorage.getItem("newDataAdded") == "true") {
+      scrollToNewData(policyListingData);
+    }
+  }, [totalCount]);
   const getTableSortBy = (sortArr = []) => {
     return sortArr
       .map(({ id }) => {
@@ -223,14 +227,7 @@ function PolicyListing(props) {
         setCurrentPageSize(pageSize);
         setResetpage({ page: gotoPage });
         setLoader(false);
-        if (
-          page == totalPageCount - 1 &&
-          localStorage.getItem("newDataAdded") == "true"
-        ) {
-          scrollToNewData(policyData, policyResp.data.resultSize);
-        }
       }
-      localStorage.removeItem("newDataAdded");
     },
     [updateTable, searchFilterParams, serviceData]
   );
@@ -299,7 +296,7 @@ function PolicyListing(props) {
       toast.error(errorMsg);
       console.error("Error occurred during deleting policy : " + error);
     }
-    if (policyListingData.length == 1 && currentpageIndex > 1) {
+    if (policyListingData.length == 1 && currentpageIndex > 0) {
       let page = currentpageIndex - currentpageIndex;
       if (typeof resetPage?.page === "function") {
         resetPage.page(page);
diff --git 
a/security-admin/src/main/webapp/react-webapp/src/views/UserGroupRoleListing/groups_details/GroupListing.jsx
 
b/security-admin/src/main/webapp/react-webapp/src/views/UserGroupRoleListing/groups_details/GroupListing.jsx
index f705ee8ce..991e27ea9 100644
--- 
a/security-admin/src/main/webapp/react-webapp/src/views/UserGroupRoleListing/groups_details/GroupListing.jsx
+++ 
b/security-admin/src/main/webapp/react-webapp/src/views/UserGroupRoleListing/groups_details/GroupListing.jsx
@@ -139,7 +139,11 @@ function Groups() {
     setPageLoader(false);
     localStorage.setItem("newDataAdded", state && state.showLastPage);
   }, [searchParams]);
-
+  useEffect(() => {
+    if (localStorage.getItem("newDataAdded") == "true") {
+      scrollToNewData(groupListingData);
+    }
+  }, [totalCount]);
   const fetchGroupInfo = useCallback(
     async ({ pageSize, pageIndex, gotoPage }) => {
       setLoader(true);
@@ -187,14 +191,7 @@ function Groups() {
         setCurrentPageSize(pageSize);
         setResetPage({ page: gotoPage });
         setLoader(false);
-        if (
-          page == totalPageCount - 1 &&
-          localStorage.getItem("newDataAdded") == "true"
-        ) {
-          scrollToNewData(groupData, groupResp.data.resultSize);
-        }
       }
-      localStorage.removeItem("newDataAdded");
     },
     [updateTable, searchFilterParams]
   );
@@ -252,7 +249,7 @@ function Groups() {
         if (
           (groupListingData.length == 1 ||
             groupListingData.length == selectedRows.current.length) &&
-          currentpageIndex > 1
+          currentpageIndex > 0
         ) {
           if (typeof resetPage?.page === "function") {
             resetPage.page(0);
diff --git 
a/security-admin/src/main/webapp/react-webapp/src/views/UserGroupRoleListing/role_details/RoleListing.jsx
 
b/security-admin/src/main/webapp/react-webapp/src/views/UserGroupRoleListing/role_details/RoleListing.jsx
index a6ee46413..e6293877c 100644
--- 
a/security-admin/src/main/webapp/react-webapp/src/views/UserGroupRoleListing/role_details/RoleListing.jsx
+++ 
b/security-admin/src/main/webapp/react-webapp/src/views/UserGroupRoleListing/role_details/RoleListing.jsx
@@ -121,6 +121,12 @@ function Roles() {
     localStorage.setItem("newDataAdded", state && state.showLastPage);
   }, [searchParams]);
 
+  useEffect(() => {
+    if (localStorage.getItem("newDataAdded") == "true") {
+      scrollToNewData(roleListingData);
+    }
+  }, [totalCount]);
+
   const fetchRoleInfo = useCallback(
     async ({ pageSize, pageIndex, gotoPage }) => {
       setLoader(true);
@@ -168,11 +174,7 @@ function Roles() {
         setCurrentPageSize(pageSize);
         setResetPage({ page: gotoPage });
         setLoader(false);
-        if (localStorage.getItem("newDataAdded") == "true") {
-          scrollToNewData(roleData, roleResp.data.resultSize);
-        }
       }
-      localStorage.removeItem("newDataAdded");
     },
     [updateTable, searchFilterParams]
   );
@@ -224,7 +226,7 @@ function Roles() {
         if (
           (roleListingData.length == 1 ||
             roleListingData.length == selectedRows.current.length) &&
-          currentpageIndex > 1
+          currentpageIndex > 0
         ) {
           if (typeof resetPage?.page === "function") {
             resetPage.page(0);
diff --git 
a/security-admin/src/main/webapp/react-webapp/src/views/UserGroupRoleListing/users_details/UserListing.jsx
 
b/security-admin/src/main/webapp/react-webapp/src/views/UserGroupRoleListing/users_details/UserListing.jsx
index 625e5d1c1..95a21664d 100644
--- 
a/security-admin/src/main/webapp/react-webapp/src/views/UserGroupRoleListing/users_details/UserListing.jsx
+++ 
b/security-admin/src/main/webapp/react-webapp/src/views/UserGroupRoleListing/users_details/UserListing.jsx
@@ -140,7 +140,11 @@ function Users() {
     setPageLoader(false);
     localStorage.setItem("newDataAdded", state && state.showLastPage);
   }, [searchParams]);
-
+  useEffect(() => {
+    if (localStorage.getItem("newDataAdded") == "true") {
+      scrollToNewData(userListingData);
+    }
+  }, [totalCount]);
   const fetchUserInfo = useCallback(
     async ({ pageSize, pageIndex, gotoPage }) => {
       setLoader(true);
@@ -199,14 +203,7 @@ function Users() {
         setCurrentPageSize(pageSize);
         setResetPage({ page: gotoPage });
         setLoader(false);
-        if (
-          page == totalPageCount - 1 &&
-          localStorage.getItem("newDataAdded") == "true"
-        ) {
-          scrollToNewData(userData, userResp.data.resultSize);
-        }
       }
-      localStorage.removeItem("newDataAdded");
     },
     [updateTable, searchFilterParams]
   );
@@ -300,7 +297,7 @@ function Users() {
         if (
           (userListingData.length == 1 ||
             userListingData.length == selectedRows.current.length) &&
-          currentpageIndex > 1
+          currentpageIndex > 0
         ) {
           if (typeof resetPage?.page === "function") {
             resetPage.page(0);

Reply via email to