@ytsaurus/ui 0.0.3

package/src/ui/utils/navigation/tabs/tables.js

@@ -0,0 +1,360 @@
+import ypath from '../../../common/thor/ypath';
+import {getStorePreloadValues} from '../../../utils/navigation/tabs/tablets';
+import {DESC_ASC_UNORDERED} from '../../sort-helpers';
+
+export const tableItems = {
+    name_tablet_id: {
+        caption: 'Node / Tablet id',
+        sort(item) {
+            return item.name;
+        },
+    },
+    name_cell_id: {
+        caption: 'Cell id / Tablet id',
+        sort(item) {
+            return item.name;
+        },
+    },
+    index: {
+        sort: true,
+        caption: 'Tablet index',
+        align: 'left',
+        get(tablet) {
+            return Number(ypath.getValue(tablet, '/index'));
+        },
+    },
+    tablet_id: {
+        sort: true,
+        align: 'left',
+        get(tablet) {
+            return ypath.getValue(tablet, '/tablet_id');
+        },
+    },
+    cell_leader_address: {
+        sort: true,
+        align: 'left',
+        caption: 'Node',
+        get(item) {
+            return ypath.getValue(item, '/cell_leader_address');
+        },
+    },
+    state: {
+        sort: true,
+        align: 'center',
+        get(tablet) {
+            return ypath.getValue(tablet, '/state');
+        },
+    },
+    cell_id: {
+        sort: true,
+        align: 'left',
+        get(tablet) {
+            return ypath.getValue(tablet, '/cell_id');
+        },
+    },
+    error_count: {
+        sort: true,
+        align: 'center',
+        get(tablet) {
+            return ypath.getNumber(tablet, '/error_count', NaN);
+        },
+        allowedOrderTypes: DESC_ASC_UNORDERED,
+        overall: 'sum',
+    },
+    replication_error_count: {
+        sort: true,
+        align: 'center',
+        get(tablet) {
+            return ypath.getNumber(tablet, '/replication_error_count', NaN);
+        },
+        allowedOrderTypes: DESC_ASC_UNORDERED,
+        overall: 'sum',
+    },
+    pivot_key: {
+        sort: false,
+        align: 'left',
+        caption: 'Pivot Key',
+        get(tablet) {
+            return ypath.getValue(tablet, '/pivot_key');
+        },
+    },
+    // Structure
+    chunk_count: {
+        sort: true,
+        align: 'right',
+        overall: 'sum',
+        get(tablet) {
+            return Number(ypath.getValue(tablet, '/statistics/chunk_count'));
+        },
+        allowedOrderTypes: DESC_ASC_UNORDERED,
+    },
+    partition_count: {
+        sort: true,
+        align: 'right',
+        overall: 'sum',
+        get(tablet) {
+            return Number(ypath.getValue(tablet, '/statistics/partition_count'));
+        },
+        allowedOrderTypes: DESC_ASC_UNORDERED,
+    },
+    store_count: {
+        sort: true,
+        align: 'right',
+        overall: 'sum',
+        get(tablet) {
+            return Number(ypath.getValue(tablet, '/statistics/store_count'));
+        },
+        allowedOrderTypes: DESC_ASC_UNORDERED,
+    },
+    overlapping_store_count: {
+        sort: true,
+        align: 'right',
+        overall: 'max',
+        get(tablet) {
+            return Number(ypath.getValue(tablet, '/statistics/overlapping_store_count'));
+        },
+        allowedOrderTypes: DESC_ASC_UNORDERED,
+    },
+    store_preload: {
+        align: 'center',
+        sort(tablet) {
+            const storePreload = getStorePreloadValues(tablet);
+            const completed = storePreload.completed;
+            const failed = storePreload.failed;
+            const pending = storePreload.pending;
+            const total = completed + failed + pending;
+
+            return [total > 0 ? completed / total : 0, total > 0 ? failed / total : 0, total];
+        },
+        overall(aggregation, tablet, name) {
+            const aggregatedStorePreload = (aggregation[name] = aggregation[name] || {
+                completed: 0,
+                failed: 0,
+                pending: 0,
+            });
+            const currentStorePreload = tablet[name];
+
+            aggregatedStorePreload.completed += currentStorePreload.completed;
+            aggregatedStorePreload.failed += currentStorePreload.failed;
+            aggregatedStorePreload.pending += currentStorePreload.pending;
+        },
+        get(tablet) {
+            return getStorePreloadValues(tablet);
+        },
+        allowedOrderTypes: DESC_ASC_UNORDERED,
+    },
+    // Data
+    unmerged_row_count: {
+        sort: true,
+        align: 'center',
+        overall: 'sum',
+        get(tablet) {
+            return Number(ypath.getValue(tablet, '/statistics/unmerged_row_count'));
+        },
+        allowedOrderTypes: DESC_ASC_UNORDERED,
+    },
+    uncompressed_data_size: {
+        sort: true,
+        align: 'center',
+        overall: 'sum',
+        get(tablet) {
+            return Number(ypath.getValue(tablet, '/statistics/uncompressed_data_size'));
+        },
+        allowedOrderTypes: DESC_ASC_UNORDERED,
+    },
+    compressed_data_size: {
+        sort: true,
+        align: 'center',
+        overall: 'sum',
+        get(tablet) {
+            return Number(ypath.getValue(tablet, '/statistics/compressed_data_size'));
+        },
+        allowedOrderTypes: DESC_ASC_UNORDERED,
+    },
+    disk_space: {
+        sort: true,
+        align: 'center',
+        overall: 'sum',
+        get(tablet) {
+            return Number(ypath.getValue(tablet, '/statistics/disk_space'));
+        },
+        allowedOrderTypes: DESC_ASC_UNORDERED,
+    },
+    // Performance
+    static_chunk: {
+        group: true,
+        items: {
+            read: {
+                sort: true,
+                align: 'right',
+                overall: 'sum',
+                get(tablet) {
+                    return Number(
+                        ypath.getValue(tablet, '/performance_counters/static_chunk_row_read_rate'),
+                    );
+                },
+                allowedOrderTypes: DESC_ASC_UNORDERED,
+            },
+            lookup: {
+                sort: true,
+                align: 'right',
+                overall: 'sum',
+                get(tablet) {
+                    return Number(
+                        ypath.getValue(
+                            tablet,
+                            '/performance_counters/static_chunk_row_lookup_rate',
+                        ),
+                    );
+                },
+                allowedOrderTypes: DESC_ASC_UNORDERED,
+            },
+        },
+        set: ['read', 'lookup'],
+    },
+    dynamic: {
+        group: true,
+        items: {
+            read: {
+                sort: true,
+                align: 'right',
+                overall: 'sum',
+                get(tablet) {
+                    return Number(
+                        ypath.getValue(tablet, '/performance_counters/dynamic_row_read_rate'),
+                    );
+                },
+                allowedOrderTypes: DESC_ASC_UNORDERED,
+            },
+            lookup: {
+                sort: true,
+                align: 'right',
+                overall: 'sum',
+                get(tablet) {
+                    return Number(
+                        ypath.getValue(tablet, '/performance_counters/dynamic_row_lookup_rate'),
+                    );
+                },
+                allowedOrderTypes: DESC_ASC_UNORDERED,
+            },
+            write: {
+                sort: true,
+                align: 'right',
+                overall: 'sum',
+                get(tablet) {
+                    return Number(
+                        ypath.getValue(tablet, '/performance_counters/dynamic_row_write_rate'),
+                    );
+                },
+                allowedOrderTypes: DESC_ASC_UNORDERED,
+            },
+            delete: {
+                sort: true,
+                align: 'right',
+                overall: 'sum',
+                get(tablet) {
+                    return Number(
+                        ypath.getValue(tablet, '/performance_counters/dynamic_row_delete_rate'),
+                    );
+                },
+                allowedOrderTypes: DESC_ASC_UNORDERED,
+            },
+        },
+        set: ['read', 'lookup', 'write', 'delete'],
+    },
+    unmerged_row_read_rate: {
+        sort: true,
+        align: 'right',
+        overall: 'sum',
+        get(tablet) {
+            return Number(ypath.getValue(tablet, '/performance_counters/unmerged_row_read_rate'));
+        },
+        allowedOrderTypes: DESC_ASC_UNORDERED,
+    },
+    merged_row_read_rate: {
+        sort: true,
+        align: 'right',
+        overall: 'sum',
+        get(tablet) {
+            return Number(ypath.getValue(tablet, '/performance_counters/merged_row_read_rate'));
+        },
+        allowedOrderTypes: DESC_ASC_UNORDERED,
+    },
+    actions: {
+        align: 'right',
+        caption: '',
+    },
+};
+
+export const histogramItems = {
+    unmerged_row_count: {
+        format: 'Number',
+    },
+    uncompressed_data_size: {
+        dataName: 'bytes',
+        format: 'Bytes',
+    },
+    compressed_data_size: {
+        dataName: 'bytes',
+        format: 'Bytes',
+    },
+    store_count: {
+        format: 'Number',
+    },
+    partition_count: {
+        format: 'Number',
+    },
+    chunk_count: {
+        format: 'Number',
+    },
+    static_chunk_read: {
+        dataName: 'rows/s',
+        format: 'Number',
+        get(tablet) {
+            return tableItems['static_chunk'].items['read'].get(tablet);
+        },
+    },
+    static_chunk_lookup: {
+        dataName: 'rows/s',
+        format: 'Number',
+        get(tablet) {
+            return tableItems['static_chunk'].items['lookup'].get(tablet);
+        },
+    },
+    unmerged_row_read_rate: {
+        dataName: 'rows/s',
+        format: 'Number',
+    },
+    merged_row_read_rate: {
+        dataName: 'rows/s',
+        format: 'Number',
+    },
+    dynamic_row_read_rate: {
+        dataName: 'rows/s',
+        format: 'Number',
+        get(tablet) {
+            return tableItems['dynamic'].items['read'].get(tablet);
+        },
+    },
+    dynamic_row_lookup_rate: {
+        dataName: 'rows/s',
+        format: 'Number',
+        get(tablet) {
+            return tableItems['dynamic'].items['lookup'].get(tablet);
+        },
+    },
+    dynamic_row_write_rate: {
+        dataName: 'rows/s',
+        format: 'Number',
+        get(tablet) {
+            return tableItems['dynamic'].items['write'].get(tablet);
+        },
+    },
+    dynamic_row_delete_rate: {
+        dataName: 'rows/s',
+        format: 'Number',
+        get(tablet) {
+            return tableItems['dynamic'].items['delete'].get(tablet);
+        },
+    },
+};

