ydb-embedded-ui 3.1.0 → 3.2.0

package/dist/types/api/enums.ts

@@ -1,6 +1,6 @@
 // Shows system status
-// Currently is used in response types of viewer/json/nodes and viewer/json/storage
-// Probably will appear in /viewer/json/tenantinfo /viewer/json/cluster /viewer/json/tabletinfo /viewer/json/compute
+// Currently is used in response types viewer/json/ storage, nodes, compute
+// pdiskinfo, vdiskinfo, tabletinfo, tenantinfo
 export enum EFlag {
     Grey = 'Grey',
     Green = 'Green',

package/dist/types/api/nodes.ts

@@ -2,6 +2,9 @@ import {EFlag} from './enums';
 import {TPDiskStateInfo} from './pdisk';
 import {TTabletStateInfo} from './tablet';
 
+// endpoint: /viewer/json/nodes
+// source: https://github.com/ydb-platform/ydb/blob/main/ydb/core/viewer/protos/viewer.proto
+
 export interface TNodesInfo {
     Overall: EFlag;
     Nodes?: TNodeInfo[];
@@ -64,12 +67,12 @@ export interface TPoolStats {
     Threads?: number;
 }
 
-interface TEndpoint {
+export interface TEndpoint {
     Name?: string;
     Address?: string;
 }
 
-interface TLegacyNodeLocation {
+export interface TLegacyNodeLocation {
     DataCenter?: number;
     Room?: number;
     Rack?: number;

package/dist/types/api/pdisk.ts

@@ -1,5 +1,8 @@
 import {EFlag} from './enums';
 
+// endpoint: /viewer/json/pdiskinfo
+// source: https://github.com/ydb-platform/ydb/blob/main/ydb/core/protos/node_whiteboard.proto
+
 export interface TPDiskStateInfo {
     PDiskId?: number;
     /** uint64 */

package/dist/types/api/schema.ts

@@ -37,6 +37,7 @@ enum EStatus {
     StatusResourceExhausted = 'StatusResourceExhausted',
 }
 
+// source: https://github.com/ydb-platform/ydb/blob/main/ydb/core/protos/flat_scheme_op.proto
 // incomplete interface, only currently used fields are covered
 export interface TPathDescription {
     /** info about the path itself */

package/dist/types/api/storage.ts

@@ -1,6 +1,37 @@
 import {EFlag} from './enums';
 import {TVDiskStateInfo} from './vdisk';
 
+// endpoint: /viewer/json/storage
+// source: https://github.com/ydb-platform/ydb/blob/main/ydb/core/viewer/protos/viewer.proto
+
+export interface TStorageInfo {
+    Overall?: EFlag;
+    StoragePools?: TStoragePoolInfo[];
+    /** uint64 */
+    TotalGroups?: string;
+    /** uint64 */
+    FoundGroups?: string;
+}
+
+interface TStoragePoolInfo {
+    Overall?: EFlag;
+    Name?: string;
+    Kind?: string;
+    Groups?: (TBSGroupStateInfo & THiveStorageGroupStats)[];
+    /** uint64 */
+    AcquiredUnits?: string;
+    AcquiredIOPS?: number;
+    /** uint64 */
+    AcquiredThroughput?: string;
+    /** uint64 */
+    AcquiredSize?: string;
+    MaximumIOPS?: number;
+    /** uint64 */
+    MaximumThroughput?: string;
+    /** uint64 */
+    MaximumSize?: string;
+}
+
 export interface TBSGroupStateInfo {
     GroupID?: number;
     ErasureSpecies?: string;
@@ -43,31 +74,3 @@ interface THiveStorageGroupStats {
     /** uint64 */
     AvailableSize?: string;
 }
-
-interface TStoragePoolInfo {
-    Overall?: EFlag;
-    Name?: string;
-    Kind?: string;
-    Groups?: (TBSGroupStateInfo & THiveStorageGroupStats)[];
-    /** uint64 */
-    AcquiredUnits?: string;
-    AcquiredIOPS?: number;
-    /** uint64 */
-    AcquiredThroughput?: string;
-    /** uint64 */
-    AcquiredSize?: string;
-    MaximumIOPS?: number;
-    /** uint64 */
-    MaximumThroughput?: string;
-    /** uint64 */
-    MaximumSize?: string;
-}
-
-export interface TStorageInfo {
-    Overall?: EFlag;
-    StoragePools?: TStoragePoolInfo[];
-    /** uint64 */
-    TotalGroups?: string;
-    /** uint64 */
-    FoundGroups?: string;
-}

package/dist/types/api/tablet.ts

@@ -1,5 +1,21 @@
 import {EFlag} from './enums';
 
+// endpoint: /viewer/json/tabletinfo
+// source: https://github.com/ydb-platform/ydb/blob/main/ydb/core/protos/sys_view.proto
+
+export interface TEvTabletStateResponse {
+    TabletStateInfo?: TTabletStateInfo[];
+
+    /** uint64 */
+    ResponseTime?: string;
+    /** uint64 */
+    ResponseDuration?: string;
+    /** uint64 */
+    ProcessDuration?: string;
+
+    Packed5?: unknown;
+}
+
 export interface TTabletStateInfo {
     /** uint64 */
     TabletId?: string;
@@ -37,7 +53,7 @@ interface TDomainKey {
     PathId?: string;
 }
 
-enum EType {
+export enum EType {
     'Unknown' = 'Unknown',
     'OldSchemeShard' = 'OldSchemeShard',
     'OldDataShard' = 'OldDataShard',
@@ -79,7 +95,7 @@ enum EType {
     'TypeInvalid' = 'TypeInvalid',
 }
 
-enum ETabletState {
+export enum ETabletState {
     'Created' = 'Created',
     'ResolveStateStorage' = 'ResolveStateStorage',
     'Candidate' = 'Candidate',

package/dist/types/api/tenant.ts

@@ -2,6 +2,9 @@ import {EFlag} from './enums';
 import {TPoolStats, TSystemStateInfo} from './nodes';
 import {TTabletStateInfo} from './tablet';
 
+// endpoint: /viewer/json/tenantinfo
+// source: https://github.com/ydb-platform/ydb/blob/main/ydb/core/viewer/protos/viewer.proto
+
 export interface TTenants {
     Tenants?: TTenant[];
 }
@@ -51,7 +54,7 @@ interface THiveDomainStatsStateCount {
     Count?: number;
 }
 
-interface TMetrics {
+export interface TMetrics {
     /** uint64 */
     CPU?: string;
     /** uint64 */

package/dist/types/api/topic.ts

@@ -0,0 +1,157 @@
+/* eslint-disable camelcase */
+
+import {Consumer, Entry, MultipleWindowsStat, PartitionStats, SupportedCodecs} from './consumer';
+
+/**
+ * endpoint: /json/describe_topic
+ *
+ * source: https://github.com/ydb-platform/ydb/blob/main/ydb/public/api/protos/ydb_topic.proto
+ *
+ * Original proto file doesn't specify optional fields, so every field is considered optional
+ */
+export interface DescribeTopicResult {
+    /** Description of scheme object. */
+    self?: Entry;
+
+    /** Settings for partitioning */
+    partitioning_settings?: PartitioningSettings;
+
+    /** Partitions description. */
+    partitions?: PartitionInfo[];
+
+    // Retention settings.
+    // Currently, only one limit may be set, so other should not be set.
+
+    /**
+     * google.protobuf.Duration
+     *
+     * How long data in partition should be stored.
+     */
+    retention_period?: string;
+
+    /**
+     * int64
+     *
+     * How much data in partition should be stored.
+     * Zero value means infinite limit.
+     */
+    retention_storage_mb?: string;
+
+    /**
+     * List of allowed codecs for writers.
+     * Writes with codec not from this list are forbidden.
+     */
+    supported_codecs?: SupportedCodecs;
+
+    /**
+     * int64
+     *
+     * Partition write speed in bytes per second.
+     * Zero value means default limit: 1 MB per second.
+     */
+    partition_write_speed_bytes_per_second?: string;
+
+    /**
+     * int64
+     *
+     * Burst size for write in partition, in bytes.
+     * Zero value means default limit: 1 MB.
+     */
+    partition_write_burst_bytes?: string;
+
+    /** User and server attributes of topic. Server attributes starts from "_" and will be validated by server. */
+    attributes?: Record<string, string>;
+
+    /** List of consumers for this topic. */
+    consumers?: Consumer[];
+
+    /** Metering settings. */
+    metering_mode?: MeteringMode;
+
+    /** Statistics of topic. */
+    topic_stats?: TopicStats;
+}
+
+/** Partition info types differs for consumer and topic, although they are very similar */
+interface PartitionInfo {
+    /** int64  */
+    partition_id?: string;
+
+    /** Is partition open for write. */
+    active?: boolean;
+
+    /**
+     * int64
+     *
+     * Ids of partitions which was formed when this partition was split or merged.
+     */
+    child_partition_ids?: string;
+
+    /**
+     * int64
+     *
+     * Ids of partitions from which this partition was formed by split or merge.
+     */
+    parent_partition_ids?: string;
+
+    /** Stats for partition, filled only when include_stats in request is true. */
+    partition_stats?: PartitionStats;
+}
+
+interface TopicStats {
+    /**
+     * int64
+     *
+     * Approximate size of topic.
+     */
+    store_size_bytes?: string;
+
+    /**
+     * google.protobuf.Timestamp
+     *
+     * Minimum of timestamps of last write among all partitions.
+     */
+    min_last_write_time?: string;
+
+    /**
+     * google.protobuf.Duration
+     *
+     * Maximum of differences between write timestamp and create timestamp for all messages, written during last minute.
+     */
+    max_write_time_lag?: string;
+
+    /** How much bytes were written statistics. */
+    bytes_written?: MultipleWindowsStat;
+}
+
+/** Partitioning settings for topic. */
+interface PartitioningSettings {
+    /**
+     * int64
+     *
+     * Minimum partition count auto merge would stop working at.
+     *
+     * Zero value means default - 1.
+     */
+    min_active_partitions?: string;
+
+    /**
+     * int64
+     *
+     * Limit for total partition count, including active (open for write) and read-only partitions.
+     *
+     * Zero value means default - 100.
+     */
+    partition_count_limit?: string;
+}
+
+enum MeteringMode {
+    /** Use default */
+    METERING_MODE_UNSPECIFIED = 'METERING_MODE_UNSPECIFIED',
+
+    /** Metering based on resource reservation */
+    METERING_MODE_RESERVED_CAPACITY = 'METERING_MODE_RESERVED_CAPACITY',
+
+    /** Metering based on actual consumption. Default. */
+    METERING_MODE_REQUEST_UNITS = 'METERING_MODE_REQUEST_UNITS',
+}

package/dist/types/api/vdisk.ts

@@ -1,6 +1,9 @@
 import {EFlag} from './enums';
 import {TPDiskStateInfo} from './pdisk';
 
+// endpoint: /viewer/json/vdiskinfo
+// source: https://github.com/ydb-platform/ydb/blob/main/ydb/core/protos/node_whiteboard.proto
+
 export interface TVDiskStateInfo {
     VDiskId?: TVDiskID;
     /** uint64 */

package/dist/types/store/executeTopQueries.ts

@@ -0,0 +1,29 @@
+import {FETCH_TOP_QUERIES, setTopQueriesState, setTopQueriesFilters} from '../../store/reducers/executeTopQueries';
+import type {ApiRequestAction} from '../../store/utils';
+import type {IResponseError} from '../api/error';
+import type {IQueryResult} from './query';
+
+export interface ITopQueriesFilters {
+    /** ms from epoch */
+    from?: number;
+    /** ms from epoch */
+    to?: number;
+    text?: string;
+}
+
+export interface ITopQueriesState {
+    loading: boolean;
+    wasLoaded: boolean;
+    data?: IQueryResult;
+    error?: IResponseError;
+    filters: ITopQueriesFilters;
+}
+
+export type ITopQueriesAction =
+    | ApiRequestAction<typeof FETCH_TOP_QUERIES, IQueryResult, IResponseError>
+    | ReturnType<typeof setTopQueriesState>
+    | ReturnType<typeof setTopQueriesFilters>;
+
+export interface ITopQueriesRootStateSlice {
+    executeTopQueries: ITopQueriesState;
+}

package/dist/types/store/schema.ts

@@ -25,9 +25,9 @@ export interface ISchemaState {
 }
 
 export interface ISchemaHandledResponse {
-    path: string | undefined;
-    currentSchema: TEvDescribeSchemeResult | undefined;
-    data: ISchemaData | undefined;
+    path?: string;
+    currentSchema?: TEvDescribeSchemeResult;
+    data?: ISchemaData;
 }
 
 type ISchemaApiRequestAction = ApiRequestAction<

package/dist/types/store/shardsWorkload.ts

@@ -1,4 +1,4 @@
-import {SEND_SHARD_QUERY, setShardQueryOptions, setTopShardFilters} from '../../store/reducers/shardsWorkload';
+import {SEND_SHARD_QUERY, setShardsState, setShardsQueryFilters} from '../../store/reducers/shardsWorkload';
 import type {ApiRequestAction} from '../../store/utils';
 import type {IResponseError} from '../api/error';
 import type {IQueryResult} from './query';
@@ -20,8 +20,8 @@ export interface IShardsWorkloadState {
 
 export type IShardsWorkloadAction =
     | ApiRequestAction<typeof SEND_SHARD_QUERY, IQueryResult, IResponseError>
-    | ReturnType<typeof setShardQueryOptions>
-    | ReturnType<typeof setTopShardFilters>;
+    | ReturnType<typeof setShardsState>
+    | ReturnType<typeof setShardsQueryFilters>;
 
 export interface IShardsWorkloadRootStateSlice {
     shardsWorkload: IShardsWorkloadState;

package/dist/types/store/tablets.ts

@@ -0,0 +1,42 @@
+import type {ApiRequestAction} from '../../store/utils';
+import {
+    clearWasLoadingFlag,
+    FETCH_TABLETS,
+    setStateFilter,
+    setTypeFilter,
+} from '../../store/reducers/tablets';
+
+import type {IResponseError} from '../api/error';
+import type {TEvTabletStateResponse, EType, ETabletState} from '../api/tablet';
+
+export interface ITabletsState {
+    loading: boolean;
+    wasLoaded: boolean;
+    stateFilter: ETabletState[];
+    typeFilter: EType[];
+    data?: TEvTabletStateResponse;
+    error?: IResponseError;
+}
+
+export interface ITabletsApiRequestParams {
+    nodes?: string[];
+    path?: string;
+}
+
+type ITabletsApiRequestAction = ApiRequestAction<
+    typeof FETCH_TABLETS,
+    TEvTabletStateResponse,
+    IResponseError
+>;
+
+export type ITabletsAction =
+    | ITabletsApiRequestAction
+    | (
+          | ReturnType<typeof clearWasLoadingFlag>
+          | ReturnType<typeof setStateFilter>
+          | ReturnType<typeof setTypeFilter>
+      );
+
+export interface ITabletsRootStateSlice {
+    tablets: ITabletsState;
+}

package/dist/utils/getNodesColumns.js

@@ -41,7 +41,7 @@ export function getNodesColumns({showTooltip, hideTooltip, tabletsPath, getNodeR
                             className={b('host-name')}
                         />
                         {nodeRef && (
-                            <Button size="s" href={nodeRef} className={b('external-button')}>
+                            <Button size="s" href={nodeRef} className={b('external-button')} target="_blank">
                                 <Icon name="external" />
                             </Button>
                         )}
@@ -58,6 +58,13 @@ export function getNodesColumns({showTooltip, hideTooltip, tabletsPath, getNodeR
             render: ({value}) => (value ? value : '—'),
             width: '60px',
         },
+        {
+            name: 'Rack',
+            header: 'Rack',
+            align: DataTable.LEFT,
+            render: ({value}) => (value ? value : '—'),
+            width: '80px',
+        },
         {
             name: 'Version',
             width: '200px',

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "ydb-embedded-ui",
-  "version": "3.1.0",
+  "version": "3.2.0",
   "files": [
     "dist"
   ],
@@ -12,7 +12,7 @@
     "@gravity-ui/axios-wrapper": "^1.3.0",
     "@gravity-ui/i18n": "^1.0.0",
     "@yandex-cloud/paranoid": "^1.3.0",
-    "@yandex-cloud/react-data-table": "0.2.1",
+    "@yandex-cloud/react-data-table": "^1.0.2",
     "axios": "0.19.2",
     "bem-cn-lite": "4.0.0",
     "history": "4.10.1",
@@ -37,7 +37,7 @@
     "reselect": "4.1.6",
     "sass": "1.32.8",
     "web-vitals": "1.1.2",
-    "ydb-ui-components": "3.0.1"
+    "ydb-ui-components": "^3.0.2"
   },
   "scripts": {
     "start": "react-app-rewired start",

package/dist/containers/Tenant/Diagnostics/TopQueries/TopQueries.js

@@ -1,188 +0,0 @@
-import React from 'react';
-import PropTypes from 'prop-types';
-import cn from 'bem-cn-lite';
-import {connect} from 'react-redux';
-import DataTable from '@yandex-cloud/react-data-table';
-import {Loader} from '@gravity-ui/uikit';
-
-import {changeUserInput} from '../../../../store/reducers/executeQuery';
-import {sendQuery, setQueryOptions} from '../../../../store/reducers/executeTopQueries';
-import TruncatedQuery from '../../../../components/TruncatedQuery/TruncatedQuery';
-import {AutoFetcher} from '../../../../utils/autofetcher';
-import {isColumnEntityType} from '../../utils/schema';
-
-import {DEFAULT_TABLE_SETTINGS} from '../../../../utils/constants';
-import {TenantGeneralTabsIds} from '../../TenantPages';
-import {prepareQueryError} from '../../../../utils/query';
-
-import './TopQueries.scss';
-
-const b = cn('kv-top-queries');
-
-const MAX_QUERY_HEIGHT = 10;
-const COLUMNS = [
-    {
-        name: 'CPUTimeUs',
-        width: 140,
-        sortAccessor: (row) => Number(row['CPUTimeUs']),
-    },
-    {
-        name: 'QueryText',
-        width: 500,
-        sortable: false,
-        // eslint-disable-next-line
-        render: ({value}) => <TruncatedQuery value={value} maxQueryHeight={MAX_QUERY_HEIGHT} />,
-    },
-];
-const getQueryText = (path) => `
---!syntax_v1
-$last = (
-    SELECT
-        MAX(IntervalEnd)
-    FROM \`${path}/.sys/top_queries_by_cpu_time_one_hour\`
-);
-SELECT
-    CPUTime as CPUTimeUs,
-    QueryText
-FROM \`${path}/.sys/top_queries_by_cpu_time_one_hour\`
-WHERE IntervalEnd IN $last
-`;
-
-class TopQueries extends React.Component {
-    static propTypes = {
-        error: PropTypes.string,
-        sendQuery: PropTypes.func,
-        path: PropTypes.string,
-        data: PropTypes.array,
-        loading: PropTypes.bool,
-        wasLoaded: PropTypes.bool,
-        changeSchemaTab: PropTypes.func,
-        currentSchema: PropTypes.object,
-        type: PropTypes.string,
-        className: PropTypes.string,
-    };
-
-    autofetcher;
-
-    componentDidMount() {
-        this.autofetcher = new AutoFetcher();
-        this.getTopQueries();
-        if (this.props.autorefresh) {
-            this.autofetcher.start();
-            this.autofetcher.fetch(() => this.getTopQueries());
-        }
-    }
-
-    componentDidUpdate(prevProps) {
-        const {autorefresh, path, setQueryOptions} = this.props;
-
-        if (autorefresh && !prevProps.autorefresh) {
-            this.getTopQueries();
-            this.autofetcher.start();
-            this.autofetcher.fetch(() => this.getTopQueries());
-        }
-        if (!autorefresh && prevProps.autorefresh) {
-            this.autofetcher.stop();
-        }
-
-        if (path !== prevProps.path) {
-            setQueryOptions({
-                wasLoaded: false,
-                data: undefined,
-            });
-            this.getTopQueries();
-        }
-    }
-
-    componentWillUnmount() {
-        this.autofetcher.stop();
-    }
-
-    renderLoader = () => {
-        return (
-            <div className={b('loader')}>
-                <Loader size="m" />
-            </div>
-        );
-    };
-
-    getTopQueries() {
-        const {path} = this.props;
-        const query = getQueryText(path);
-        this.props.sendQuery({query, database: path, action: 'execute-scan'});
-    }
-
-    onRowClick = (row) => {
-        const {QueryText: input} = row;
-        const {changeUserInput, changeSchemaTab} = this.props;
-
-        changeUserInput({input});
-        changeSchemaTab(TenantGeneralTabsIds.query);
-    };
-
-    renderTable = () => {
-        const {data} = this.props;
-
-        if (!data) {
-            return null;
-        }
-
-        return (
-            <DataTable
-                columns={COLUMNS}
-                data={data}
-                settings={DEFAULT_TABLE_SETTINGS}
-                onRowClick={this.onRowClick}
-            />
-        );
-    };
-
-    renderResult = () => {
-        return (
-            <div className={b('table-wrapper')}>
-                <div className={b('table-content')}>{this.renderTable()}</div>
-            </div>
-        );
-    };
-
-    render() {
-        const {error, loading, data, type, className, wasLoaded} = this.props;
-
-        let message;
-
-        if (isColumnEntityType(type)) {
-            message = 'No data';
-        } else if (error && !error.isCancelled) {
-            message = prepareQueryError(error).slice(0, 300);
-        } else if (!loading && !data) {
-            message = 'No data';
-        }
-
-        return loading && !wasLoaded ? (
-            this.renderLoader()
-        ) : (
-            <div className={b()}>
-                <div className={b('result', className)}>{message || this.renderResult()}</div>
-            </div>
-        );
-    }
-}
-const mapStateToProps = (state) => {
-    const {loading, data = {}, error, wasLoaded} = state.executeTopQueries;
-    const {autorefresh} = state.schema;
-    return {
-        loading,
-        data: data.result,
-        error,
-        wasLoaded,
-        autorefresh,
-    };
-};
-
-const mapDispatchToProps = {
-    sendQuery,
-    changeUserInput,
-    setQueryOptions,
-};
-
-export default connect(mapStateToProps, mapDispatchToProps)(TopQueries);