[ui] Hide Overview tabs for nav flag

dagster-io · Apr 24, 2024 · 4bd5409 · 4bd5409
1 parent 7e0f50d
commit 4bd5409
Show file tree

Hide file tree

Showing 2 changed files with 55 additions and 24 deletions.
diff --git a/js_modules/dagster-ui/packages/ui-core/src/overview/OverviewRoot.tsx b/js_modules/dagster-ui/packages/ui-core/src/overview/OverviewRoot.tsx
@@ -5,34 +5,57 @@ import {OverviewJobsRoot} from './OverviewJobsRoot';
 import {OverviewResourcesRoot} from './OverviewResourcesRoot';
 import {OverviewSchedulesRoot} from './OverviewSchedulesRoot';
 import {OverviewSensorsRoot} from './OverviewSensorsRoot';
+import {useFeatureFlags} from '../app/Flags';
 import {AutomaterializationRoot} from '../assets/auto-materialization/AutomaterializationRoot';
 import {InstanceBackfillsRoot} from '../instance/InstanceBackfillsRoot';
 import {BackfillPage} from '../instance/backfill/BackfillPage';
 
 export const OverviewRoot = () => {
+  const {flagSettingsPage} = useFeatureFlags();
   return (
     <Switch>
       <Route path="/overview/activity">
         <OverviewActivityRoot />
       </Route>
-      <Route path="/overview/jobs">
-        <OverviewJobsRoot />
-      </Route>
-      <Route path="/overview/schedules">
-        <OverviewSchedulesRoot />
-      </Route>
-      <Route path="/overview/sensors">
-        <OverviewSensorsRoot />
-      </Route>
-      <Route path="/overview/automation">
-        <AutomaterializationRoot />
-      </Route>
-      <Route path="/overview/backfills/:backfillId">
-        <BackfillPage />
-      </Route>
-      <Route path="/overview/backfills" exact>
-        <InstanceBackfillsRoot />
-      </Route>
+      <Route
+        path="/overview/jobs"
+        render={() => (flagSettingsPage ? <Redirect to="/jobs" /> : <OverviewJobsRoot />)}
+      />
+      <Route
+        path="/overview/schedules"
+        render={() =>
+          flagSettingsPage ? <Redirect to="/automation/schedules" /> : <OverviewSchedulesRoot />
+        }
+      />
+      <Route
+        path="/overview/sensors"
+        render={() =>
+          flagSettingsPage ? <Redirect to="/automation/sensors" /> : <OverviewSensorsRoot />
+        }
+      />
+      <Route
+        path="/overview/automation"
+        render={() =>
+          flagSettingsPage ? <Redirect to="/automation" /> : <AutomaterializationRoot />
+        }
+      />
+      <Route
+        path="/overview/backfills/:backfillId"
+        render={({match}) =>
+          flagSettingsPage ? (
+            <Redirect to={`/automation/backfills/${match.params.backfillId}`} />
+          ) : (
+            <BackfillPage />
+          )
+        }
+      />
+      <Route
+        path="/overview/backfills"
+        exact
+        render={() =>
+          flagSettingsPage ? <Redirect to="/automation/backfills" /> : <InstanceBackfillsRoot />
+        }
+      />
       <Route path="/overview/resources">
         <OverviewResourcesRoot />
       </Route>

diff --git a/js_modules/dagster-ui/packages/ui-core/src/overview/OverviewTabs.tsx b/js_modules/dagster-ui/packages/ui-core/src/overview/OverviewTabs.tsx
@@ -2,6 +2,7 @@ import {QueryResult} from '@apollo/client';
 import {Box, Colors, Spinner, Tabs} from '@dagster-io/ui-components';
 import {useContext} from 'react';
 
+import {useFeatureFlags} from '../app/Flags';
 import {QueryRefreshCountdown, RefreshState} from '../app/QueryRefresh';
 import {AssetFeatureContext} from '../assets/AssetFeatureContext';
 import {useAutoMaterializeSensorFlag} from '../assets/AutoMaterializeSensorFlag';
@@ -17,6 +18,8 @@ interface Props<TData> {
 export const OverviewTabs = <TData extends Record<string, any>>(props: Props<TData>) => {
   const {refreshState, tab} = props;
 
+  const {flagSettingsPage} = useFeatureFlags();
+
   const automaterialize = useAutomaterializeDaemonStatus();
   const automaterializeSensorsFlagState = useAutoMaterializeSensorFlag();
   const {enableAssetHealthOverviewPreview} = useContext(AssetFeatureContext);
@@ -26,12 +29,15 @@ export const OverviewTabs = <TData extends Record<string, any>>(props: Props<TDa
       <Tabs selectedTabId={tab}>
         <TabLink id="activity" title="Timeline" to="/overview/activity" />
         {enableAssetHealthOverviewPreview && (
-          <TabLink id="asset-health" title="Asset Health" to="/overview/asset-health" />
+          <TabLink id="asset-health" title="Asset health" to="/overview/asset-health" />
+        )}
+        {/* These are flagged individually because the links must be children of `Tabs`: */}
+        {flagSettingsPage ? null : <TabLink id="jobs" title="Jobs" to="/overview/jobs" />}
+        {flagSettingsPage ? null : (
+          <TabLink id="schedules" title="Schedules" to="/overview/schedules" />
         )}
-        <TabLink id="jobs" title="Jobs" to="/overview/jobs" />
-        <TabLink id="schedules" title="Schedules" to="/overview/schedules" />
-        <TabLink id="sensors" title="Sensors" to="/overview/sensors" />
-        {automaterializeSensorsFlagState === 'has-global-amp' ? (
+        {flagSettingsPage ? null : <TabLink id="sensors" title="Sensors" to="/overview/sensors" />}
+        {!flagSettingsPage && automaterializeSensorsFlagState === 'has-global-amp' ? (
           <TabLink
             id="amp"
             title={
@@ -58,7 +64,9 @@ export const OverviewTabs = <TData extends Record<string, any>>(props: Props<TDa
           />
         ) : null}
         <TabLink id="resources" title="Resources" to="/overview/resources" />
-        <TabLink id="backfills" title="Backfills" to="/overview/backfills" />
+        {flagSettingsPage ? null : (
+          <TabLink id="backfills" title="Backfills" to="/overview/backfills" />
+        )}
       </Tabs>
       {refreshState ? (
         <Box padding={{bottom: 8}}>