ydb-embedded-ui 4.8.2 → 4.10.0

package/dist/store/reducers/storage/storage.ts

@@ -0,0 +1,191 @@
+import type {Reducer} from 'redux';
+import _ from 'lodash';
+
+import {NodesUptimeFilterValues} from '../../../utils/nodes';
+import '../../../services/api';
+
+import {createRequestActionTypes, createApiRequest} from '../../utils';
+
+import type {StorageAction, StorageState, StorageType, VisibleEntities} from './types';
+import {VISIBLE_ENTITIES, STORAGE_TYPES} from './constants';
+
+export const FETCH_STORAGE = createRequestActionTypes('storage', 'FETCH_STORAGE');
+
+const SET_INITIAL = 'storage/SET_INITIAL';
+const SET_FILTER = 'storage/SET_FILTER';
+const SET_USAGE_FILTER = 'storage/SET_USAGE_FILTER';
+const SET_VISIBLE_GROUPS = 'storage/SET_VISIBLE_GROUPS';
+const SET_STORAGE_TYPE = 'storage/SET_STORAGE_TYPE';
+const SET_NODES_UPTIME_FILTER = 'storage/SET_NODES_UPTIME_FILTER';
+const SET_DATA_WAS_NOT_LOADED = 'storage/SET_DATA_WAS_NOT_LOADED';
+
+const initialState = {
+    loading: true,
+    wasLoaded: false,
+    filter: '',
+    usageFilter: [],
+    visible: VISIBLE_ENTITIES.missing,
+    nodesUptimeFilter: NodesUptimeFilterValues.All,
+    type: STORAGE_TYPES.groups,
+};
+
+const storage: Reducer<StorageState, StorageAction> = (state = initialState, action) => {
+    switch (action.type) {
+        case FETCH_STORAGE.REQUEST: {
+            return {
+                ...state,
+                loading: true,
+            };
+        }
+        case FETCH_STORAGE.SUCCESS: {
+            return {
+                ...state,
+                nodes: action.data.nodes,
+                groups: action.data.groups,
+                loading: false,
+                wasLoaded: true,
+                error: undefined,
+            };
+        }
+        case FETCH_STORAGE.FAILURE: {
+            if (action.error?.isCancelled) {
+                return state;
+            }
+
+            return {
+                ...state,
+                error: action.error,
+                loading: false,
+                wasLoaded: true,
+            };
+        }
+        case SET_INITIAL: {
+            return {
+                ...initialState,
+            };
+        }
+        case SET_FILTER: {
+            return {
+                ...state,
+                filter: action.data,
+            };
+        }
+        case SET_USAGE_FILTER: {
+            return {
+                ...state,
+                usageFilter: action.data,
+            };
+        }
+        case SET_VISIBLE_GROUPS: {
+            return {
+                ...state,
+                visible: action.data,
+                wasLoaded: false,
+                error: undefined,
+            };
+        }
+
+        case SET_NODES_UPTIME_FILTER: {
+            return {
+                ...state,
+                nodesUptimeFilter: action.data,
+            };
+        }
+        case SET_STORAGE_TYPE: {
+            return {
+                ...state,
+                type: action.data,
+                filter: '',
+                usageFilter: [],
+                wasLoaded: false,
+                error: undefined,
+            };
+        }
+        case SET_DATA_WAS_NOT_LOADED: {
+            return {
+                ...state,
+                wasLoaded: false,
+            };
+        }
+        default:
+            return state;
+    }
+};
+
+export function getStorageInfo(
+    {
+        tenant,
+        visibleEntities,
+        nodeId,
+        type,
+    }: {
+        tenant?: string;
+        visibleEntities?: VisibleEntities;
+        nodeId?: string;
+        type?: StorageType;
+    },
+    {concurrentId}: {concurrentId?: string} = {},
+) {
+    if (type === STORAGE_TYPES.nodes) {
+        return createApiRequest({
+            request: window.api.getNodes({tenant, visibleEntities, type: 'static'}, {concurrentId}),
+            actions: FETCH_STORAGE,
+            dataHandler: (data) => ({nodes: data}),
+        });
+    }
+
+    return createApiRequest({
+        request: window.api.getStorageInfo({tenant, visibleEntities, nodeId}, {concurrentId}),
+        actions: FETCH_STORAGE,
+        dataHandler: (data) => ({groups: data}),
+    });
+}
+
+export function setInitialState() {
+    return {
+        type: SET_INITIAL,
+    } as const;
+}
+
+export function setStorageType(value: StorageType) {
+    return {
+        type: SET_STORAGE_TYPE,
+        data: value,
+    } as const;
+}
+
+export function setStorageTextFilter(value: string) {
+    return {
+        type: SET_FILTER,
+        data: value,
+    } as const;
+}
+
+export function setUsageFilter(value: string[]) {
+    return {
+        type: SET_USAGE_FILTER,
+        data: value,
+    } as const;
+}
+
+export function setVisibleEntities(value: VisibleEntities) {
+    return {
+        type: SET_VISIBLE_GROUPS,
+        data: value,
+    } as const;
+}
+
+export function setNodesUptimeFilter(value: NodesUptimeFilterValues) {
+    return {
+        type: SET_NODES_UPTIME_FILTER,
+        data: value,
+    } as const;
+}
+
+export const setDataWasNotLoaded = () => {
+    return {
+        type: SET_DATA_WAS_NOT_LOADED,
+    } as const;
+};
+
+export default storage;

