ydb-embedded-ui 20.2.0 → 20.3.0

package/src/containers/App/App.tsx

@@ -0,0 +1,69 @@
+import React from 'react';
+
+import type {Store} from '@reduxjs/toolkit';
+import type {History} from 'history';
+import {Helmet} from 'react-helmet-async';
+
+import {componentsRegistry} from '../../components/ComponentsProvider/componentsRegistry';
+import {FullscreenProvider} from '../../components/Fullscreen/FullscreenContext';
+import {useTypedSelector} from '../../utils/hooks';
+import type {YDBEmbeddedUISettings} from '../UserSettings/settings';
+
+import {useAppTitle} from './AppTitleContext';
+import ContentWrapper, {Content} from './Content';
+import {NavigationWrapper} from './NavigationWrapper';
+import {Providers} from './Providers';
+
+import './App.scss';
+
+const defaultAppTitle = 'YDB Monitoring';
+
+export interface AppProps {
+    store: Store;
+    history: History;
+    userSettings?: YDBEmbeddedUISettings;
+    children?: React.ReactNode;
+    appTitle?: string;
+}
+
+function App({store, history, children, userSettings, appTitle = defaultAppTitle}: AppProps) {
+    const ChatPanel = componentsRegistry.get('ChatPanel');
+
+    return (
+        <Providers store={store} history={history} appTitle={appTitle}>
+            <AppContent userSettings={userSettings}>{children}</AppContent>
+            {ChatPanel && <ChatPanel />}
+        </Providers>
+    );
+}
+
+function AppContent({
+    userSettings,
+    children,
+}: {
+    userSettings?: YDBEmbeddedUISettings;
+    children?: React.ReactNode;
+}) {
+    const {appTitle} = useAppTitle();
+    const singleClusterMode = useTypedSelector((state) => state.singleClusterMode);
+    const fullscreenRootRef = React.useRef<HTMLDivElement>(null);
+
+    return (
+        <React.Fragment>
+            <Helmet defaultTitle={appTitle} titleTemplate={`%s — ${appTitle}`} />
+            <FullscreenProvider fullscreenRootRef={fullscreenRootRef}>
+                <ContentWrapper>
+                    <NavigationWrapper
+                        singleClusterMode={singleClusterMode}
+                        userSettings={userSettings}
+                    >
+                        <Content singleClusterMode={singleClusterMode}>{children}</Content>
+                        <div ref={fullscreenRootRef}></div>
+                    </NavigationWrapper>
+                </ContentWrapper>
+            </FullscreenProvider>
+        </React.Fragment>
+    );
+}
+
+export default App;

package/src/containers/App/AppTitleContext.tsx

@@ -0,0 +1,24 @@
+import React from 'react';
+
+interface AppTitleContextType {
+    appTitle: string;
+}
+
+const AppTitleContext = React.createContext<AppTitleContextType | undefined>(undefined);
+
+interface AppTitleProviderProps {
+    appTitle: string;
+    children: React.ReactNode;
+}
+
+export function AppTitleProvider({appTitle, children}: AppTitleProviderProps) {
+    return <AppTitleContext.Provider value={{appTitle}}>{children}</AppTitleContext.Provider>;
+}
+
+export function useAppTitle(): AppTitleContextType {
+    const context = React.useContext(AppTitleContext);
+    if (context === undefined) {
+        throw new Error('useAppTitle must be used within an AppTitleProvider');
+    }
+    return context;
+}

package/src/containers/App/Content.tsx