package/src/ui/utils/navigation/tabs/tablets.js

@@ -0,0 +1,50 @@
+import _ from 'lodash';
+import ypath from '../../../common/thor/ypath';
+import hammer from '../../../common/hammer';
+import {tableItems} from '../../../utils/navigation/tabs/tables';
+
+function prepareFlatColumns(columns, flatColumns = {}, prefix) {
+    const correctPrefix = prefix ? prefix + '_' : '';
+
+    _.each(columns, (column, columnName) => {
+        if (column.group) {
+            prepareFlatColumns(column.items, flatColumns, columnName);
+        } else {
+            const flatColumnName = correctPrefix + columnName;
+            flatColumns[flatColumnName] = column;
+        }
+    });
+
+    return flatColumns;
+}
+
+export function prepareDataForColumns(collection) {
+    const preparedColumns = prepareFlatColumns(tableItems);
+
+    return _.map(collection, (item) => {
+        return _.mapValues(preparedColumns, (column) => {
+            return typeof column.get === 'function' ? column.get(item) : undefined;
+        });
+    });
+}
+
+export function prepareAggregation(preparedCollection) {
+    let preparedColumns = _.map(prepareFlatColumns(tableItems), (column, columnName) => ({
+        name: columnName,
+        type: column.overall,
+    }));
+    preparedColumns = _.filter(preparedColumns, 'type');
+
+    const aggregation = hammer.aggregation.prepare(preparedCollection, preparedColumns)[0];
+    aggregation['index'] = 'aggregation';
+
+    return aggregation;
+}
+
+export function getStorePreloadValues(tablet) {
+    return {
+        completed: Number(ypath.getValue(tablet, '/statistics/preload_completed_store_count')),
+        failed: Number(ypath.getValue(tablet, '/statistics/preload_failed_store_count')),
+        pending: Number(ypath.getValue(tablet, '/statistics/preload_pending_store_count')),
+    };
+}