package/dist/store/reducers/storage/types.ts

@@ -0,0 +1,92 @@
+import type {IResponseError} from '../../../types/api/error';
+import type {TNodesInfo, TSystemStateInfo} from '../../../types/api/nodes';
+import type {TPDiskStateInfo} from '../../../types/api/pdisk';
+import type {
+    TBSGroupStateInfo,
+    THiveStorageGroupStats,
+    TStorageInfo,
+} from '../../../types/api/storage';
+import type {ValueOf} from '../../../types/common';
+import type {NodesUptimeFilterValues} from '../../../utils/nodes';
+import type {ApiRequestAction} from '../../utils';
+
+import {STORAGE_TYPES, VISIBLE_ENTITIES} from './constants';
+import {
+    FETCH_STORAGE,
+    setDataWasNotLoaded,
+    setInitialState,
+    setNodesUptimeFilter,
+    setStorageTextFilter,
+    setStorageType,
+    setUsageFilter,
+    setVisibleEntities,
+} from './storage';
+
+export type VisibleEntities = ValueOf<typeof VISIBLE_ENTITIES>;
+export type StorageType = ValueOf<typeof STORAGE_TYPES>;
+
+export interface PreparedStorageNode extends TSystemStateInfo {
+    NodeId: number;
+    PDisks: TPDiskStateInfo[] | undefined;
+
+    Missing: number;
+    Uptime: string;
+}
+
+export type RawStorageGroup = TBSGroupStateInfo & THiveStorageGroupStats;
+
+export interface PreparedStorageGroup extends RawStorageGroup {
+    PoolName: string | undefined;
+
+    Read: number;
+    Write: number;
+    Used: number;
+    Limit: number;
+    Missing: number;
+    UsedSpaceFlag: number;
+    Type: string | null;
+}
+
+export interface UsageFilter {
+    threshold: number;
+    count: number;
+}
+
+export interface StorageApiRequestParams {
+    tenant?: string;
+    nodeId?: string;
+    visibleEntities?: VisibleEntities;
+}
+
+export interface StorageState {
+    loading: boolean;
+    wasLoaded: boolean;
+    filter: string;
+    usageFilter: string[];
+    visible: VisibleEntities;
+    nodesUptimeFilter: NodesUptimeFilterValues;
+    type: StorageType;
+    nodes?: TNodesInfo;
+    groups?: TStorageInfo;
+    error?: IResponseError;
+}
+
+type GetStorageInfoApiRequestAction = ApiRequestAction<
+    typeof FETCH_STORAGE,
+    {nodes?: TNodesInfo; groups?: TStorageInfo},
+    IResponseError
+>;
+
+export type StorageAction =
+    | GetStorageInfoApiRequestAction
+    | ReturnType<typeof setInitialState>
+    | ReturnType<typeof setStorageType>
+    | ReturnType<typeof setStorageTextFilter>
+    | ReturnType<typeof setUsageFilter>
+    | ReturnType<typeof setVisibleEntities>
+    | ReturnType<typeof setNodesUptimeFilter>
+    | ReturnType<typeof setDataWasNotLoaded>;
+
+export interface StorageStateSlice {
+    storage: StorageState;
+}