@@ -0,0 +1,313 @@
+import React from 'react';
+
+import {connect} from 'react-redux';
+import type {RedirectProps} from 'react-router-dom';
+import {Redirect, Route, Switch} from 'react-router-dom';
+
+import {Unauthenticated} from '../../components/Errors/401';
+import {AccessDenied} from '../../components/Errors/403';
+import {LoaderWrapper} from '../../components/LoaderWrapper/LoaderWrapper';
+import {useSlots} from '../../components/slots';
+import type {SlotMap} from '../../components/slots/SlotMap';
+import type {SlotComponent} from '../../components/slots/types';
+import routes, {CLUSTER, getClusterPath} from '../../routes';
+import type {RootState} from '../../store';
+import {
+    useAllCapabilitiesLoaded,
+    useCapabilitiesQuery,
+    useClusterWithoutAuthInUI,
+    useMetaCapabilitiesLoaded,
+    useMetaCapabilitiesQuery,
+} from '../../store/reducers/capabilities/hooks';
+import {nodesListApi} from '../../store/reducers/nodesList';
+import {cn} from '../../utils/cn';
+import {useDatabaseFromQuery} from '../../utils/hooks/useDatabaseFromQuery';
+import {useMetaAuthUnavailable} from '../../utils/hooks/useMetaAuth';
+import {lazyComponent} from '../../utils/lazyComponent';
+import {isForbiddenError, isRedirectToAuth, isUnauthenticatedError} from '../../utils/response';
+import Authentication from '../Authentication/Authentication';
+import {GetUser} from '../GetUserWrapper/GetUserWrapper';
+import {Header} from '../Header/Header';
+
+import {
+    ClusterSlot,
+    HomePageSlot,
+    NodeSlot,
+    PDiskPageSlot,
+    RedirectSlot,
+    RoutesSlot,
+    StorageGroupSlot,
+    TabletSlot,
+    TenantSlot,
+    VDiskPageSlot,
+} from './appSlots';
+import {getLegacyClusterTenantsRedirect, getLegacyTenantRedirect} from './legacyRedirects';
+
+import './App.scss';
+
+const b = cn('app');
+
+type RouteSlot = {
+    path: string;
+    slot: SlotComponent<any>;
+    component: React.ComponentType<any>;
+    wrapper?: React.ComponentType<any>;
+    exact?: boolean;
+};
+const routesSlots: RouteSlot[] = [
+    {
+        path: routes.cluster,
+        slot: ClusterSlot,
+        component: lazyComponent(() => import('../Cluster/Cluster'), 'Cluster'),
+        wrapper: DataWrapper,
+    },
+    {
+        path: routes.tenant,
+        slot: TenantSlot,
+        component: lazyComponent(() => import('../Tenant/Tenant'), 'Tenant'),
+        wrapper: DataWrapper,
+    },
+    {
+        path: routes.node,
+        slot: NodeSlot,
+        component: lazyComponent(() => import('../Node/Node'), 'Node'),
+        wrapper: DataWrapper,
+    },
+    {
+        path: routes.pDisk,
+        slot: PDiskPageSlot,
+        component: lazyComponent(() => import('../PDiskPage/PDiskPage'), 'PDiskPage'),
+        wrapper: DataWrapper,
+    },
+    {
+        path: routes.vDisk,
+        slot: VDiskPageSlot,
+        component: lazyComponent(() => import('../VDiskPage/VDiskPage'), 'VDiskPage'),
+        wrapper: DataWrapper,
+    },
+    {
+        path: routes.storageGroup,
+        slot: StorageGroupSlot,
+        component: lazyComponent(
+            () => import('../StorageGroupPage/StorageGroupPage'),
+            'StorageGroupPage',
+        ),
+        wrapper: DataWrapper,
+    },
+    {
+        path: routes.tablet,
+        slot: TabletSlot,
+        component: lazyComponent(() => import('../Tablet'), 'Tablet'),
+        wrapper: DataWrapper,
+    },
+];
+
+const multiClusterRoutes: RouteSlot[] = [
+    {
+        path: routes.homePage,
+        exact: true,
+        component: lazyComponent(() => import('../HomePage/HomePage'), 'HomePage'),
+        slot: HomePageSlot,
+        wrapper: HomePageDataWrapper,
+    },
+];
+
+function renderRouteSlot(slots: SlotMap, route: RouteSlot) {
+    return (
+        <Route
+            key={route.path}
+            path={route.path}
+            exact={route.exact}
+            render={(props) => {
+                const slot = slots.get(route.slot);
+                let content;
+                if (!slot) {
+                    const Component = route.component;
+                    content = <Component {...props} />;
+                } else if (typeof slot.rendered === 'function') {
+                    content = slot.rendered({component: route.component, ...props});
+                } else {
+                    content = slot.rendered;
+                }
+                const Wrapper = route.wrapper ?? React.Fragment;
+                return (
+                    <main className={b('main')}>
+                        <Wrapper>{content}</Wrapper>
+                    </main>
+                );
+            }}
+        />
+    );
+}
+
+interface ContentProps {
+    singleClusterMode: boolean;
+    children: React.ReactNode;
+}
+export function Content(props: ContentProps) {
+    const {singleClusterMode} = props;
+
+    const slots = useSlots(props);
+
+    const additionalRoutes = slots.get(RoutesSlot);
+
+    const redirect = slots.get(RedirectSlot);
+    const redirectProps: RedirectProps =
+        redirect?.props ?? (singleClusterMode ? {to: getClusterPath()} : {to: routes.homePage});
+
+    return (
+        <Switch>
+            {additionalRoutes?.rendered}
+            <Route>
+                <Header />
+                <Switch>
+                    {/* Backwards compatibility: redirect legacy `/cluster/tenants` URL to `/cluster/databases`,
+                        preserving any query params and hash from old bookmarks. Must appear before the
+                        cluster route so it wins the Switch match (otherwise the cluster page's internal
+                        unknown-tab fallback would redirect via `getClusterPath()` and drop search/hash). */}
+                    <Route
+                        path={`/:environment?/${CLUSTER}/tenants`}
+                        exact
+                        render={({location}) => (
+                            <Redirect to={getLegacyClusterTenantsRedirect(location)} />
+                        )}
+                    />
+                    {/* Backwards compatibility: redirect legacy `/tenant` URL to `/database`. */}
+                    <Route
+                        path={routes.legacyTenant}
+                        render={({location}) => <Redirect to={getLegacyTenantRedirect(location)} />}
+                    />
+                    {singleClusterMode
+                        ? null
+                        : multiClusterRoutes.map((route) => {
+                              return renderRouteSlot(slots, route);
+                          })}
+                    {/* Single cluster routes */}
+                    {routesSlots.map((route) => {
+                        return renderRouteSlot(slots, route);
+                    })}
+                    <Route
+                        path={redirectProps.from || redirectProps.path}
+                        exact={redirectProps.exact}
+                        strict={redirectProps.strict}
+                        render={() => <Redirect to={redirectProps.to} push={redirectProps.push} />}
+                    />
+                </Switch>
+            </Route>
+        </Switch>
+    );
+}
+
+function DataWrapper({children}: {children: React.ReactNode}) {
+    return (
+        // capabilities is going to work without authentication, but not all running systems are supporting this yet
+        <GetCapabilities>
+            <GetUser>
+                <GetNodesList />
+                {/* this GetCapabilities will be removed */}
+                <GetCapabilities>{children}</GetCapabilities>
+            </GetUser>
+        </GetCapabilities>
+    );
+}
+
+function HomePageDataWrapper({children}: {children: React.ReactNode}) {
+    // Home page content is wrapped with GetMetaUser inside component
+    return <GetMetaCapabilities>{children}</GetMetaCapabilities>;
+}
+
+function GetNodesList() {
+    const database = useDatabaseFromQuery();
+    nodesListApi.useGetNodesListQuery({database}, undefined);
+    return null;
+}
+
+function GetCapabilities({children}: {children: React.ReactNode}) {
+    const {error} = useCapabilitiesQuery();
+
+    useMetaCapabilitiesQuery();
+    const capabilitiesLoaded = useAllCapabilitiesLoaded();
+
+    //do nothing, authentication is in progress upon redirect
+    if (isRedirectToAuth(error)) {
+        return null;
+    }
+
+    if (isUnauthenticatedError(error)) {
+        return <Unauthenticated />;
+    }
+
+    if (isForbiddenError(error)) {
+        return <AccessDenied />;
+    }
+
+    return (
+        <LoaderWrapper loading={!capabilitiesLoaded} size="l">
+            {children}
+        </LoaderWrapper>
+    );
+}
+
+// Only for Clusters page, there is no need to request cluster capabilities there (GetCapabilities)
+// This wrapper is not used in GetCapabilities so the page does not wait for 2 consecutive capabilities requests
+function GetMetaCapabilities({children}: {children: React.ReactNode}) {
+    useMetaCapabilitiesQuery();
+    // It is always true if there is no meta, since request finishes with an error
+    const metaCapabilitiesLoaded = useMetaCapabilitiesLoaded();
+
+    return (
+        <LoaderWrapper loading={!metaCapabilitiesLoaded} size="l">
+            {children}
+        </LoaderWrapper>
+    );
+}
+
+interface ContentWrapperProps {
+    singleClusterMode: boolean;
+    isAuthenticated: boolean;
+    children: React.ReactNode;
+}
+
+function ContentWrapper(props: ContentWrapperProps) {
+    const {singleClusterMode, isAuthenticated} = props;
+    const authUnavailable = useClusterWithoutAuthInUI();
+
+    const metaAuthUnavailable = useMetaAuthUnavailable();
+
+    const renderNotAuthenticated = () => {
+        if (authUnavailable || metaAuthUnavailable) {
+            return <AccessDenied />;
+        }
+        return (
+            <GetMetaCapabilities>
+                <Authentication />
+            </GetMetaCapabilities>
+        );
+    };
+
+    return (
+        <Switch>
+            {!authUnavailable && !metaAuthUnavailable && (
+                <Route path={routes.auth}>
+                    <GetMetaCapabilities>
+                        <Authentication closable />
+                    </GetMetaCapabilities>
+                </Route>
+            )}
+            <Route>
+                <div className={b({embedded: singleClusterMode})}>
+                    {isAuthenticated ? props.children : renderNotAuthenticated()}
+                </div>
+            </Route>
+        </Switch>
+    );
+}
+
+function mapStateToProps(state: RootState) {
+    return {
+        isAuthenticated: state.authentication.isAuthenticated,
+        singleClusterMode: state.singleClusterMode,
+    };
+}
+
+export default connect(mapStateToProps)(ContentWrapper);

