ydb-embedded-ui 22.0.0 → 22.1.0

package/src/containers/Tenant/Diagnostics/Overview/ResourcePoolInfo/i18n/en.json

@@ -0,0 +1,9 @@
+{
+  "title_pool-settings": "Pool Settings",
+  "group_queue": "Queue & Concurrency",
+  "group_cpu": "CPU",
+  "field_concurrent-query-limit": "Concurrent query limit",
+  "field_queue-size": "Queue size",
+  "field_database-load-cpu-threshold": "Database load CPU threshold",
+  "field_total-cpu-limit-percent-per-node": "Total CPU limit % per node"
+}

package/src/containers/Tenant/Diagnostics/Overview/ResourcePoolInfo/i18n/index.ts

@@ -0,0 +1,7 @@
+import {registerKeysets} from '../../../../../../utils/i18n';
+
+import en from './en.json';
+
+const COMPONENT = 'ydb-diagnostics-resource-pool-info';
+
+export default registerKeysets(COMPONENT, {en});

package/src/containers/Tenant/Diagnostics/Overview/ResourcePoolInfo/index.ts

@@ -0,0 +1 @@
+export * from './ResourcePoolInfo';

package/src/containers/Tenant/Diagnostics/Overview/utils/prepareTopicSchemaInfo.ts

@@ -22,10 +22,10 @@ export const prepareTopicSchemaInfo = (data?: TEvDescribeSchemeResult): Array<In
         return [];
     }
 
-    const {Partitions = [], PQTabletConfig = {PartitionConfig: {LifetimeSeconds: 0}}} = pqGroupData;
+    const {Partitions = [], PQTabletConfig} = pqGroupData;
 