package/dist/store/reducers/tenants/selectors.ts

@@ -0,0 +1,46 @@
+import {Selector, createSelector} from 'reselect';
+import {escapeRegExp} from 'lodash';
+
+import {EFlag} from '../../../types/api/enums';
+
+import type {RootState} from '..';
+import type {ProblemFilterValue} from '../settings/types';
+import {ProblemFilterValues, selectProblemFilter} from '../settings/settings';
+
+import type {PreparedTenant, TenantsStateSlice} from './types';
+
+// ==== Filters ====
+
+const filterTenantsByProblems = (tenants: PreparedTenant[], problemFilter: ProblemFilterValue) => {
+    if (problemFilter === ProblemFilterValues.ALL) {
+        return tenants;
+    }
+
+    return tenants.filter((tenant) => {
+        return tenant.Overall && tenant.Overall !== EFlag.Green;
+    });
+};
+
+const filteredTenantsBySearch = (tenants: PreparedTenant[], searchQuery: string) => {
+    return tenants.filter((item) => {
+        const re = new RegExp(escapeRegExp(searchQuery), 'i');
+        return re.test(item.Name) || re.test(item.controlPlaneName);
+    });
+};
+
+// ==== Simple selectors ====
+
+export const selectTenants = (state: TenantsStateSlice) => state.tenants.tenants;
+export const selectTenantsSearchValue = (state: TenantsStateSlice) => state.tenants.searchValue;
+
+// ==== Complex selectors ====
+
+export const selectFilteredTenants: Selector<RootState, PreparedTenant[]> = createSelector(
+    [selectTenants, selectProblemFilter, selectTenantsSearchValue],
+    (tenants, problemFilter, searchQuery) => {
+        let result = filterTenantsByProblems(tenants, problemFilter);
+        result = filteredTenantsBySearch(result, searchQuery);
+
+        return result;
+    },
+);

package/dist/store/reducers/tenants/tenants.ts

@@ -4,10 +4,13 @@ import '../../../services/api';
 import {createRequestActionTypes, createApiRequest} from '../../utils';
 
 import type {TenantsAction, TenantsState} from './types';
+import {prepareTenants} from './utils';
 
 export const FETCH_TENANTS = createRequestActionTypes('tenants', 'FETCH_TENANTS');
 
-const initialState = {loading: true, wasLoaded: false};
+const SET_SEARCH_VALUE = 'tenants/SET_SEARCH_VALUE';
+
+const initialState = {loading: true, wasLoaded: false, searchValue: '', tenants: []};
 
 const tenants: Reducer<TenantsState, TenantsAction> = (state = initialState, action) => {
     switch (action.type) {
@@ -33,6 +36,12 @@ const tenants: Reducer<TenantsState, TenantsAction> = (state = initialState, act
                 loading: false,
             };
         }
+        case SET_SEARCH_VALUE: {
+            return {
+                ...state,
+                searchValue: action.data,
+            };
+        }
         default:
             return state;
     }
