ydb-embedded-ui 4.9.0 → 4.10.1

package/dist/containers/Storage/Storage.js

@@ -1,350 +0,0 @@
-import React from 'react';
-import PropTypes from 'prop-types';
-import {connect} from 'react-redux';
-import cn from 'bem-cn-lite';
-import DataTable from '@gravity-ui/react-data-table';
-
-import {Search} from '../../components/Search';
-import {UsageFilter} from './UsageFilter';
-import {AutoFetcher} from '../../utils/autofetcher';
-import {NodesUptimeFilterValues} from '../../utils/nodes';
-import {TableSkeleton} from '../../components/TableSkeleton/TableSkeleton';
-import {UptimeFilter} from '../../components/UptimeFIlter';
-import {AccessDenied} from '../../components/Errors/403';
-import {EntitiesCount} from '../../components/EntitiesCount';
-
-import {
-    getStorageInfo,
-    setInitialState,
-    getFilteredEntities,
-    setVisibleEntities,
-    setStorageFilter,
-    setUsageFilter,
-    setStorageType,
-    setNodesUptimeFilter,
-    setDataWasNotLoaded,
-    getStoragePoolsGroupsCount,
-    getStorageNodesCount,
-    getUsageFilterOptions,
-} from '../../store/reducers/storage/storage';
-import {VISIBLE_ENTITIES, STORAGE_TYPES} from '../../store/reducers/storage/constants';
-import {getNodesList, selectNodesMap} from '../../store/reducers/nodesList';
-import StorageGroups from './StorageGroups/StorageGroups';
-import StorageNodes from './StorageNodes/StorageNodes';
-import {DEFAULT_TABLE_SETTINGS} from '../../utils/constants';
-
-import {StorageTypeFilter} from './StorageTypeFilter/StorageTypeFilter';
-import {StorageVisibleEntityFilter} from './StorageVisibleEntityFilter/StorageVisibleEntityFilter';
-
-import './Storage.scss';
-
-const b = cn('global-storage');
-
-const tableSettings = {
-    ...DEFAULT_TABLE_SETTINGS,
-    defaultOrder: DataTable.DESCENDING,
-};
-
-class Storage extends React.Component {
-    static propTypes = {
-        loading: PropTypes.bool,
-        error: PropTypes.object,
-        wasLoaded: PropTypes.bool,
-        autorefresh: PropTypes.bool,
-        database: PropTypes.bool,
-        getStorageInfo: PropTypes.func,
-        setInitialState: PropTypes.func,
-        flatListStorageEntities: PropTypes.array,
-        groupsCount: PropTypes.object,
-        nodesCount: PropTypes.object,
-        setStorageFilter: PropTypes.func,
-        setVisibleEntities: PropTypes.func,
-        visibleEntities: PropTypes.string,
-        tenant: PropTypes.string,
-        nodeId: PropTypes.string,
-        nodesUptimeFilter: PropTypes.string,
-        setNodesUptimeFilter: PropTypes.func,
-        setDataWasNotLoaded: PropTypes.func,
-        additionalNodesInfo: PropTypes.object,
-    };
-
-    componentDidMount() {
-        const {tenant, nodeId, setVisibleEntities, storageType, getNodesList} = this.props;
-
-        this.autofetcher = new AutoFetcher();
-        getNodesList();
-        if (tenant || nodeId) {
-            setVisibleEntities(VISIBLE_ENTITIES.all);
-            this.getStorageInfo({
-                type: storageType,
-            });
-        } else {
-            this.getStorageInfo({
-                visibleEntities: VISIBLE_ENTITIES.missing,
-                type: storageType,
-            });
-            this.autofetcher.fetch(() =>
-                this.getStorageInfo({
-                    visibleEntities: VISIBLE_ENTITIES.missing,
-                    type: storageType,
-                }),
-            );
-        }
-    }
-
-    componentDidUpdate(prevProps) {
-        const {visibleEntities, storageType, autorefresh, database, tenant, setDataWasNotLoaded} =
-            this.props;
-
-        const startFetch = () => {
-            this.getStorageInfo({
-                visibleEntities,
-                type: storageType,
-            });
-        };
-
-        const restartAutorefresh = () => {
-            this.autofetcher.stop();
-            this.autofetcher.start();
-            this.autofetcher.fetch(() =>
-                this.getStorageInfo({
-                    visibleEntities,
-                    type: storageType,
-                }),
-            );
-        };
-
-        if (database && !autorefresh && prevProps.autorefresh) {
-            this.autofetcher.stop();
-        }
-        if (database && autorefresh && !prevProps.autorefresh) {
-            startFetch();
-            restartAutorefresh();
-        }
-
-        if (
-            storageType !== prevProps.storageType ||
-            visibleEntities !== prevProps.visibleEntities
-        ) {
-            startFetch();
-
-            if (!database || (database && autorefresh)) {
-                restartAutorefresh();
-            }
-        }
-
-        if (tenant !== prevProps.tenant) {
-            setDataWasNotLoaded();
-            startFetch();
-            restartAutorefresh();
-        }
-    }
-
-    componentWillUnmount() {
-        this.autofetcher.stop();
-        this.props.setInitialState();
-    }
-
-    getStorageInfo(data) {
-        const {tenant, nodeId, getStorageInfo} = this.props;
-
-        getStorageInfo(
-            {
-                tenant,
-                nodeId,
-                ...data,
-            },
-            {
-                concurrentId: 'getStorageInfo',
-            },
-        );
-    }
-
-    renderLoader() {
-        return <TableSkeleton className={b('loader')} />;
-    }
-
-    renderDataTable() {
-        const {
-            flatListStorageEntities,
-            visibleEntities,
-            nodesUptimeFilter,
-            nodes,
-            storageType,
-            additionalNodesInfo,
-        } = this.props;
-
-        return (
-            <div className={b('table-wrapper')}>
-                {storageType === STORAGE_TYPES.groups && (
-                    <StorageGroups
-                        visibleEntities={visibleEntities}
-                        data={flatListStorageEntities}
-                        tableSettings={tableSettings}
-                        nodes={nodes}
-                        onShowAll={() => this.onGroupVisibilityChange(VISIBLE_ENTITIES.all)}
-                    />
-                )}
-                {storageType === STORAGE_TYPES.nodes && (
-                    <StorageNodes
-                        visibleEntities={visibleEntities}
-                        nodesUptimeFilter={nodesUptimeFilter}
-                        data={flatListStorageEntities}
-                        tableSettings={tableSettings}
-                        onShowAll={this.onShowAllNodes}
-                        additionalNodesInfo={additionalNodesInfo}
-                    />
-                )}
-            </div>
-        );
-    }
-
-    onGroupVisibilityChange = (value) => {
-        const {setVisibleEntities} = this.props;
-        setVisibleEntities(value);
-    };
-
-    onStorageTypeChange = (value) => {
-        const {setStorageType} = this.props;
-        setStorageType(value);
-    };
-
-    onUptimeFilterChange = (value) => {
-        this.props.setNodesUptimeFilter(value);
-    };
-
-    onShowAllNodes = () => {
-        this.onGroupVisibilityChange(VISIBLE_ENTITIES.all);
-        this.onUptimeFilterChange(NodesUptimeFilterValues.All);
-    };
-
-    renderEntitiesCount() {
-        const {storageType, groupsCount, nodesCount, flatListStorageEntities, loading, wasLoaded} =
-            this.props;
-
-        const entityName = storageType === STORAGE_TYPES.groups ? 'Groups' : 'Nodes';
-        const count = storageType === STORAGE_TYPES.groups ? groupsCount : nodesCount;
-
-        return (
-            <EntitiesCount
-                label={entityName}
-                loading={loading && !wasLoaded}
-                total={count.total}
-                current={flatListStorageEntities.length}
-            />
-        );
-    }
-
-    renderControls() {
-        const {
-            filter,
-            setStorageFilter,
-            visibleEntities,
-            storageType,
-            usageFilter,
-            nodesUptimeFilter,
-            setUsageFilter,
-            usageFilterOptions,
-        } = this.props;
-
-        return (
-            <div className={b('controls')}>
-                <div className={b('search')}>
-                    <Search
-                        placeholder={
-                            storageType === STORAGE_TYPES.groups
-                                ? 'Group ID, Pool name'
-                                : 'Node ID, FQDN'
-                        }
-                        onChange={setStorageFilter}
-                        value={filter}
-                    />
-                </div>
-
-                <StorageTypeFilter value={storageType} onChange={this.onStorageTypeChange} />
-                <StorageVisibleEntityFilter
-                    value={visibleEntities}
-                    onChange={this.onGroupVisibilityChange}
-                />
-
-                {storageType === STORAGE_TYPES.nodes && (
-                    <UptimeFilter value={nodesUptimeFilter} onChange={this.onUptimeFilterChange} />
-                )}
-
-                {storageType === STORAGE_TYPES.groups && (
-                    <UsageFilter
-                        value={usageFilter}
-                        onChange={setUsageFilter}
-                        groups={usageFilterOptions}
-                        disabled={usageFilterOptions.length === 0}
-                    />
-                )}
-                {this.renderEntitiesCount()}
-            </div>
-        );
-    }
-
-    render() {
-        const {loading, wasLoaded, error} = this.props;
-        const showLoader = loading && !wasLoaded;
-
-        if (error) {
-            if (error.status === 403) {
-                return <AccessDenied />;
-            }
-
-            return <div className={b()}>{error.statusText}</div>;
-        }
-
-        return (
-            <div className={b()}>
-                {this.renderControls()}
-                {showLoader ? this.renderLoader() : this.renderDataTable()}
-            </div>
-        );
-    }
-}
-
-function mapStateToProps(state) {
-    const {
-        loading,
-        wasLoaded,
-        error,
-        visible: visibleEntities,
-        type: storageType,
-        filter,
-        usageFilter,
-        nodesUptimeFilter,
-    } = state.storage;
-
-    return {
-        flatListStorageEntities: getFilteredEntities(state),
-        groupsCount: getStoragePoolsGroupsCount(state),
-        autorefresh: state.schema.autorefresh,
-        nodes: selectNodesMap(state),
-        nodesCount: getStorageNodesCount(state),
-        loading,
-        wasLoaded,
-        error,
-        visibleEntities,
-        storageType,
-        filter,
-        usageFilter,
-        nodesUptimeFilter,
-        usageFilterOptions: getUsageFilterOptions(state),
-    };
-}
-
-const mapDispatchToProps = {
-    getStorageInfo,
-    setInitialState,
-    setStorageFilter,
-    setUsageFilter,
-    setVisibleEntities: setVisibleEntities,
-    setNodesUptimeFilter,
-    getNodesList,
-    setStorageType,
-    setDataWasNotLoaded,
-};
-
-export default connect(mapStateToProps, mapDispatchToProps)(Storage);