package/src/containers/App/NavigationWrapper.tsx

@@ -0,0 +1,57 @@
+import React from 'react';
+
+import {ErrorBoundary} from '../../components/ErrorBoundary/ErrorBoundary';
+import {
+    useBlobStorageCapacityMetricsAvailable,
+    useDetailedStorageViewAvailable,
+} from '../../store/reducers/capabilities/hooks';
+import {useIsUserAllowedToMakeChanges} from '../../utils/hooks/useIsUserAllowedToMakeChanges';
+import {Navigation} from '../AsideNavigation/Navigation';
+import {
+    applyBlobStorageCapacityMetricsSettingAvailability,
+    applyDetailedStorageViewSettingAvailability,
+    applyStorageExpertModeSettingAvailability,
+    getUserSettings,
+} from '../UserSettings/settings';
+import type {YDBEmbeddedUISettings} from '../UserSettings/settings';
+
+interface NavigationWrapperProps {
+    singleClusterMode: boolean;
+    userSettings?: YDBEmbeddedUISettings;
+    children: React.ReactNode;
+}
+
+export function NavigationWrapper({
+    singleClusterMode,
+    userSettings,
+    children,
+}: NavigationWrapperProps) {
+    const blobMetricsAvailable = useBlobStorageCapacityMetricsAvailable();
+    const detailedStorageViewAvailable = useDetailedStorageViewAvailable();
+    const isUserAllowedToMakeChanges = useIsUserAllowedToMakeChanges();
+
+    let finalUserSettings: YDBEmbeddedUISettings =
+        userSettings ?? getUserSettings({singleClusterMode});
+
+    finalUserSettings = applyDetailedStorageViewSettingAvailability(
+        finalUserSettings,
+        detailedStorageViewAvailable,
+    );
+
+    // Hide the Blob Storage Capacity Metrics experiment if the backend doesn't support it
+    finalUserSettings = applyBlobStorageCapacityMetricsSettingAvailability(
+        finalUserSettings,
+        blobMetricsAvailable,
+    );
+
+    finalUserSettings = applyStorageExpertModeSettingAvailability(
+        finalUserSettings,
+        blobMetricsAvailable && Boolean(isUserAllowedToMakeChanges),
+    );
+
+    return (
+        <Navigation userSettings={finalUserSettings}>
+            <ErrorBoundary>{children}</ErrorBoundary>
+        </Navigation>
+    );
+}