-    const {Codecs, MeteringMode, PartitionStrategy} = PQTabletConfig;
-    const {WriteSpeedInBytesPerSecond, StorageLimitBytes} = PQTabletConfig.PartitionConfig;
+    const {Codecs, MeteringMode, PartitionStrategy, PartitionConfig} = PQTabletConfig ?? {};
+    const {WriteSpeedInBytesPerSecond, StorageLimitBytes} = PartitionConfig ?? {};
 
     //@ts-expect-error
     const pqGeneralInfo = formatObject<TPersQueueGroupDescription>(formatPQGroupItem, {

package/src/containers/Tenant/Diagnostics/TopQueries/QueriesTableWithDrawer.tsx

@@ -8,6 +8,7 @@ import type {DrawerControl} from '../../../../components/Drawer/Drawer';
 import {ResizeableDataTable} from '../../../../components/ResizeableDataTable/ResizeableDataTable';
 import type {KeyValueRow} from '../../../../types/api/query';
 import {cn} from '../../../../utils/cn';
+import {getQueryShortText} from '../../../../utils/query';
 
 import {QueryDetailsDrawerContent} from './QueryDetails/QueryDetailsDrawerContent';
 import i18n from './i18n';
@@ -18,6 +19,7 @@ const b = cn('kv-top-queries');
 interface SimpleTableWithDrawerProps {
     columns: Column<KeyValueRow>[];
     data: KeyValueRow[];
+    getKeyboardRowKey?: (row: KeyValueRow) => string | number | undefined;
     isFetching?: boolean;
     isLoading?: boolean;
     onRowClick?: (
@@ -40,6 +42,7 @@ interface SimpleTableWithDrawerProps {
 export function QueriesTableWithDrawer({
     columns,
     data,
+    getKeyboardRowKey,
     isFetching,
     isLoading,
     onRowClick,
@@ -102,6 +105,9 @@ export function QueriesTableWithDrawer({
             drawerControls={finalDrawerControls}
         >
             <ResizeableDataTable
+                onKeyboardActivate={handleRowClick}
+                getKeyboardRowKey={getKeyboardRowKey}
+                getKeyboardRowLabel={(row) => getQueryShortText(row.QueryText?.toString())}
                 emptyDataMessage={emptyDataMessage || i18n('no-data')}
                 columnsWidthLSKey={columnsWidthLSKey}
                 columns={columns}

package/src/containers/Tenant/Diagnostics/TopQueries/RunningQueriesData.tsx

@@ -86,6 +86,7 @@ export const RunningQueriesData = ({
             <TableWithControlsLayout.Controls renderExtraControls={renderExtraControls}>
                 {renderQueryModeControl()}
                 <Search
+                    tableFilter
                     value={filters.text}
                     onChange={handleTextSearchUpdate}
                     placeholder={i18n('filter.text.placeholder')}
@@ -97,6 +98,9 @@ export const RunningQueriesData = ({
             {error ? <ResponseError error={error} /> : null}
             <TableWithControlsLayout.Table>
                 <QueriesTableWithDrawer
+                    getKeyboardRowKey={(row) =>
+                        JSON.stringify([database, row.SessionId, row.QueryStartAt])
+                    }
                     columns={columnsToShow}
                     data={rows || []}
                     isFetching={isFetching && currentData === undefined}

package/src/containers/Tenant/Diagnostics/TopQueries/TopQueriesData.tsx

@@ -137,7 +137,9 @@ export const TopQueriesData = ({
     };
 
     return (
-        <TableWithControlsLayout>
+        <TableWithControlsLayout
+            keyboardNavigationResetKey={JSON.stringify([timeFrame, filters.from, filters.to])}
+        >
             <TableWithControlsLayout.Controls renderExtraControls={renderExtraControls}>
                 {renderQueryModeControl()}
                 <Select
@@ -152,6 +154,7 @@ export const TopQueriesData = ({
                     defaultValue={DEFAULT_TIME_FILTER_VALUE}
                 />
                 <Search
+                    tableFilter
                     value={filters.text}
                     inputRef={inputRef}
                     onChange={handleTextSearchUpdate}
@@ -163,6 +166,9 @@ export const TopQueriesData = ({
             {error ? <ResponseError error={error} /> : null}
             <TableWithControlsLayout.Table>
                 <QueriesTableWithDrawer
+                    getKeyboardRowKey={(row) =>
+                        JSON.stringify([database, row.IntervalEnd, row.EndTime, row.QueryText])
+                    }
                     columns={columnsToShow}
                     data={rows || []}
                     isFetching={isFetching && currentData === undefined}

package/src/containers/Tenant/Diagnostics/TopShards/TopShards.tsx

@@ -153,7 +153,7 @@ export const TopShards = ({database, path, databaseFullPath}: TopShardsProps) =>
     };
 
     return (
-        <TableWithControlsLayout>
+        <TableWithControlsLayout keyboardNavigation={false}>
             <TableWithControlsLayout.Controls>{renderControls()}</TableWithControlsLayout.Controls>
 
             {filters.mode === EShardsWorkloadMode.History && (

package/src/containers/Tenant/Query/QueriesHistory/QueriesHistory.tsx

@@ -16,6 +16,7 @@ import {
 } from '../../../../store/reducers/query/query';
 import type {QueryInHistory} from '../../../../store/reducers/query/types';
 import {useTypedDispatch, useTypedSelector} from '../../../../utils/hooks';
+import {getQueryShortText} from '../../../../utils/query';
 import {QUERY_TABLE_SETTINGS} from '../../utils/constants';
 import {SAVE_QUERY_DIALOG} from '../SaveQuery/SaveQuery';
 import {useOpenExternalQueryInEditor} from '../hooks/useOpenExternalQueryInEditor';
@@ -116,6 +117,7 @@ function QueriesHistory({queriesHistory}: QueriesHistoryProps) {
             <TableWithControlsLayout className={b('table-with-controls')}>
                 <TableWithControlsLayout.Controls>
                     <Search
+                        tableFilter
                         value={filter}
                         onChange={onChangeFilter}
                         placeholder={i18n('field_query-text-search')}
@@ -135,6 +137,9 @@ function QueriesHistory({queriesHistory}: QueriesHistoryProps) {
                         defaultWidth={50}
                     >
                         <ResizeableDataTable
+                            onKeyboardActivate={handleShowPreview}
+                            getKeyboardRowKey={(query) => query.queryId}
+                            getKeyboardRowLabel={(query) => getQueryShortText(query.queryText)}
                             columnsWidthLSKey={QUERIES_HISTORY_COLUMNS_WIDTH_LS_KEY}
                             columns={columns}
                             data={queriesHistory.filteredHistoryQueries}

package/src/containers/Tenant/Query/SavedQueries/SavedQueries.tsx

@@ -243,6 +243,7 @@ export const SavedQueries = () => {
                 <TableWithControlsLayout className={b('table-with-controls')}>
                     <TableWithControlsLayout.Controls>
                         <Search
+                            tableFilter
                             value={filter}
                             onChange={handleChangeFilter}
                             placeholder={i18n('field_saved-query-search')}
@@ -262,6 +263,11 @@ export const SavedQueries = () => {
                             defaultWidth={50}
                         >
                             <ResizeableDataTable
+                                onKeyboardActivate={handleShowPreview}
+                                getKeyboardRowKey={(query) => query.name}
+                                getKeyboardRowLabel={(query) =>
+                                    query.name || EMPTY_DATA_PLACEHOLDER
+                                }
                                 columnsWidthLSKey={SAVED_QUERIES_COLUMNS_WIDTH_LS_KEY}
                                 columns={columns}
                                 data={filteredSavedQueries}

package/src/containers/Tenants/TenantsTable.tsx

@@ -5,6 +5,7 @@ import type {Column, SortOrder} from '@gravity-ui/react-data-table';
 import DataTable from '@gravity-ui/react-data-table';
 import type {LabelProps} from '@gravity-ui/uikit';
 import {Button, Flex, Icon, Label} from '@gravity-ui/uikit';
+import {useHistory} from 'react-router-dom';
 
 import {EntitiesCount} from '../../components/EntitiesCount';
 import {ResponseError} from '../../components/Errors/ResponseError';
@@ -15,6 +16,7 @@ import {Search} from '../../components/Search';
 import {TableColumnSetup} from '../../components/TableColumnSetup/TableColumnSetup';
 import {TableWithControlsLayout} from '../../components/TableWithControlsLayout/TableWithControlsLayout';
 import {TenantNameWrapper} from '../../components/TenantNameWrapper/TenantNameWrapper';
+import {getTenantLink} from '../../components/TenantNameWrapper/utils';
 import {useEmMetaAvailable} from '../../store/reducers/capabilities/hooks';
 import {useClusterBaseInfo} from '../../store/reducers/cluster/cluster';
 import {
@@ -131,6 +133,7 @@ const TenantsTableContent = ({
     onStatusClick,
 }: TenantsTableContentProps) => {
     const SuccessImage = getIllustration('SuccessOperation');
+    const history = useHistory();
 
     const [autoRefreshInterval] = useAutoRefreshInterval();
     const {currentData, isFetching, error} = tenantsApi.useGetTenantsInfoQuery(
@@ -144,7 +147,7 @@ const TenantsTableContent = ({
 
     const isCreateDBAvailable = useEmMetaAvailable() && uiFactory.onCreateDB !== undefined;
 
-    const {domain: domainRoot} = useClusterBaseInfo();
+    const {domain: domainRoot, settings} = useClusterBaseInfo();
 
     const {search, withProblems, handleSearchChange, handleWithProblemsChange} =
         useTenantsQueryParams();
@@ -167,7 +170,40 @@ const TenantsTableContent = ({
         const filteredBySearch = filterTenantsBySearch(filteredByProblems, search);
 
         return filteredBySearch;
-    }, [tenants, withProblems, search]);
+    }, [tenants, withProblems, search, showWithProblemsFilter]);
+
+    const tenantLinks = React.useMemo(
+        () =>
+            new Map(
+                tenants.map((tenant) => [
+                    tenant,
+                    getTenantLink({
+                        tenant,
+                        additionalTenantsProps,
+                        externalLink: Boolean(environmentName),
+                        useDatabaseId:
+                            uiFactory.useDatabaseId && settings?.use_meta_proxy !== false,
+                    }),
+                ]),
+            ),
+        [tenants, additionalTenantsProps, environmentName, settings?.use_meta_proxy],
+    );
+
+    const openTenant = React.useCallback(
+        (tenant: PreparedTenant) => {
+            const link = tenantLinks.get(tenant);
+            if (!link) {
+                return;
+            }
+            if (link.isExternalLink) {
+                window.open(link.href, '_blank', 'noopener,noreferrer');
+                return;
+            }
+
+            history.push(link.href);
+        },
+        [tenantLinks, history],
+    );
 
     const renderCreateDBButton = () => {
         const buttonAvailable = isCreateDBAvailable && clusterName;
@@ -192,6 +228,7 @@ const TenantsTableContent = ({
         return (
             <React.Fragment>
                 <Search
+                    tableFilter
                     value={search}
                     onChange={handleSearchChange}
                     placeholder="Database name"
@@ -221,6 +258,7 @@ const TenantsTableContent = ({
                         clusterName={clusterName}
                         additionalTenantsProps={additionalTenantsProps}
                         externalLink={Boolean(environmentName)}
+                        link={tenantLinks.get(row)}
                         onStatusClick={onStatusClick}
                     />
                 ),
@@ -362,6 +400,7 @@ const TenantsTableContent = ({
         handleSearchChange,
         onStatusClick,
         showPoolsColumn,
+        tenantLinks,
     ]);
 
     const {columnsToShow, columnsToSelect, setColumns} = useSelectedColumns(
@@ -378,14 +417,26 @@ const TenantsTableContent = ({
         }
 
         return (
-            <ResizeableDataTable
-                columnsWidthLSKey={DATABASES_COLUMNS_WIDTH_LS_KEY}
-                data={filteredTenants}
-                columns={columnsToShow}
-                settings={DEFAULT_TABLE_SETTINGS}
-                emptyDataMessage={i18n('no-databases')}
-                onSortChange={setSortParams}
-            />
+            <div>
+                <ResizeableDataTable
+                    onKeyboardActivate={openTenant}
+                    getKeyboardRowKey={(tenant) =>
+                        JSON.stringify([tenant.Cluster, tenant.Id ?? tenant.Name])
+                    }
+                    getKeyboardRowLabel={(tenant) =>
+                        tenant.controlPlaneName ||
+                        tenant.Name ||
+                        tenant.Id ||
+                        EMPTY_DATA_PLACEHOLDER
+                    }
+                    columnsWidthLSKey={DATABASES_COLUMNS_WIDTH_LS_KEY}
+                    data={filteredTenants}
+                    columns={columnsToShow}
+                    settings={DEFAULT_TABLE_SETTINGS}
+                    emptyDataMessage={i18n('no-databases')}
+                    onSortChange={setSortParams}
+                />
+            </div>
         );
     };
 
@@ -411,7 +462,14 @@ const TenantsTableContent = ({
 
     return (
         <div className={b('table-wrapper')}>
-            <TableWithControlsLayout fullHeight>
+            <TableWithControlsLayout
+                fullHeight
+                keyboardNavigationResetKey={JSON.stringify([
+                    withProblems,
+                    showDomainDatabase,
+                    showWithProblemsFilter,
+                ])}
+            >
                 <TableWithControlsLayout.Controls renderExtraControls={renderExtraControls}>
                     {renderControls()}
                 </TableWithControlsLayout.Controls>
@@ -421,7 +479,7 @@ const TenantsTableContent = ({
                     loading={loading}
                     scrollDependencies={[search, withProblems, sortParams]}
                 >
-                    {currentData ? renderTable() : null}
+                    <div>{currentData ? renderTable() : null}</div>
                 </TableWithControlsLayout.Table>
             </TableWithControlsLayout>
         </div>

package/src/containers/VDiskPage/VDiskPage.tsx

@@ -174,7 +174,7 @@ export function VDiskPage() {
             return null;
         }
         return (
-            <div className={vDiskPageCn('controls')}>
+            <div className={vDiskPageCn('controls')} data-qa="vdisk-controls">
                 <EvictVDiskButton
                     vDiskId={resolvedVDiskId}
                     donorMode={vDiskData?.DonorMode}

package/src/services/api/tablets.ts

@@ -1,4 +1,5 @@
 import type {TTabletHiveResponse} from '../../types/api/tablet';
+import {getTabletDevUiAppPage} from '../../utils/developerUI/tabletDevUi';
 import type {Nullable} from '../../utils/typecheckers';
 
 import type {AxiosOptions} from './base';
@@ -11,6 +12,7 @@ export class TabletsAPI extends BaseYdbAPI {
         failRealmIdx,
         failDomainIdx,
         vDiskIdx,
+        useSecurePath = false,
     }: {
         groupId: string | number;
         groupGeneration: string | number;
@@ -18,12 +20,15 @@ export class TabletsAPI extends BaseYdbAPI {
         failDomainIdx: string | number;
         vDiskIdx: string | number;
         force?: boolean;
+        useSecurePath?: boolean;
     }) {
         // BSC Id is constant for all ydb clusters
         const BSC_TABLET_ID = '72057594037932033';
 
         return this.post(
-            this.getPath(`/tablets/app?TabletID=${BSC_TABLET_ID}&exec=1`),
+            this.getPath(
+                `/tablets/${getTabletDevUiAppPage(useSecurePath)}?TabletID=${BSC_TABLET_ID}&exec=1`,
+            ),
             {
                 Command: {
                     ReassignGroupDisk: {
@@ -54,28 +59,32 @@ export class TabletsAPI extends BaseYdbAPI {
         );
     }
 
-    stopTablet(id: string, hiveId: string) {
+    stopTablet(id: string, hiveId: string, useSecurePath = false) {
         return this.post<unknown>(
-            this.getPath(`/tablets/app?TabletID=${hiveId}&page=StopTablet&tablet=${id}`),
+            this.getPath(
+                `/tablets/${getTabletDevUiAppPage(useSecurePath)}?TabletID=${hiveId}&page=StopTablet&tablet=${id}`,
+            ),
             {},
             {requestConfig: {'axios-retry': {retries: 0}}},
         );
     }
 
-    resumeTablet(id: string, hiveId: string) {
+    resumeTablet(id: string, hiveId: string, useSecurePath = false) {
         return this.post<unknown>(
-            this.getPath(`/tablets/app?TabletID=${hiveId}&page=ResumeTablet&tablet=${id}`),
+            this.getPath(
+                `/tablets/${getTabletDevUiAppPage(useSecurePath)}?TabletID=${hiveId}&page=ResumeTablet&tablet=${id}`,
+            ),
             {},
             {requestConfig: {'axios-retry': {retries: 0}}},
         );
     }
 
     getTabletFromHive(
-        {id, hiveId}: {id: string; hiveId: string},
+        {id, hiveId, useSecurePath = false}: {id: string; hiveId: string; useSecurePath?: boolean},
         {concurrentId, signal}: AxiosOptions = {},
     ) {
         return this.get<Nullable<TTabletHiveResponse>>(
-            this.getPath('/tablets/app'),
+            this.getPath(`/tablets/${getTabletDevUiAppPage(useSecurePath)}`),
             {
                 TabletID: hiveId,
                 page: 'TabletInfo',

package/src/store/reducers/capabilities/hooks.ts

@@ -199,6 +199,15 @@ export const useAnalyzeOperationAvailable = () => {
     return operationListVersion >= 2 && Boolean(analyzeLongRunningOperationEnabled);
 };
 
+export const useTabletDevUiSecurePath = () => {
+    const database = useDatabaseFromQuery();
+
+    return useTypedSelector((state) => {
+        const {data, isError} = selectDatabaseCapabilities(state, database);
+        return !isError && data?.Settings?.Features?.EnableTabletDevUiSecurePath === true;
+    });
+};
+
 export const useGraphShardExists = () => {
     const database = useDatabaseFromQuery();
 

package/src/store/reducers/nodesList.ts

@@ -27,7 +27,6 @@ const createGetNodesListSelector = createSelector(
 );
 
 export const selectNodesMap = createSelector(
-    (state: RootState) => state,
-    (_state: RootState, database?: string) => createGetNodesListSelector(database),
-    (state, selectNodesList) => prepareNodesMap(selectNodesList(state).data),
+    (state: RootState, database?: string) => createGetNodesListSelector(database)(state).data,
+    prepareNodesMap,
 );

package/src/store/reducers/settings/constants.ts

@@ -45,6 +45,8 @@ export const SETTING_KEYS = {
     STORAGE_EXPERT_MODE: 'storageExpertMode',
     STORAGE_VDISKS_GROUP_BY: 'storageVDisksGroupBy',
     STORAGE_PDISKS_GROUP_BY: 'storagePDisksGroupBy',
+    STORAGE_NODES_VDISKS_GROUP_BY: 'storageNodesVDisksGroupBy',
+    STORAGE_NODES_PDISKS_GROUP_BY: 'storageNodesPDisksGroupBy',
 } as const;
 
 export type SettingKey = ValueOf<typeof SETTING_KEYS>;
@@ -87,6 +89,8 @@ export const DEFAULT_USER_SETTINGS = {
     [SETTING_KEYS.STORAGE_EXPERT_MODE]: false,
     [SETTING_KEYS.STORAGE_VDISKS_GROUP_BY]: 'State',
     [SETTING_KEYS.STORAGE_PDISKS_GROUP_BY]: 'State',
+    [SETTING_KEYS.STORAGE_NODES_VDISKS_GROUP_BY]: 'State',
+    [SETTING_KEYS.STORAGE_NODES_PDISKS_GROUP_BY]: 'State',
 } as const satisfies Record<SettingKey, unknown>;
 
 export const SETTINGS_OPTIONS: Record<string, SettingOptions | undefined> = {

package/src/store/reducers/storage/prepareGroupsDisks.ts

@@ -9,6 +9,7 @@ import type {PDiskType, PreparedVDisk} from '../../../utils/disks/types';
 import {parseOptionalNonNegativeNumber} from '../../../utils/utils';
 
 export function prepareGroupsVDisk(data: TStorageVDisk = {}): PreparedVDisk {
+    const hasWhiteboardData = data.HasWhiteboardData ?? Boolean(data.Whiteboard);
     const {Whiteboard: whiteboardVDisk = {}, PDisk, ...bscVDisk} = data;
 
     const mergedVDiskData = {
@@ -36,13 +37,14 @@ export function prepareGroupsVDisk(data: TStorageVDisk = {}): PreparedVDisk {
     const whiteboardSlotSize = parseOptionalNonNegativeNumber(
         PDisk?.Whiteboard?.EnforcedDynamicSlotSize,
     );
-    const whiteboardSizeFields = data.Whiteboard
-        ? prepareVDiskSizeFields({
-              AvailableSize: whiteboardAvailableSize,
-              AllocatedSize: whiteboardAllocatedSize,
-              SlotSize: whiteboardSlotSize,
-          })
-        : undefined;
+    const whiteboardSizeFields =
+        hasWhiteboardData && data.Whiteboard
+            ? prepareVDiskSizeFields({
+                  AvailableSize: whiteboardAvailableSize,
+                  AllocatedSize: whiteboardAllocatedSize,
+                  SlotSize: whiteboardSlotSize,
+              })
+            : undefined;
     const WhiteboardSize = whiteboardSizeFields
         ? {
               AllocatedSize:
@@ -72,6 +74,7 @@ export function prepareGroupsVDisk(data: TStorageVDisk = {}): PreparedVDisk {
     return {
         ...mergedVDiskData,
         ...vDiskSizeFields,
+        HasWhiteboardData: hasWhiteboardData,
         ...(WhiteboardSize ? {WhiteboardSize} : {}),
         PDisk: preparedPDisk,
         Donors: preparedDonors,
@@ -82,6 +85,7 @@ export function prepareGroupsVDisk(data: TStorageVDisk = {}): PreparedVDisk {
 }
 
 export function prepareGroupsPDisk(data: TStoragePDisk & {NodeId?: number} = {}) {
+    const hasWhiteboardData = data.HasWhiteboardData ?? Boolean(data.Whiteboard);
     const {Whiteboard: whiteboardPDisk, Status: DriveStatus, ...bscPDisk} = data;
 
     const mergedPDiskData = {
@@ -109,12 +113,12 @@ export function prepareGroupsPDisk(data: TStoragePDisk & {NodeId?: number} = {})
     const whiteboardAvailableSize = parseOptionalNonNegativeNumber(whiteboardPDisk?.AvailableSize);
     const whiteboardTotalSize = parseOptionalNonNegativeNumber(whiteboardPDisk?.TotalSize);
     const whiteboardSizeFields =
-        whiteboardPDisk === undefined
-            ? undefined
-            : preparePDiskSizeFields({
+        hasWhiteboardData && whiteboardPDisk
+            ? preparePDiskSizeFields({
                   AvailableSize: whiteboardAvailableSize,
                   TotalSize: whiteboardTotalSize,
-              });
+              })
+            : undefined;
     const WhiteboardSize = whiteboardSizeFields
         ? {
               AllocatedSize:
@@ -138,6 +142,7 @@ export function prepareGroupsPDisk(data: TStoragePDisk & {NodeId?: number} = {})
 
     return {
         ...mergedPDiskData,
+        HasWhiteboardData: hasWhiteboardData,
         StringifiedId,
         AllocatedPercent,
         AllocatedSize,

package/src/store/reducers/storage/utils.ts

@@ -76,14 +76,21 @@ const prepareStorageNodeData = (
         }).length || 0;
 
     const pDisks = PDisks?.map((pDisk) => {
-        return prepareWhiteboardPDiskData({
-            ...pDisk,
-            NodeId,
-        });
+        // Older viewers have no marker; identity and sizes can also come from BSC.
+        const hasWhiteboardData =
+            pDisk.HasWhiteboardData ??
+            (pDisk.State !== undefined ||
+                pDisk.StateFlag !== undefined ||
+                pDisk.Overall !== undefined ||
+                pDisk.CreateTime !== undefined ||
+                pDisk.ChangeTime !== undefined ||
+                pDisk.Device !== undefined ||
+                pDisk.Realtime !== undefined);
+        return prepareWhiteboardPDiskData({...pDisk, NodeId}, hasWhiteboardData ? pDisk : null);
     });
     const vDisks = VDisks?.map((vDisk) => {
         return {
-            ...prepareWhiteboardVDiskData(vDisk),
+            ...prepareWhiteboardVDiskData({...vDisk, VDiskId: vDisk.VDiskId}),
             NodeId,
         };
     });

package/src/store/reducers/tableData.ts

@@ -16,7 +16,7 @@ interface PaginatedTableParams<T, F> {
     noBatching?: boolean;
 }
 
-function endpoints<T, F>(build: EndpointBuilder<BaseQueryFn, string, string>) {
+function endpoints<T, F>(build: EndpointBuilder<BaseQueryFn, string, typeof api.reducerPath>) {
     return {
         fetchTableChunk: build.query<PaginatedTableData<T>, PaginatedTableParams<T, F>>({
             queryFn: async (

package/src/store/reducers/tablet.ts

@@ -120,10 +120,13 @@ export const tabletApi = api.injectEndpoints({
             },
         }),
         getAdvancedTableInfo: build.query({
-            queryFn: async ({id, hiveId}: {id: string; hiveId: string}, {signal}) => {
+            queryFn: async (
+                {id, hiveId, useSecurePath}: {id: string; hiveId: string; useSecurePath?: boolean},
+                {signal},
+            ) => {
                 try {
                     const tabletResponseData = await window.api.tablets.getTabletFromHive(
-                        {id, hiveId},
+                        {id, hiveId, useSecurePath},
                         {signal},
                     );
 
@@ -153,9 +156,17 @@ export const tabletApi = api.injectEndpoints({
             },
         }),
         stopTablet: build.mutation({
-            queryFn: async ({id, hiveId}: {id: string; hiveId: string}) => {
+            queryFn: async ({
+                id,
+                hiveId,
+                useSecurePath,
+            }: {
+                id: string;
+                hiveId: string;
+                useSecurePath?: boolean;
+            }) => {
                 try {
-                    const data = await window.api.tablets.stopTablet(id, hiveId);
+                    const data = await window.api.tablets.stopTablet(id, hiveId, useSecurePath);
                     return {data};
                 } catch (error) {
                     return {error};
@@ -169,9 +180,17 @@ export const tabletApi = api.injectEndpoints({
             },
         }),
         resumeTablet: build.mutation({
-            queryFn: async ({id, hiveId}: {id: string; hiveId: string}) => {
+            queryFn: async ({
+                id,
+                hiveId,
+                useSecurePath,
+            }: {
+                id: string;
+                hiveId: string;
+                useSecurePath?: boolean;
+            }) => {
                 try {
-                    const data = await window.api.tablets.resumeTablet(id, hiveId);
+                    const data = await window.api.tablets.resumeTablet(id, hiveId, useSecurePath);
                     return {data};
                 } catch (error) {
                     return {error};

package/src/store/reducers/tenantOverview/topShards/tenantOverviewTopShards.ts

@@ -7,7 +7,7 @@ function createShardQuery(path: string, databaseFullPath: string) {
     return createPartitionStatsQuery({
         databaseFullPath,
         path,
-        selectFields: ['Path', 'TabletId', 'CPUCores'],
+        selectFields: ['Path', 'TabletId', 'CPUCores', 'FollowerId'],
         sortOrder: [{columnId: 'CPUCores', order: -1}],
         limit: TENANT_OVERVIEW_TABLES_LIMIT,
     });

package/src/types/api/capabilities.ts

@@ -5,7 +5,7 @@ export interface CapabilitiesResponse {
     Capabilities: Record<Partial<Capability>, number>;
     Settings?: {
         Security?: Record<Partial<SecuritySetting>, boolean>;
-        Features?: Record<Partial<FeatureSetting>, boolean>;
+        Features?: Partial<Record<FeatureSetting, boolean>>;
         Database?: {
             GraphShardExists?: boolean;
         };
@@ -34,7 +34,7 @@ export type Capability =
 
 export type SecuritySetting = 'UseLoginProvider' | 'DomainLoginOnly';
 
-export type FeatureSetting = 'EnableAnalyzeLongRunningOperation';
+export type FeatureSetting = 'EnableAnalyzeLongRunningOperation' | 'EnableTabletDevUiSecurePath';
 
 export interface MetaCapabilitiesResponse {
     Capabilities: Record<Partial<MetaCapability>, number>;