fix(ExperimentalPages): wait for allowedExperimentalPages before star…

…tPage redirect
ytsaurus · Dec 20, 2024 · 527ad72 · 527ad72
1 parent d5f122a
commit 527ad72
Show file tree

Hide file tree

Showing 6 changed files with 30 additions and 9 deletions.
diff --git a/packages/ui/src/ui/containers/ClusterPage/ClusterPage.js b/packages/ui/src/ui/containers/ClusterPage/ClusterPage.js
@@ -37,7 +37,10 @@ import {setSetting} from '../../store/actions/settings';
 import {unmountCluster, updateCluster} from '../../store/actions/cluster-params';
 import {updateTitle} from '../../store/actions/global';
 import {getClusterUiConfig} from '../../store/selectors/global';
-import {isQueryTrackerAllowed} from '../../store/selectors/global/experimental-pages';
+import {
+    isExperimentalPagesReady,
+    isQueryTrackerAllowed,
+} from '../../store/selectors/global/experimental-pages';
 import {getClusterConfig} from '../../utils';
 import {NAMESPACES, SettingName} from '../../../shared/constants/settings';
 import {getClusterPagePaneSizes, getStartingPage} from '../../store/selectors/settings';
@@ -88,6 +91,7 @@ class ClusterPage extends Component {
 
         allowChyt: PropTypes.bool,
         allowQueryTracker: PropTypes.bool,
+        allowStartPageRedirect: PropTypes.bool,
     };
 
     state = {
@@ -193,6 +197,7 @@ class ClusterPage extends Component {
             paramsError,
             allowChyt,
             allowQueryTracker,
+            allowStartPageRedirect,
         } = this.props;
 
         return isLoaded && !this.isParamsLoading() ? (
@@ -238,7 +243,9 @@ class ClusterPage extends Component {
                         to={`/:cluster/${Page.COMPONENTS}/versions`}
                     />
                     {makeExtraPageRoutes()}
-                    <Redirect from={`/${cluster}/`} to={`/${cluster}/${startingPage}`} />
+                    {allowStartPageRedirect && (
+                        <Redirect from={`/${cluster}/`} to={`/${cluster}/${startingPage}`} />
+                    )}
                 </Switch>
 
                 <Route path="/:cluster/:page/:tab?" component={PageTracker} />
@@ -337,6 +344,7 @@ function mapStateToProps(state) {
         paramsCluster,
         allowQueryTracker: isQueryTrackerAllowed(state),
         allowChyt: Boolean(getClusterUiConfig(state).chyt_controller_base_url),
+        allowStartPageRedirect: isExperimentalPagesReady(state),
     };
 }
 

diff --git a/packages/ui/src/ui/store/actions/global/experimental-pages.ts b/packages/ui/src/ui/store/actions/global/experimental-pages.ts
@@ -2,12 +2,18 @@ import {getCurrentUserName} from '../../../store/selectors/global';
 import {GLOBAL_PARTIAL} from '../../../constants/global';
 import UIFactory from '../../../UIFactory';
 import {YTThunkAction} from '.';
+import {rumLogError} from '../../../rum/rum-counter';
 
 export function loadAllowedExperimentalPages(): YTThunkAction {
     return (dispatch, getState) => {
         const login = getCurrentUserName(getState());
-        return UIFactory.getAllowedExperimentalPages(login).then((allowedExperimentalPages) => {
-            dispatch({type: GLOBAL_PARTIAL, data: {allowedExperimentalPages}});
-        });
+        return UIFactory.getAllowedExperimentalPages(login)
+            .then((allowedExperimentalPages) => {
+                dispatch({type: GLOBAL_PARTIAL, data: {allowedExperimentalPages}});
+            })
+            .catch((error) => {
+                rumLogError({message: 'Failed to get experimental pages'}, error);
+                dispatch({type: GLOBAL_PARTIAL, data: {allowedExperimentalPages: []}});
+            });
     };
 }
diff --git a/packages/ui/src/ui/store/reducers/global/index.js b/packages/ui/src/ui/store/reducers/global/index.js
@@ -80,7 +80,7 @@ const initialState = {
 
     asideHeaderWidth: 56,
 
-    allowedExperimentalPages: [],
+    allowedExperimentalPages: undefined,
 };
 
 function updatedTitle(state, {cluster, page, path, clusters}) {

diff --git a/packages/ui/src/ui/store/reducers/index.main.ts b/packages/ui/src/ui/store/reducers/index.main.ts
@@ -98,7 +98,7 @@ export type RootState = Omit<ReturnType<ReturnType<typeof makeRootReducer>>, 'gl
         cluster?: string;
         rootPagesCluster?: string;
         asideHeaderWidth: number;
-        allowedExperimentalPages: Array<string>;
+        allowedExperimentalPages?: Array<string>;
         ytAuthCluster?: string;
         defaultPoolTree?: string;
     };

diff --git a/packages/ui/src/ui/store/selectors/global/experimental-pages.ts b/packages/ui/src/ui/store/selectors/global/experimental-pages.ts
@@ -11,10 +11,17 @@ export const getAllowedExperimentalPages = (state: RootState) =>
 
 export const isQueryTrackerAllowed = createSelector(
     [isDeveloper, getAllowedExperimentalPages],
-    (isDeveloper, allowedPages) => {
+    (isDeveloper, allowedPages = []) => {
         const expPages = UIFactory.getExperimentalPages();
         return (
             isDeveloper || !expPages.includes(Page.QUERIES) || allowedPages.includes(Page.QUERIES)
         );
     },
 );
+
+export const isExperimentalPagesReady = (state: RootState) => {
+    return (
+        UIFactory.getExperimentalPages().length == 0 ||
+        getAllowedExperimentalPages(state) !== undefined
+    );
+};
diff --git a/packages/ui/src/ui/store/selectors/slideoutMenu.ts b/packages/ui/src/ui/store/selectors/slideoutMenu.ts
@@ -48,7 +48,7 @@ const getRecentPagesInfoRaw = createSelector(
         const expPages = UIFactory.getExperimentalPages();
         const hiddenPages = new Set(
             expPages.filter((expPages) => {
-                return !allowExpPages.includes(expPages);
+                return !allowExpPages?.includes(expPages);
             }),
         );