package/src/containers/App/Providers.tsx

@@ -0,0 +1,63 @@
+import React from 'react';
+
+import * as NiceModal from '@ebay/nice-modal-react';
+import {ThemeProvider, ToasterComponent, ToasterProvider} from '@gravity-ui/uikit';
+import type {Store} from '@reduxjs/toolkit';
+import type {History} from 'history';
+import {HelmetProvider} from 'react-helmet-async';
+import {Provider} from 'react-redux';
+import {Router} from 'react-router-dom';
+import {QueryParamProvider} from 'use-query-params';
+import {ReactRouter5Adapter} from 'use-query-params/adapters/react-router-5';
+
+import {ComponentsProvider} from '../../components/ComponentsProvider/ComponentsProvider';
+import {componentsRegistry as defaultComponentsRegistry} from '../../components/ComponentsProvider/componentsRegistry';
+import type {ComponentsRegistry} from '../../components/ComponentsProvider/componentsRegistry';
+import {SETTING_KEYS} from '../../store/reducers/settings/constants';
+import {toaster} from '../../utils/createToast';
+import {useSetting} from '../../utils/hooks';
+
+import {AppTitleProvider} from './AppTitleContext';
+
+interface ProvidersProps {
+    store: Store;
+    history: History;
+    componentsRegistry?: ComponentsRegistry;
+    children: React.ReactNode;
+    appTitle: string;
+}
+
+export function Providers({
+    store,
+    history,
+    componentsRegistry = defaultComponentsRegistry,
+    children,
+    appTitle,
+}: ProvidersProps) {
+    return (
+        <HelmetProvider>
+            <Provider store={store}>
+                <Router history={history}>
+                    <QueryParamProvider adapter={ReactRouter5Adapter}>
+                        <AppTitleProvider appTitle={appTitle}>
+                            <Theme>
+                                <ToasterProvider toaster={toaster}>
+                                    <ComponentsProvider registry={componentsRegistry}>
+                                        <NiceModal.Provider>{children}</NiceModal.Provider>
+                                        <ToasterComponent />
+                                    </ComponentsProvider>
+                                </ToasterProvider>
+                            </Theme>
+                        </AppTitleProvider>
+                    </QueryParamProvider>
+                </Router>
+            </Provider>
+        </HelmetProvider>
+    );
+}
+
+function Theme({children}: {children: React.ReactNode}) {
+    const [theme] = useSetting<string | undefined>(SETTING_KEYS.THEME);
+
+    return <ThemeProvider theme={theme}>{children}</ThemeProvider>;
+}