@@ -45,22 +54,20 @@ export function getTenantsInfo(clusterName?: string) {
         dataHandler: (response, getState) => {
             const {singleClusterMode} = getState();
 
-            if (singleClusterMode) {
-                return response.TenantInfo;
-            } else {
-                return response.TenantInfo?.map((tenant) => {
-                    const node = tenant.Nodes ? tenant.Nodes[0] : {};
-                    const address =
-                        node.Host && node.Endpoints
-                            ? node.Endpoints.find((endpoint) => endpoint.Name === 'http-mon')
-                                  ?.Address
-                            : undefined;
-                    const backend = node.Host ? `${node.Host}${address ? address : ''}` : undefined;
-                    return {...tenant, backend};
-                });
+            if (!response.TenantInfo) {
+                return [];
             }
+
+            return prepareTenants(response.TenantInfo, singleClusterMode);
         },
     });
 }
 
+export const setSearchValue = (value: string) => {
+    return {
+        type: SET_SEARCH_VALUE,
+        data: value,
+    } as const;
+};
+
 export default tenants;

package/dist/store/reducers/tenants/types.ts

@@ -1,17 +1,32 @@
-import {FETCH_TENANTS} from './tenants';
+import {FETCH_TENANTS, setSearchValue} from './tenants';
 
 import type {TTenant} from '../../../types/api/tenant';
+import type {IResponseError} from '../../../types/api/error';
 import type {ApiRequestAction} from '../../utils';
 
 export interface PreparedTenant extends TTenant {
-    backend?: string;
+    backend: string | undefined;
+    sharedTenantName: string | undefined;
+    controlPlaneName: string;
+    cpu: number;
+    memory: number;
+    storage: number;
+    nodesCount: number;
+    groupsCount: number;
 }
 
 export interface TenantsState {
     loading: boolean;
     wasLoaded: boolean;
-    tenants?: PreparedTenant[];
-    error?: unknown;
+    searchValue: string;
+    tenants: PreparedTenant[];
+    error?: IResponseError;
 }
 
-export type TenantsAction = ApiRequestAction<typeof FETCH_TENANTS, PreparedTenant[], unknown>;
+export type TenantsAction =
+    | ApiRequestAction<typeof FETCH_TENANTS, PreparedTenant[], IResponseError>
+    | ReturnType<typeof setSearchValue>;
+
+export interface TenantsStateSlice {
+    tenants: TenantsState;
+}

package/dist/store/reducers/tenants/utils.ts

