fix: Preserve Page number in URL at AuditLogs page (#4913)

Flagsmith · Dec 11, 2024 · 6cd6cb8 · 6cd6cb8
1 parent 3434eb7
commit 6cd6cb8
Show file tree

Hide file tree

Showing 2 changed files with 23 additions and 2 deletions.
diff --git a/frontend/web/components/AuditLog.tsx b/frontend/web/components/AuditLog.tsx
@@ -21,6 +21,7 @@ type AuditLogType = {
   projectId: string
   pageSize: number
   onSearchChange?: (search: string) => void
+  onPageChange?: (page: number) => void
   searchPanel?: ReactNode
   onErrorChange?: (err: boolean) => void
   match: {
@@ -33,11 +34,15 @@ type AuditLogType = {
 
 const widths = [210, 310, 150]
 const AuditLog: FC<AuditLogType> = (props) => {
-  const [page, setPage] = useState(1)
+  const [page, setPage] = useState(Utils.fromParam().page ?? 1)
   const { search, searchInput, setSearchInput } = useSearchThrottle(
     Utils.fromParam().search,
     () => {
-      setPage(1)
+      if (searchInput !== search) {
+        return setPage(1)
+      }
+
+      setPage(Utils.fromParam().page)
     },
   )
   const { data: subscriptionMeta } = useGetSubscriptionMetadataQuery({
@@ -58,6 +63,11 @@ const AuditLog: FC<AuditLogType> = (props) => {
     //eslint-disable-next-line
   }, [search])
 
+  useEffect(() => {
+    props.onPageChange?.(page)
+    //eslint-disable-next-line
+  }, [page])
+
   const hasHadResults = useRef(false)
 
   const {

diff --git a/frontend/web/components/pages/AuditLogPage.tsx b/frontend/web/components/pages/AuditLogPage.tsx
@@ -29,6 +29,7 @@ const AuditLogPage: FC<AuditLogType> = (props) => {
       props.router.history.replace(
         `${document.location.pathname}?${Utils.toParam({
           env: environment,
+          page: currentParams.page,
           search: currentParams.search,
         })}`,
       )
@@ -52,10 +53,20 @@ const AuditLogPage: FC<AuditLogType> = (props) => {
                       props.router.history.replace(
                         `${document.location.pathname}?${Utils.toParam({
                           env: environment,
+                          page: Utils.fromParam().page,
                           search,
                         })}`,
                       )
                     }}
+                    onPageChange={(page: number) => {
+                      props.router.history.replace(
+                        `${document.location.pathname}?${Utils.toParam({
+                          env: environment,
+                          page,
+                          search: Utils.fromParam().search,
+                        })}`,
+                      )
+                    }}
                     pageSize={10}
                     environmentId={environment}
                     projectId={projectId}