feat(Tenant): table index overview

Author: ariser

src/components/IndexInfoViewer/IndexInfoViewer.tsx

@@ -0,0 +1,52 @@
+import type {TEvDescribeSchemeResult, TIndexDescription} from '../../types/api/schema';
+import {InfoViewer, createInfoFormatter} from '../InfoViewer';
+
+const DISPLAYED_FIELDS: Set<keyof TIndexDescription> = new Set([
+    'Type',
+    'State',
+    'DataSize',
+    'KeyColumnNames',
+    'DataColumnNames',
+]);
+
+const formatItem = createInfoFormatter<TIndexDescription>({
+    Type: (value) => value?.substring(10), // trims EIndexType prefix
+    State: (value) => value?.substring(11), // trims EIndexState prefix
+    KeyColumnNames: (value) => value?.join(', '),
+    DataColumnNames: (value) => value?.join(', '),
+}, {
+    KeyColumnNames: 'Columns',
+    DataColumnNames: 'Includes',
+});
+
+interface IndexInfoViewerProps {
+    data?: TEvDescribeSchemeResult;
+}
+
+export const IndexInfoViewer = ({data}: IndexInfoViewerProps) => {
+    if (!data) {
+        return (
+            <div className="error">no index data</div>
+        );
+    }
+
+    const TableIndex = data.PathDescription?.TableIndex;
+    const info: Array<{label?: string, value?: unknown}> = [];
+
+    let key: keyof TIndexDescription;
+    for (key in TableIndex) {
+        if (DISPLAYED_FIELDS.has(key)) {
+            info.push(formatItem(key, TableIndex?.[key]));
+        }
+    }
+
+    return (
+        <>
+            {info.length ? (
+                <InfoViewer info={info}></InfoViewer>
+            ) : (
+                <>Empty</>
+            )}
+        </>
+    );
+};

src/components/InfoViewer/index.ts

@@ -0,0 +1,4 @@
+import InfoViewer from './InfoViewer';
+
+export {InfoViewer};
+export * from './utils';

src/components/InfoViewer/utils.ts

@@ -0,0 +1,32 @@
+type LabelMap<T> = {
+    [label in keyof T]?: string;
+}
+
+type FieldMappers<T> = {
+    [label in keyof T]?: (value: T[label]) => string | undefined;
+}
+
+function formatLabel<Shape>(label: keyof Shape, map: LabelMap<Shape>) {
+    return map[label] ?? label;
+}
+
+function formatValue<Shape, Key extends keyof Shape>(
+    label: Key,
+    value: Shape[Key],
+    mappers: FieldMappers<Shape>,
+) {
+    const mapper = mappers[label];
+    const mappedValue = mapper ? mapper(value) : value;
+
+    return String(mappedValue ?? '');
+}
+
+export function createInfoFormatter<Shape extends Record<string, any>>(
+    fieldMappers?: FieldMappers<Shape>,
+    labelMap?: LabelMap<Shape>,
+) {
+    return <Key extends keyof Shape>(label: Key, value: Shape[Key]) => ({
+        label: formatLabel(label, labelMap || {}),
+        value: formatValue(label, value, fieldMappers || {}),
+    });
+}

src/containers/Tenant/Diagnostics/Overview/Overview.tsx

@@ -6,9 +6,10 @@ import {Loader} from '@yandex-cloud/uikit';
 
 //@ts-ignore
 import SchemaInfoViewer from '../../Schema/SchemaInfoViewer/SchemaInfoViewer';
+import {IndexInfoViewer} from '../../../../components/IndexInfoViewer/IndexInfoViewer';
 
 import type {EPathType} from '../../../../types/api/schema';
-import {isColumnEntityType, isTableType} from '../../utils/schema';
+import {isColumnEntityType, isTableType, mapPathTypeToNavigationTreeType} from '../../utils/schema';
 import {AutoFetcher} from '../../../../utils/autofetcher';
 //@ts-ignore
 import {getSchema} from '../../../../store/reducers/schema';
@@ -112,11 +113,24 @@ function Overview(props: OverviewProps) {
         );
     };
 
+    const renderContent = () => {
+        switch (mapPathTypeToNavigationTreeType(props.type)) {
+            case 'index':
+                return (
+                    <IndexInfoViewer data={schemaData} />
+                );
+            default:
+                return (
+                    <SchemaInfoViewer fullPath={currentItem.Path} data={schemaData} />
+                );
+        }
+    }
+
     return loading && !wasLoaded ? (
         renderLoader()
     ) : (
         <div className={props.className}>
-            <SchemaInfoViewer fullPath={currentItem.Path} data={schemaData} />
+            {renderContent()}
         </div>
     );
 }

src/types/api/schema.ts

@@ -54,6 +54,8 @@ interface TPathDescription {
 
     ColumnStoreDescription?: unknown;
     ColumnTableDescription?: unknown;
+
+    TableIndex?: TIndexDescription;
 }
 
 interface TDirEntry {
@@ -80,6 +82,27 @@ interface TDirEntry {
     Version?: TPathVersion;
 }
 
+export interface TIndexDescription {
+    Name?: string;
+    /** uint64 */
+    LocalPathId?: string;
+
+    Type?: EIndexType;
+    State?: EIndexState;
+
+    KeyColumnNames?: string[];
+
+    /** uint64 */
+    SchemaVersion?: string;
+
+    /** uint64 */
+    PathOwnerId?: string;
+
+    DataColumnNames?: string[];
+    /** uint64 */
+    DataSize?: string;
+}
+
 // incomplete
 export enum EPathType {
     EPathTypeInvalid = 'EPathTypeInvalid',
@@ -112,6 +135,19 @@ enum EPathState {
     EPathStateMoving = 'EPathStateMoving',
 }
 
+enum EIndexType {
+    EIndexTypeInvalid = 'EIndexTypeInvalid',
+    EIndexTypeGlobal = 'EIndexTypeGlobal',
+    EIndexTypeGlobalAsync = 'EIndexTypeGlobalAsync',
+}
+
+enum EIndexState {
+    EIndexStateInvalid = 'EIndexStateInvalid',
+    EIndexStateReady = 'EIndexStateReady',
+    EIndexStateNotReady = 'EIndexStateNotReady',
+    EIndexStateWriteOnly = 'EIndexStateWriteOnly',
+}
+
 // incomplete
 interface TPathVersion {
     /** uint64 */