package/src/ui/utils/operations/detail.js

@@ -0,0 +1,128 @@
+import ypath from '../../common/thor/ypath';
+import metrics from '../../common/utils/metrics';
+import yt from '@ytsaurus/javascript-wrapper/lib/yt';
+import _ from 'lodash';
+import {PLEASE_PROCEED_TEXT} from '../../utils/actions';
+import {hasTaskHistograms} from './jobs';
+
+function isTransactionAlive(transactionId) {
+    return yt.v3.exists({path: '#' + transactionId}).then(
+        (flag) => flag,
+        () => false,
+    );
+}
+
+export function checkUserTransaction(operationAttributes) {
+    const transactionId = operationAttributes.user_transaction_id?.$value;
+    return Promise.all(
+        transactionId && transactionId !== '0-0-0-0'
+            ? [Promise.resolve(operationAttributes), isTransactionAlive(transactionId)]
+            : [Promise.resolve(operationAttributes), Promise.resolve(false)],
+    );
+}
+
+export function performAction({updateOperation, operation, currentOption, options, name}) {
+    const option = _.find(options, (option) => option.value === currentOption);
+    let parameters = {operation_id: operation.$value};
+    if (option?.data?.parameters) {
+        parameters = {...parameters, ...option.data.parameters};
+    }
+
+    metrics.countEvent({
+        operation_detail_action: name,
+    });
+
+    return yt.v3[name + 'Operation'](parameters).then(updateOperation);
+}
+
+export function getDetailsTabsShowSettings(operation, statisticsItems) {
+    const progress = ypath.getValue(operation, '/@progress');
+    const showJobSizes =
+        hasTaskHistograms(operation) ||
+        (progress &&
+            (ypath.getValue(progress, '/estimated_input_data_size_histogram') ||
+                ypath.getValue(progress, '/input_data_size_histogram')));
+    const showPartitionSizes = progress && ypath.getValue(progress, '/partition_size_histogram');
+
+    return {
+        statistics: {
+            show: statisticsItems?.length > 0,
+        },
+        job_sizes: {
+            show: Boolean(showJobSizes),
+        },
+        partition_sizes: {
+            show: Boolean(showPartitionSizes),
+        },
+    };
+}
+
+export function prepareActions(operation) {
+    const actions = [];
+    const suspended = ypath.getBoolean(operation, '/@suspended');
+    const state = operation.state;
+
+    if (state !== 'completed' && state !== 'failed' && state !== 'aborted') {
+        actions.push({
+            modalKey: 'abort',
+            name: 'abort',
+            successMessage: 'Operation was successfully aborted',
+            icon: 'stop-circle',
+            message:
+                "Operation will be aborted with all running jobs, this will cause losing some jobs' data. Are you sure you want to proceed?",
+            confirmationText: PLEASE_PROCEED_TEXT,
+        });
+    }
+
+    if (state === 'running') {
+        actions.push({
+            modalKey: 'complete',
+            name: 'complete',
+            successMessage: 'Operation was successfully completed',
+            icon: 'check-circle',
+            message:
+                "Operation will be immediately completed. Running jobs will be aborted, this will cause losing some jobs' data. Are you sure you want to proceed?",
+            confirmationText: PLEASE_PROCEED_TEXT,
+        });
+
+        if (suspended) {
+            actions.push({
+                modalKey: 'resume',
+                name: 'resume',
+                details: 'Operation will be resumed.',
+                successMessage: 'Operation was successfully resumed',
+                icon: 'play-circle',
+                theme: 'action',
+            });
+        } else {
+            actions.push({
+                modalKey: 'suspend',
+                name: 'suspend',
+                details: 'Operation will be suspended.',
+                successMessage: 'Operation was successfully suspended',
+                icon: 'pause-circle',
+                optionMessage: 'Running jobs strategy',
+                optionValue: 'abort',
+                optionType: 'radio',
+                options: [
+                    {
+                        data: {
+                            parameters: {abort_running_jobs: true},
+                        },
+                        value: 'abort',
+                        text: 'Abort running jobs',
+                    },
+                    {
+                        data: {
+                            parameters: {},
+                        },
+                        value: 'retain',
+                        text: 'Retain running jobs',
+                    },
+                ],
+            });
+        }
+    }
+
+    return actions;
+}

