feat: use features versions from backend (#1097)

artemmufazalov · web-flow · commit 3f041de928f4 · 2024-08-01T16:30:59.000+03:00
diff --git a/src/components/PDiskInfo/PDiskInfo.tsx b/src/components/PDiskInfo/PDiskInfo.tsx
@@ -1,4 +1,5 @@
 import {getPDiskPagePath} from '../../routes';
+import {useDiskPagesAvailable} from '../../store/reducers/capabilities/hooks';
 import {valueIsDefined} from '../../utils';
 import {formatBytes} from '../../utils/bytesParsers';
 import {cn} from '../../utils/cn';
@@ -21,15 +22,15 @@ const b = cn('ydb-pdisk-info');
 interface GetPDiskInfoOptions<T extends PreparedPDisk> {
     pDisk?: T;
     nodeId?: number | string | null;
-    isPDiskPage?: boolean;
+    withPDiskPageLink?: boolean;
     isUserAllowedToMakeChanges?: boolean;
 }
 
 // eslint-disable-next-line complexity
 function getPDiskInfo<T extends PreparedPDisk>({
     pDisk,
     nodeId,
-    isPDiskPage = false,
+    withPDiskPageLink,
     isUserAllowedToMakeChanges,
 }: GetPDiskInfoOptions<T>) {
     const {
@@ -147,7 +148,7 @@ function getPDiskInfo<T extends PreparedPDisk>({
     const additionalInfo: InfoViewerItem[] = [];
 
     const shouldDisplayLinks =
-        (!isPDiskPage || isUserAllowedToMakeChanges) &&
+        (withPDiskPageLink || isUserAllowedToMakeChanges) &&
         valueIsDefined(PDiskId) &&
         valueIsDefined(nodeId);
 
@@ -162,7 +163,7 @@ function getPDiskInfo<T extends PreparedPDisk>({
             label: pDiskInfoKeyset('links'),
             value: (
                 <span className={b('links')}>
-                    {!isPDiskPage && (
+                    {withPDiskPageLink && (
                         <LinkWithIcon
                             title={pDiskInfoKeyset('pdisk-page')}
                             url={pDiskPagePath}
@@ -190,15 +191,16 @@ interface PDiskInfoProps<T extends PreparedPDisk> extends GetPDiskInfoOptions<T>
 export function PDiskInfo<T extends PreparedPDisk>({
     pDisk,
     nodeId,
-    isPDiskPage = false,
+    withPDiskPageLink,
     className,
 }: PDiskInfoProps<T>) {
     const {isUserAllowedToMakeChanges} = useTypedSelector((state) => state.authentication);
+    const diskPagesAvailable = useDiskPagesAvailable();
 
     const [generalInfo, statusInfo, spaceInfo, additionalInfo] = getPDiskInfo({
         pDisk,
         nodeId,
-        isPDiskPage,
+        withPDiskPageLink: withPDiskPageLink && diskPagesAvailable,
         isUserAllowedToMakeChanges,
     });
 
diff --git a/src/components/VDisk/VDisk.tsx b/src/components/VDisk/VDisk.tsx
@@ -2,14 +2,13 @@ import React from 'react';
 
 import {STRUCTURE} from '../../containers/Node/NodePages';
 import routes, {createHref, getVDiskPagePath} from '../../routes';
+import {useDiskPagesAvailable} from '../../store/reducers/capabilities/hooks';
 import type {NodesMap} from '../../types/store/nodesList';
 import {valueIsDefined} from '../../utils';
 import {cn} from '../../utils/cn';
-import {USE_SEPARATE_DISKS_PAGES_KEY} from '../../utils/constants';
 import {stringifyVdiskId} from '../../utils/dataFormatters/dataFormatters';
 import {isFullVDiskData} from '../../utils/disks/helpers';
 import type {PreparedVDisk} from '../../utils/disks/types';
-import {useSetting} from '../../utils/hooks';
 import {DiskStateProgressBar} from '../DiskStateProgressBar/DiskStateProgressBar';
 import {InternalLink} from '../InternalLink';
 import {VDiskPopup} from '../VDiskPopup/VDiskPopup';
@@ -27,7 +26,7 @@ interface VDiskProps {
 export const VDisk = ({data = {}, nodes, compact}: VDiskProps) => {
     const isFullData = isFullVDiskData(data);
 
-    const [useSeparateDisksPages] = useSetting(USE_SEPARATE_DISKS_PAGES_KEY);
+    const diskPagesAvailable = useDiskPagesAvailable();
 
     const [isPopupVisible, setIsPopupVisible] = React.useState(false);
 
@@ -44,7 +43,7 @@ export const VDisk = ({data = {}, nodes, compact}: VDiskProps) => {
     let vDiskPath: string | undefined;
 
     if (
-        useSeparateDisksPages &&
+        diskPagesAvailable &&
         valueIsDefined(data.VDiskSlotId) &&
         valueIsDefined(data.PDiskId) &&
         valueIsDefined(data.NodeId)
diff --git a/src/components/VDiskInfo/VDiskInfo.tsx b/src/components/VDiskInfo/VDiskInfo.tsx
@@ -1,4 +1,5 @@
 import {getVDiskPagePath} from '../../routes';
+import {useDiskPagesAvailable} from '../../store/reducers/capabilities/hooks';
 import {valueIsDefined} from '../../utils';
 import {cn} from '../../utils/cn';
 import {formatStorageValuesToGb, stringifyVdiskId} from '../../utils/dataFormatters/dataFormatters';
@@ -20,17 +21,19 @@ const b = cn('ydb-vdisk-info');
 
 interface VDiskInfoProps<T extends PreparedVDisk> extends Omit<InfoViewerProps, 'info'> {
     data?: T;
-    isVDiskPage?: boolean;
+    withVDiskPageLink?: boolean;
     withTitle?: boolean;
 }
 
 // eslint-disable-next-line complexity
 export function VDiskInfo<T extends PreparedVDisk>({
     data,
-    isVDiskPage,
+    withVDiskPageLink,
     withTitle,
     ...infoViewerProps
 }: VDiskInfoProps<T>) {
+    const diskPagesAvailable = useDiskPagesAvailable();
+
     const {
         AllocatedSize,
         DiskSpace,
@@ -151,7 +154,7 @@ export function VDiskInfo<T extends PreparedVDisk>({
             label: vDiskInfoKeyset('links'),
             value: (
                 <span className={b('links')}>
-                    {!isVDiskPage && (
+                    {withVDiskPageLink && diskPagesAvailable && (
                         <LinkWithIcon
                             title={vDiskInfoKeyset('vdisk-page')}
                             url={vDiskPagePath}
diff --git a/src/containers/App/Content.tsx b/src/containers/App/Content.tsx
@@ -10,6 +10,7 @@ import type {SlotComponent} from '../../components/slots/types';
 import routes from '../../routes';
 import type {RootState} from '../../store';
 import {getUser} from '../../store/reducers/authentication/authentication';
+import {capabilitiesApi} from '../../store/reducers/capabilities/capabilities';
 import {nodesListApi} from '../../store/reducers/nodesList';
 import {cn} from '../../utils/cn';
 import {useTypedDispatch, useTypedSelector} from '../../utils/hooks';
@@ -144,6 +145,7 @@ export function Content(props: ContentProps) {
             <Route key="single-cluster">
                 <GetUser />
                 <GetNodesList />
+                <GetCapabilities />
                 <Header mainPage={mainPage} />
                 <Switch>
                     {routesSlots.map((route) => {
@@ -185,6 +187,11 @@ function GetNodesList() {
     return null;
 }
 
+function GetCapabilities() {
+    capabilitiesApi.useGetClusterCapabilitiesQuery(undefined);
+    return null;
+}
+
 interface ContentWrapperProps {
     singleClusterMode: boolean;
     isAuthenticated: boolean;
diff --git a/src/containers/Node/NodeStructure/Pdisk.tsx b/src/containers/Node/NodeStructure/Pdisk.tsx
@@ -140,7 +140,7 @@ function getColumns({
                 return (
                     <Popover
                         placement={['right']}
-                        content={<VDiskInfo data={row} withTitle />}
+                        content={<VDiskInfo data={row} withTitle withVDiskPageLink />}
                         tooltipContentClassName={b('vdisk-details')}
                     >
                         <Button
@@ -202,7 +202,12 @@ export function PDisk({
 
         return (
             <div>
-                <PDiskInfo pDisk={data} nodeId={nodeId} className={b('pdisk-details')} />
+                <PDiskInfo
+                    pDisk={data}
+                    nodeId={nodeId}
+                    className={b('pdisk-details')}
+                    withPDiskPageLink
+                />
                 <div className={b('vdisks-container')}>
                     <div className={b('vdisks-header')}>VDisks</div>
                     {renderVDisks()}
diff --git a/src/containers/PDiskPage/PDiskPage.tsx b/src/containers/PDiskPage/PDiskPage.tsx
@@ -166,14 +166,7 @@ export function PDiskPage() {
         if (pDiskLoading) {
             return <InfoViewerSkeleton className={pdiskPageCn('info')} rows={10} />;
         }
-        return (
-            <PDiskInfo
-                pDisk={pDiskData}
-                nodeId={nodeId}
-                className={pdiskPageCn('info')}
-                isPDiskPage
-            />
-        );
+        return <PDiskInfo pDisk={pDiskData} nodeId={nodeId} className={pdiskPageCn('info')} />;
     };
 
     const renderTabs = () => {
diff --git a/src/containers/Storage/PDisk/PDisk.tsx b/src/containers/Storage/PDisk/PDisk.tsx
@@ -5,13 +5,12 @@ import {InternalLink} from '../../../components/InternalLink';
 import {PDiskPopup} from '../../../components/PDiskPopup/PDiskPopup';
 import {VDiskWithDonorsStack} from '../../../components/VDisk/VDiskWithDonorsStack';
 import routes, {createHref, getPDiskPagePath} from '../../../routes';
+import {useDiskPagesAvailable} from '../../../store/reducers/capabilities/hooks';
 import type {TVDiskStateInfo} from '../../../types/api/vdisk';
 import {valueIsDefined} from '../../../utils';
 import {cn} from '../../../utils/cn';
-import {USE_SEPARATE_DISKS_PAGES_KEY} from '../../../utils/constants';
 import {stringifyVdiskId} from '../../../utils/dataFormatters/dataFormatters';
 import type {PreparedPDisk} from '../../../utils/disks/types';
-import {useSetting} from '../../../utils/hooks';
 import {STRUCTURE} from '../../Node/NodePages';
 
 import './PDisk.scss';
@@ -27,7 +26,7 @@ interface PDiskProps {
 export const PDisk = ({nodeId, data = {}, vDisks}: PDiskProps) => {
     const [isPopupVisible, setIsPopupVisible] = React.useState(false);
 
-    const [useSeparateDisksPages] = useSetting(USE_SEPARATE_DISKS_PAGES_KEY);
+    const diskPagesAvailable = useDiskPagesAvailable();
 
     const anchor = React.useRef(null);
 
@@ -75,7 +74,7 @@ export const PDisk = ({nodeId, data = {}, vDisks}: PDiskProps) => {
         {pdiskId: data.PDiskId || ''},
     );
 
-    if (useSeparateDisksPages && valueIsDefined(data.PDiskId)) {
+    if (diskPagesAvailable && valueIsDefined(data.PDiskId)) {
         pDiskPath = getPDiskPagePath(data.PDiskId, nodeId);
     }
 
diff --git a/src/containers/Tenant/Schema/SchemaTree/SchemaTree.tsx b/src/containers/Tenant/Schema/SchemaTree/SchemaTree.tsx
@@ -5,10 +5,10 @@ import React from 'react';
 
 import {NavigationTree} from 'ydb-ui-components';
 
-import {USE_DIRECTORY_OPERATIONS} from '../../../../lib';
+import {useCreateDirectoryFeatureAvailable} from '../../../../store/reducers/capabilities/hooks';
 import {schemaApi} from '../../../../store/reducers/schema/schema';
 import type {EPathType, TEvDescribeSchemeResult} from '../../../../types/api/schema';
-import {useQueryExecutionSettings, useSetting, useTypedDispatch} from '../../../../utils/hooks';
+import {useQueryExecutionSettings, useTypedDispatch} from '../../../../utils/hooks';
 import {isChildlessPathType, mapPathTypeToNavigationTreeType} from '../../utils/schema';
 import {getActions} from '../../utils/schemaActions';
 import {getControls} from '../../utils/schemaControls';
@@ -23,7 +23,7 @@ interface SchemaTreeProps {
 }
 
 export function SchemaTree(props: SchemaTreeProps) {
-    const [useDirectoryActions] = useSetting<boolean>(USE_DIRECTORY_OPERATIONS);
+    const createDirectoryFeatureAvailable = useCreateDirectoryFeatureAvailable();
     const {rootPath, rootName, rootType, currentPath, onActivePathUpdate} = props;
     const dispatch = useTypedDispatch();
 
@@ -114,7 +114,7 @@ export function SchemaTree(props: SchemaTreeProps) {
                     setActivePath: onActivePathUpdate,
                     updateQueryExecutionSettings: (settings) =>
                         setQueryExecutionSettings({...querySettings, ...settings}),
-                    showCreateDirectoryDialog: useDirectoryActions
+                    showCreateDirectoryDialog: createDirectoryFeatureAvailable
                         ? handleOpenCreateDirectoryDialog
                         : undefined,
                 })}
diff --git a/src/containers/UserSettings/i18n/en.json b/src/containers/UserSettings/i18n/en.json
@@ -45,11 +45,6 @@
   "settings.queryUseMultiSchema.title": "Allow queries with multiple result sets",
   "settings.queryUseMultiSchema.description": "Use 'multi' schema for queries. It enables queries with multiple result sets. It returns nothing on versions 23-3 and older",
 
-  "settings.useSeparateDisksPages.title": "Use separate PDisk and VDisk pages",
-  "settings.useSeparateDisksPages.description": "Use separate pages instead of node structure tab",
-
-  "settings.useDirectoryOperations.title": "Enable operations with directories",
-
   "settings.useClusterBalancerAsBackend.title": "Use cluster balancer as backend",
   "settings.useClusterBalancerAsBackend.description": "By default random cluster node is used as backend. It causes saved links to become invalid after some time, when node is restarted. Using balancer as backend fixes it",
 
diff --git a/src/containers/UserSettings/settings.tsx b/src/containers/UserSettings/settings.tsx
@@ -13,10 +13,8 @@ import {
     SHOW_DOMAIN_DATABASE_KEY,
     THEME_KEY,
     USE_CLUSTER_BALANCER_AS_BACKEND_KEY,
-    USE_DIRECTORY_OPERATIONS,
     USE_NODES_ENDPOINT_IN_DIAGNOSTICS_KEY,
     USE_PAGINATED_TABLES_KEY,
-    USE_SEPARATE_DISKS_PAGES_KEY,
 } from '../../utils/constants';
 import {Lang, defaultLang} from '../../utils/i18n';
 import {ClusterModeGuard} from '../ClusterModeGuard';
@@ -127,17 +125,6 @@ export const queryUseMultiSchemaSetting: SettingProps = {
     description: i18n('settings.queryUseMultiSchema.description'),
 };
 
-export const useSeparateDisksPagesSetting: SettingProps = {
-    settingKey: USE_SEPARATE_DISKS_PAGES_KEY,
-    title: i18n('settings.useSeparateDisksPages.title'),
-    description: i18n('settings.useSeparateDisksPages.description'),
-};
-
-export const useDirectoryActionsSetting: SettingProps = {
-    settingKey: USE_DIRECTORY_OPERATIONS,
-    title: i18n('settings.useDirectoryOperations.title'),
-};
-
 export const useClusterBalancerAsBackendSetting: SettingProps = {
     settingKey: USE_CLUSTER_BALANCER_AS_BACKEND_KEY,
     title: i18n('settings.useClusterBalancerAsBackend.title'),
@@ -175,13 +162,7 @@ export const appearanceSection: SettingsSection = {
 export const experimentsSection: SettingsSection = {
     id: 'experimentsSection',
     title: i18n('section.experiments'),
-    settings: [
-        useNodesEndpointSetting,
-        usePaginatedTables,
-        queryUseMultiSchemaSetting,
-        useSeparateDisksPagesSetting,
-        useDirectoryActionsSetting,
-    ],
+    settings: [useNodesEndpointSetting, usePaginatedTables, queryUseMultiSchemaSetting],
 };
 export const devSettingsSection: SettingsSection = {
     id: 'devSettingsSection',
diff --git a/src/containers/VDiskPage/VDiskPage.tsx b/src/containers/VDiskPage/VDiskPage.tsx
@@ -158,7 +158,7 @@ export function VDiskPage() {
     };
 
     const renderInfo = () => {
-        return <VDiskInfo data={vDiskData} isVDiskPage />;
+        return <VDiskInfo data={vDiskData} />;
     };
 
     const renderGroupInfo = () => {
diff --git a/src/services/api.ts b/src/services/api.ts
@@ -9,6 +9,7 @@ import type {ComputeApiRequestParams, NodesApiRequestParams} from '../store/redu
 import type {StorageApiRequestParams} from '../store/reducers/storage/types';
 import type {TMetaInfo} from '../types/api/acl';
 import type {TQueryAutocomplete} from '../types/api/autocomplete';
+import type {CapabilitiesResponse} from '../types/api/capabilities';
 import type {TClusterInfo} from '../types/api/cluster';
 import type {TComputeInfo} from '../types/api/compute';
 import type {DescribeConsumerResult} from '../types/api/consumer';
@@ -87,6 +88,9 @@ export class YdbEmbeddedAPI extends AxiosWrapper {
     getPath(path: string) {
         return `${BACKEND ?? ''}${path}`;
     }
+    getClusterCapabilities() {
+        return this.get<CapabilitiesResponse>(this.getPath('/viewer/capabilities'), {}, {});
+    }
     getClusterInfo(clusterName?: string, {concurrentId, signal}: AxiosOptions = {}) {
         return this.get<TClusterInfo>(
             this.getPath('/viewer/json/cluster'),
diff --git a/src/services/settings.ts b/src/services/settings.ts
@@ -21,10 +21,8 @@ import {
     TENANT_INITIAL_PAGE_KEY,
     THEME_KEY,
     USE_CLUSTER_BALANCER_AS_BACKEND_KEY,
-    USE_DIRECTORY_OPERATIONS,
     USE_NODES_ENDPOINT_IN_DIAGNOSTICS_KEY,
     USE_PAGINATED_TABLES_KEY,
-    USE_SEPARATE_DISKS_PAGES_KEY,
 } from '../utils/constants';
 import {QUERY_ACTIONS} from '../utils/query';
 import {parseJson} from '../utils/utils';
@@ -46,12 +44,10 @@ export const DEFAULT_USER_SETTINGS = {
     [PARTITIONS_HIDDEN_COLUMNS_KEY]: [],
     [USE_PAGINATED_TABLES_KEY]: false,
     [USE_CLUSTER_BALANCER_AS_BACKEND_KEY]: true,
-    [USE_SEPARATE_DISKS_PAGES_KEY]: false,
     [ENABLE_AUTOCOMPLETE]: true,
     [AUTOCOMPLETE_ON_ENTER]: true,
     [IS_HOTKEYS_HELP_HIDDEN_KEY]: false,
     [AUTO_REFRESH_INTERVAL]: 0,
-    [USE_DIRECTORY_OPERATIONS]: false,
     [QUERY_SETTINGS]: false,
     [SHOW_DOMAIN_DATABASE_KEY]: false,
     [LAST_QUERY_EXECUTION_SETTINGS_KEY]: undefined,
diff --git a/src/store/reducers/capabilities/capabilities.ts b/src/store/reducers/capabilities/capabilities.ts
diff --git a/src/store/reducers/capabilities/hooks.ts b/src/store/reducers/capabilities/hooks.ts
diff --git a/src/types/api/capabilities.ts b/src/types/api/capabilities.ts
diff --git a/src/utils/constants.ts b/src/utils/constants.ts