package/src/containers/App/SettingsBootstrap.tsx

@@ -0,0 +1,70 @@
+import React from 'react';
+
+import {skipToken} from '@reduxjs/toolkit/query';
+
+import {LoaderWrapper} from '../../components/LoaderWrapper/LoaderWrapper';
+import {settingsApi} from '../../store/reducers/settings/api';
+import {DEFAULT_USER_SETTINGS} from '../../store/reducers/settings/constants';
+import {
+    DEFAULT_CLUSTER_TAB_KEY,
+    DEFAULT_IS_QUERY_RESULT_COLLAPSED,
+    DEFAULT_IS_TENANT_COMMON_INFO_COLLAPSED,
+    DEFAULT_IS_TENANT_SUMMARY_COLLAPSED,
+    DEFAULT_SIZE_RESULT_PANE_KEY,
+    DEFAULT_SIZE_TENANT_KEY,
+    DEFAULT_SIZE_TENANT_SUMMARY_KEY,
+} from '../../utils/constants';
+
+const DRAWER_WIDTH_KEY = 'drawer-width';
+
+/**
+ * Preloaded keys for "UI layout" state (pane sizes, collapsed flags, etc.) that are stored in the same
+ * settings backend but are not part of `DEFAULT_USER_SETTINGS`.
+ *
+ * If a new UI layout key should be preloaded to prevent UI "pop-in" in remote-settings mode, add it here.
+ */
+const PRELOADED_UI_LAYOUT_KEYS = [
+    DEFAULT_CLUSTER_TAB_KEY,
+    DEFAULT_SIZE_RESULT_PANE_KEY,
+    DEFAULT_SIZE_TENANT_SUMMARY_KEY,
+    DEFAULT_SIZE_TENANT_KEY,
+    DEFAULT_IS_TENANT_SUMMARY_COLLAPSED,
+    DEFAULT_IS_TENANT_COMMON_INFO_COLLAPSED,
+    DEFAULT_IS_QUERY_RESULT_COLLAPSED,
+    DRAWER_WIDTH_KEY,
+] as const;
+
+interface SettingsBootstrapProps {
+    children: React.ReactNode;
+}
+
+export function SettingsBootstrap({children}: SettingsBootstrapProps) {
+    const remoteAvailable = Boolean(window.api?.metaSettings);
+
+    const settingsKeysToPreload = React.useMemo(() => {
+        const keys = new Set<string>(Object.keys(DEFAULT_USER_SETTINGS));
+
+        PRELOADED_UI_LAYOUT_KEYS.forEach((key) => keys.add(key));
+
+        return Array.from(keys);
+    }, []);
+
+    const params = React.useMemo(() => {
+        if (remoteAvailable) {
+            return {name: settingsKeysToPreload};
+        }
+        return skipToken;
+    }, [remoteAvailable, settingsKeysToPreload]);
+
+    const {isLoading} = settingsApi.useGetSettingsQuery(params);
+
+    if (!remoteAvailable) {
+        return children;
+    }
+
+    return (
+        <LoaderWrapper loading={isLoading} size="l" delay={0}>
+            {children}
+        </LoaderWrapper>
+    );
+}