package/dist/containers/Tenant/Preview/Preview.js

@@ -1,168 +0,0 @@
-import React from 'react';
-import PropTypes from 'prop-types';
-import {connect} from 'react-redux';
-import cn from 'bem-cn-lite';
-
-import {Loader, Button} from '@gravity-ui/uikit';
-
-import {Icon} from '../../../components/Icon';
-import Fullscreen from '../../../components/Fullscreen/Fullscreen';
-import {QueryResultTable} from '../../../components/QueryResultTable';
-
-import {sendQuery, setQueryOptions} from '../../../store/reducers/preview';
-import {prepareQueryError} from '../../../utils/query';
-
-import {isTableType} from '../utils/schema';
-import {AutoFetcher} from '../../../utils/autofetcher';
-import EnableFullscreenButton from '../../../components/EnableFullscreenButton/EnableFullscreenButton';
-import {setShowPreview} from '../../../store/reducers/schema/schema';
-
-import './Preview.scss';
-
-const b = cn('kv-preview');
-
-class Preview extends React.Component {
-    static propTypes = {
-        sendQuery: PropTypes.func,
-        database: PropTypes.string,
-        table: PropTypes.string,
-        error: PropTypes.string,
-        data: PropTypes.array,
-        loading: PropTypes.bool,
-        type: PropTypes.string,
-        partCount: PropTypes.string,
-    };
-
-    autofetcher;
-
-    componentDidMount() {
-        this.sendQueryForPreview();
-        this.autofetcher = new AutoFetcher();
-        if (this.props.autorefresh) {
-            this.autofetcher.start();
-            this.autofetcher.fetch(() => this.sendQueryForPreview());
-        }
-    }
-
-    componentDidUpdate(prevProps) {
-        const {table, autorefresh, setQueryOptions} = this.props;
-
-        if (prevProps.table !== table) {
-            this.sendQueryForPreview();
-            setQueryOptions({
-                wasLoaded: false,
-                data: undefined,
-            });
-        }
-
-        if (autorefresh && !prevProps.autorefresh) {
-            this.sendQueryForPreview();
-            this.autofetcher.start();
-            this.autofetcher.fetch(() => this.sendQueryForPreview());
-        }
-        if (!autorefresh && prevProps.autorefresh) {
-            this.autofetcher.stop();
-        }
-    }
-
-    componentWillUnmount() {
-        this.autofetcher.stop();
-    }
-
-    sendQueryForPreview = () => {
-        const {sendQuery, database, table, type} = this.props;
-
-        if (!isTableType(type)) {
-            return;
-        }
-
-        const query = `--!syntax_v1\nselect * from \`${table}\` limit 32`;
-        sendQuery({
-            query,
-            database: database,
-            action: 'execute-scan',
-            path: table,
-        });
-    };
-
-    onClosePreview = () => {
-        this.props.setShowPreview(false);
-    };
-
-    renderHeader = () => {
-        const {currentSchemaPath, error} = this.props;
-        return (
-            <div className={b('header')}>
-                <div className={b('title')}>
-                    Preview <div className={b('table-name')}>{currentSchemaPath}</div>
-                </div>
-                <div className={b('controls-left')}>
-                    <EnableFullscreenButton disabled={Boolean(error)} />
-                    <Button
-                        view="flat-secondary"
-                        onClick={this.onClosePreview}
-                        title="Close preview"
-                    >
-                        <Icon name="close" viewBox={'0 0 16 16'} width={16} height={16} />
-                    </Button>
-                </div>
-            </div>
-        );
-    };
-
-    render() {
-        const {error, loading, data, type, wasLoaded, isFullscreen} = this.props;
-
-        if (loading && !wasLoaded) {
-            return (
-                <div className={b('loader-container')}>
-                    <Loader size="m" />
-                </div>
-            );
-        }
-
-        let message;
-
-        if (!isTableType(type)) {
-            message = <div className={b('message-container')}>Not available</div>;
-        } else if (error) {
-            message = <div className={b('message-container')}>{prepareQueryError(error)}</div>;
-        }
-
-        const content = message ?? (
-            <div className={b('result')}>
-                <QueryResultTable data={data.result} columns={data.columns} />
-            </div>
-        );
-
-        return (
-            <div className={b()}>
-                {this.renderHeader()}
-                {isFullscreen ? <Fullscreen>{content}</Fullscreen> : content}
-            </div>
-        );
-    }
-}
-
-const mapStateToProps = (state) => {
-    const {data = {}, loading, error, wasLoaded} = state.preview;
-    const {autorefresh, currentSchemaPath} = state.schema;
-
-    return {
-        data,
-        loading,
-        error,
-        autorefresh,
-        wasLoaded,
-        currentSchemaPath,
-        isFullscreen: state.fullscreen,
-    };
-};
-
-const mapDispatchToProps = {
-    sendQuery,
-    setQueryOptions,
-    setShowPreview,
-};
-
-export default connect(mapStateToProps, mapDispatchToProps)(Preview);