@@ -0,0 +1,68 @@
+import type {TTenant} from '../../../types/api/tenant';
+import {isNumeric} from '../../../utils/utils';
+
+const getControlPlaneValue = (tenant: TTenant) => {
+    const parts = tenant.Name.split('/');
+    const defaultValue = parts.length ? parts[parts.length - 1] : '—';
+    const controlPlaneName = tenant.ControlPlane?.name;
+
+    return controlPlaneName ?? defaultValue;
+};
+
+const getTenantBackend = (tenant: TTenant) => {
+    const node = tenant.Nodes ? tenant.Nodes[0] : {};
+    const address =
+        node.Host && node.Endpoints
+            ? node.Endpoints.find((endpoint) => endpoint.Name === 'http-mon')?.Address
+            : undefined;
+    return node.Host ? `${node.Host}${address ? address : ''}` : undefined;
+};
+
+const calculateTenantMetrics = (tenant: TTenant) => {
+    const {CoresUsed, MemoryUsed, StorageAllocatedSize, Metrics = {}} = tenant;
+
+    const cpuFromCores = isNumeric(CoresUsed) ? Number(CoresUsed) * 1_000_000 : undefined;
+    const cpuFromMetrics = isNumeric(Metrics.CPU) ? Number(Metrics.CPU) : undefined;
+
+    const cpu = cpuFromCores ?? cpuFromMetrics ?? 0;
+
+    const rawMemory = MemoryUsed ?? Metrics.Memory;
+    const rawStorage = StorageAllocatedSize ?? Metrics.Storage;
+
+    const memory = isNumeric(rawMemory) ? Number(rawMemory) : 0;
+    const storage = isNumeric(rawStorage) ? Number(rawStorage) : 0;
+
+    return {cpu, memory, storage};
+};
+
+const calculateTenantEntities = (tenant: TTenant) => {
+    const {StorageGroups, NodeIds} = tenant;
+
+    const nodesCount = NodeIds?.length ?? 0;
+    const groupsCount = isNumeric(StorageGroups) ? Number(StorageGroups) : 0;
+
+    return {nodesCount, groupsCount};
+};
+
+export const prepareTenants = (tenants: TTenant[], useNodeAsBackend: boolean) => {
+    return tenants.map((tenant) => {
+        const backend = useNodeAsBackend ? getTenantBackend(tenant) : undefined;
+        const sharedTenantName = tenants.find((item) => item.Id === tenant.ResourceId)?.Name;
+        const controlPlaneName = getControlPlaneValue(tenant);
+        const {cpu, memory, storage} = calculateTenantMetrics(tenant);
+        const {nodesCount, groupsCount} = calculateTenantEntities(tenant);
+
+        return {
+            ...tenant,
+
+            backend,
+            sharedTenantName,
+            controlPlaneName,
+            cpu,
+            memory,
+            storage,
+            nodesCount,
+            groupsCount,
+        };
+    });
+};

package/dist/types/additionalProps.ts

@@ -1,4 +1,7 @@
+import type {ReactNode} from 'react';
+
 import type {InfoViewerItem} from '../components/InfoViewer';