package/src/ui/utils/operations/jobs.ts

@@ -0,0 +1,12 @@
+import _ from 'lodash';
+import ypath from '../../common/thor/ypath';
+
+export function hasTaskHistograms(operation: unknown) {
+    const tasks = ypath.getValue(operation, '/@progress/tasks');
+    return _.some(tasks, ({estimated_input_data_weight_histogram, input_data_weight_histogram}) => {
+        return (
+            !_.isEmpty(estimated_input_data_weight_histogram) ||
+            !_.isEmpty(input_data_weight_histogram)
+        );
+    });
+}

package/src/ui/utils/operations/list.js

@@ -0,0 +1,10 @@
+export function isOperationId(value) {
+    const idSection = '[0-9a-fA-F]{1,8}';
+    const idRegexp = new RegExp(`^${idSection}-${idSection}-${idSection}-${idSection}$`);
+    return idRegexp.test(value);
+}
+
+export function isGotoEnabled(value) {
+    const aliasRegexp = new RegExp('^\\*[0-9a-zA-Z_-]+$');
+    return isOperationId(value) || aliasRegexp.test(value);
+}

package/src/ui/utils/operations/tabs/details/alerts.ts

@@ -0,0 +1,18 @@
+import {docsUrl} from '../../../../config';
+import _ from 'lodash';
+import UIFactory from '../../../../UIFactory';
+
+export function prepareFaqUrl(type: string) {
+    return docsUrl(UIFactory.docsUrls['faq:alert_type'] + type.replace(/_/g, ''));
+}
+
+export function prepareAlerts(alerts?: Record<string, unknown>) {
+    if (alerts) {
+        return _.map(alerts, (error, type) => ({
+            error: error,
+            helpURL: prepareFaqUrl(type),
+        }));
+    }
+
+    return undefined;
+}