package/src/containers/App/appSlots.tsx

@@ -0,0 +1,55 @@
+import type {RedirectProps, RouteComponentProps} from 'react-router-dom';
+
+import {createSlot} from '../../components/slots';
+import type {Cluster} from '../Cluster/Cluster';
+import type {HomePage} from '../HomePage/HomePage';
+import type {Node} from '../Node/Node';
+import type {PDiskPage} from '../PDiskPage/PDiskPage';
+import type {StorageGroupPage} from '../StorageGroupPage/StorageGroupPage';
+import type {Tablet} from '../Tablet';
+import type {Tenant} from '../Tenant/Tenant';
+import type {VDiskPage} from '../VDiskPage/VDiskPage';
+
+export const HomePageSlot = createSlot<{
+    children:
+        | React.ReactNode
+        | ((props: {component: typeof HomePage} & RouteComponentProps) => React.ReactNode);
+}>('homePage');
+export const ClusterSlot = createSlot<{
+    children:
+        | React.ReactNode
+        | ((props: {component: typeof Cluster} & RouteComponentProps) => React.ReactNode);
+}>('cluster');
+export const TenantSlot = createSlot<{
+    children:
+        | React.ReactNode
+        | ((props: {component: typeof Tenant} & RouteComponentProps) => React.ReactNode);
+}>('tenant');
+export const NodeSlot = createSlot<{
+    children:
+        | React.ReactNode
+        | ((props: {component: typeof Node} & RouteComponentProps) => React.ReactNode);
+}>('node');
+export const PDiskPageSlot = createSlot<{
+    children:
+        | React.ReactNode
+        | ((props: {component: typeof PDiskPage} & RouteComponentProps) => React.ReactNode);
+}>('pDisk');
+export const VDiskPageSlot = createSlot<{
+    children:
+        | React.ReactNode
+        | ((props: {component: typeof VDiskPage} & RouteComponentProps) => React.ReactNode);
+}>('vDisk');
+export const StorageGroupSlot = createSlot<{
+    children:
+        | React.ReactNode
+        | ((props: {component: typeof StorageGroupPage} & RouteComponentProps) => React.ReactNode);
+}>('storageGroup');
+export const TabletSlot = createSlot<{
+    children:
+        | React.ReactNode
+        | ((props: {component: typeof Tablet} & RouteComponentProps) => React.ReactNode);
+}>('tablet');
+
+export const RoutesSlot = createSlot<{children: React.ReactNode}>('routes');
+export const RedirectSlot = createSlot<RedirectProps>('redirect');

package/src/containers/App/index.ts

@@ -0,0 +1,3 @@
+export {default as App} from './App';
+
+export * as AppSlots from './appSlots';

package/src/containers/App/legacyRedirects.ts

@@ -0,0 +1,25 @@
+import type {Location} from 'history';
+
+type LegacyRedirectLocation = Pick<Location, 'pathname' | 'search' | 'hash'>;
+
+function makeRedirectLocation(location: LegacyRedirectLocation, pathname: string) {
+    return {
+        pathname,
+        search: location.search,
+        hash: location.hash,
+    };
+}
+
+export function getLegacyClusterTenantsRedirect(location: LegacyRedirectLocation) {
+    return makeRedirectLocation(
+        location,
+        location.pathname.replace(/\/cluster\/tenants(\/|$)/, '/cluster/databases$1'),
+    );
+}
+
+export function getLegacyTenantRedirect(location: LegacyRedirectLocation) {
+    return makeRedirectLocation(
+        location,
+        location.pathname.replace(/\/tenant(\/|$)/, '/database$1'),
+    );
+}