+import type {ETenantType} from './api/tenant';
 import type {VersionToColorMap} from './versions';
 
 export interface AdditionalVersionsProps {
@@ -14,3 +17,8 @@ export interface AdditionalClusterProps {
     info?: InfoViewerItem[];
     links?: ClusterLink[];
 }
+
+export interface AdditionalTenantsProps {
+    prepareTenantBackend?: (backend: string | undefined) => string | undefined;
+    getMonitoringLink?: (name: string, type: ETenantType) => ReactNode;
+}

package/dist/types/api/storage.ts

@@ -57,7 +57,7 @@ export interface TBSGroupStateInfo {
     Encryption?: boolean;
 }
 
-interface THiveStorageGroupStats {
+export interface THiveStorageGroupStats {
     GroupID?: number;
     /** uint64 */
     AcquiredUnits?: string;

package/dist/types/store/query.ts

@@ -1,3 +1,5 @@
+import {QUERY_ACTIONS, QUERY_MODES} from '../../utils/query';
+
 import type {NetworkError} from '../api/error';
 import type {
     KeyValueRow,
@@ -7,6 +9,7 @@ import type {
     QueryPlan,
     TKqpStatsQuery,
 } from '../api/query';
+import type {ValueOf} from '../common';
 
 export interface IQueryResult {
     result?: KeyValueRow[];
@@ -23,12 +26,8 @@ export interface QueryRequestParams {
 
 export type QueryError = NetworkError | ErrorResponse;
 
-export enum QueryModes {
-    scan = 'scan',
-    script = 'script',
-    data = 'data',
-    query = 'query',
-}
+export type QueryAction = ValueOf<typeof QUERY_ACTIONS>;
+export type QueryMode = ValueOf<typeof QUERY_MODES>;
 
 export interface SavedQuery {
     name: string;

package/dist/types/store/topic.ts

@@ -1,12 +1,12 @@
 import {FETCH_TOPIC, cleanTopicData, setDataWasNotLoaded} from '../../store/reducers/topic';
 import type {ApiRequestAction} from '../../store/utils';
-import type {IProcessSpeedStats} from '../../utils/bytesParsers';
+import type {ProcessSpeedStats} from '../../utils/bytesParsers';
 import type {IResponseError} from '../api/error';
 import type {DescribeTopicResult} from '../api/topic';
 
 export interface IPreparedConsumerData {
     name: string | undefined;
-    readSpeed: IProcessSpeedStats;
+    readSpeed: ProcessSpeedStats;
 
     writeLag: number;
     readLag: number;
@@ -19,7 +19,7 @@ export interface IPreparedTopicStats {
     partitionsWriteLag: number;
     partitionsIdleTime: number;
 
-    writeSpeed: IProcessSpeedStats;
+    writeSpeed: ProcessSpeedStats;
 }
 
 export interface ITopicState {

package/dist/utils/bytesParsers/__test__/formatBytes.test.ts

@@ -0,0 +1,38 @@
+import {formatBytes} from '../formatBytes';
+
+describe('formatBytes', () => {
+    it('should work with only value', () => {
+        expect(formatBytes({value: 100})).toBe('100 B');
+        expect(formatBytes({value: 100_000})).toBe('100 KB');
+        expect(formatBytes({value: 100_000_000})).toBe('100 MB');
+        expect(formatBytes({value: 100_000_000_000})).toBe('100 GB');
+        expect(formatBytes({value: 100_000_000_000_000})).toBe('100 TB');
+    });
+    it('should convert to size', () => {
+        expect(formatBytes({value: 100_000, size: 'b'})).toBe('100,000 B');
+        expect(formatBytes({value: 100_000_000_000_000, size: 'gb'})).toBe('100,000 GB');
+    });
+    it('should convert without labels', () => {
+        expect(formatBytes({value: 100_000, size: 'b', withSizeLabel: false})).toBe('100,000');
+        expect(formatBytes({value: 100_000_000_000_000, size: 'gb', withSizeLabel: false})).toBe(
+            '100,000',
+        );
+    });
+    it('should convert to speed', () => {
+        expect(formatBytes({value: 100_000, withSpeedLabel: true})).toBe('100 KB/s');
+        expect(formatBytes({value: 100_000, size: 'b', withSpeedLabel: true})).toBe('100,000 B/s');
+    });
+    it('should return fixed amount of significant digits', () => {
+        expect(formatBytes({value: 99_000, significantDigits: 2})).toEqual('99,000 B');
+        expect(formatBytes({value: 100_000, significantDigits: 2})).toEqual('100 KB');
+        expect(formatBytes({value: 99_000_000_000_000, significantDigits: 2})).toEqual('99,000 GB');
+        expect(formatBytes({value: 100_000_000_000_000, significantDigits: 2})).toEqual('100 TB');
+    });
+    it('shoudl return empty string on invalid data', () => {
+        expect(formatBytes({value: undefined})).toEqual('');
+        expect(formatBytes({value: null})).toEqual('');
+        expect(formatBytes({value: ''})).toEqual('');
+        expect(formatBytes({value: 'false'})).toEqual('');
+        expect(formatBytes({value: '123qwe'})).toEqual('');
+    });
+});

package/dist/utils/bytesParsers/convertBytesObjectToSpeed.ts

@@ -2,7 +2,7 @@ import type {MultipleWindowsStat} from '../../types/api/consumer';
 
 import {DAY_IN_SECONDS, HOUR_IN_SECONDS, MINUTE_IN_SECONDS} from '../constants';
 
-export interface IProcessSpeedStats {
+export interface ProcessSpeedStats {
     perMinute: number;
     perHour: number;
     perDay: number;
@@ -14,7 +14,7 @@ export interface IProcessSpeedStats {
  */
 export const convertBytesObjectToSpeed = (
     data: MultipleWindowsStat | undefined,
-): IProcessSpeedStats => {
+): ProcessSpeedStats => {
     return {
         perMinute:
             data && data.per_minute ? Math.round(Number(data.per_minute) / MINUTE_IN_SECONDS) : 0,