package/src/ui/utils/operations/tabs/details/data-flow.js

@@ -0,0 +1,121 @@
+import _ from 'lodash';
+import ypath from '../../../../common/thor/ypath';
+
+function prepareGraphData(operation) {
+    if (hasProgressTasks(operation)) {
+        return prepareGraphDataByTasks(operation);
+    }
+
+    const dataFlowGraph = ypath.getValue(operation, '/@progress/data_flow_graph');
+    const jobTypeOrder = ypath.getValue(dataFlowGraph, '/topological_ordering');
+    const statistics = ypath.getValue(dataFlowGraph, '/edges');
+
+    const data = [];
+
+    if (dataFlowGraph) {
+        _.each(jobTypeOrder, (fromJobType) => {
+            _.each(statistics[fromJobType], (value, toJobType) => {
+                data.push({
+                    from: fromJobType,
+                    to: toJobType,
+                    value: value.statistics,
+                });
+            });
+        });
+    }
+
+    return data;
+}
+
+function prepareGraphDataByTasks(operation) {
+    const dataFlow = ypath.getValue(operation, '/@progress/data_flow');
+    const tasks = ypath.getValue(operation, '/@progress/tasks');
+
+    const res = _.reduce(
+        dataFlow,
+        (acc, item) => {
+            const {
+                source_name: from,
+                target_name: to,
+                job_data_statistics,
+                teleport_data_statistics,
+            } = item;
+            acc.push({
+                from,
+                to,
+                info: item,
+                value: _.keys(job_data_statistics).reduce((acc, key) => {
+                    const jobStat = ypath.getValue(job_data_statistics[key]);
+                    const teleportStat = ypath.getValue(teleport_data_statistics[key]);
+                    acc[key] = jobStat + teleportStat;
+                    return acc;
+                }, {}),
+                job_data_statistics: isEmptyStatistics(job_data_statistics)
+                    ? null
+                    : job_data_statistics,
+                teleport_data_statistics: isEmptyStatistics(teleport_data_statistics)
+                    ? null
+                    : teleport_data_statistics,
+            });
+            return acc;
+        },
+        [],
+    );
+
+    const tasksIndexMap = _.reduce(
+        tasks,
+        (acc, {task_name}, index) => {
+            acc[task_name] = index;
+            return acc;
+        },
+        {},
+    );
+
+    return _.sortBy(res, ({from}) => {
+        if (from === 'input') {
+            return -1;
+        }
+        return tasksIndexMap[from];
+    });
+}
+
+function isEmptyStatistics(stats) {
+    return !_.some(stats, (value) => {
+        return Boolean(ypath.getValue(value));
+    });
+}
+
+export function prepareCompletedUsage(operation) {
+    const progress = ypath.getValue(operation, '/@progress');
+
+    if (progress) {
+        let statistics = [];
+
+        const estimatedInputStatistics = ypath.getValue(
+            operation,
+            '/@progress/estimated_input_statistics',
+        );
+
+        if (estimatedInputStatistics) {
+            statistics.push({
+                name: 'Estimated input',
+                value: estimatedInputStatistics,
+            });
+        }
+
+        statistics = statistics.concat(prepareGraphData(operation));
+
+        return statistics;
+    }
+}
+
+export function prepareIntermediateUsage(operation, intermediate) {
+    return _.map(intermediate, (resources, account) => ({
+        ...resources,
+        account,
+    }));
+}
+
+export function hasProgressTasks(operation) {
+    return ypath.getValue(operation, '/@progress/tasks');
+}