fix(useTenantNavigation): prevent possible collisions (#3238)

Author: Raubzeug

src/containers/Tenant/Diagnostics/DiagnosticsPages.ts

@@ -1,9 +1,9 @@
 import React from 'react';
 
 import type {LabelProps} from '@gravity-ui/uikit';
-import {StringParam, useQueryParams} from 'use-query-params';
+import {useLocation} from 'react-router-dom';
 
-import {getTenantPath} from '../../../routes';
+import {getTenantPath, parseQuery} from '../../../routes';
 import {TENANT_DIAGNOSTICS_TABS_IDS} from '../../../store/reducers/tenant/constants';
 import type {TenantDiagnosticsTab} from '../../../store/reducers/tenant/types';
 import {EPathSubType, EPathType} from '../../../types/api/schema';
@@ -265,12 +265,8 @@ export const getPagesByType = (
 };
 
 export const useDiagnosticsPageLinkGetter = () => {
-    const [queryParams] = useQueryParams({
-        database: StringParam,
-        schema: StringParam,
-        backend: StringParam,
-        clusterName: StringParam,
-    });
+    const location = useLocation();
+    const queryParams = parseQuery(location);
 
     const getLink = React.useCallback(
         (tab: string, params?: TenantQuery) => {

src/containers/Tenant/TenantNavigation/useTenantNavigation.tsx

@@ -69,8 +69,9 @@ export function useTenantPage() {
     const handleTenantPageChange = React.useCallback(
         (value?: TenantPage) => {
             setQueryParams({tenantPage: value});
+            setInitialTenantPage(value);
         },
-        [setQueryParams],
+        [setQueryParams, setInitialTenantPage],
     );
 
     const parsedInitialPage = React.useMemo(
@@ -88,19 +89,12 @@ export function useTenantPage() {
 
     React.useEffect(() => {
         try {
-            // Check whether query has valid tenantPage param
-            const parsedQueryPage = tenantPageSchema.parse(tenantPageFromQuery);
-
-            // Save query page as initial if they differ
-            if (parsedQueryPage !== parsedInitialPage) {
-                setInitialTenantPage(parsedQueryPage);
-            }
+            tenantPageSchema.parse(tenantPageFromQuery);
         } catch {
-            // If query page is not valid, set saved page to query
-            // `replaceIn` to not create new history entry when applying previously saved tab
+            // Invalid value in URL - replace with valid fallback
             setQueryParams({tenantPage: parsedInitialPage}, 'replaceIn');
         }
-    }, [tenantPageFromQuery, parsedInitialPage, setQueryParams, setInitialTenantPage]);
+    }, [parsedInitialPage, setQueryParams, tenantPageFromQuery]);
 
     return {tenantPage, handleTenantPageChange} as const;
 }