ydb-embedded-ui 1.4.0 → 1.5.0

package/dist/containers/Tenant/Schema/SchemaNodeActions/SchemaNodeActions.tsx

@@ -1,125 +0,0 @@
-import {useDispatch} from 'react-redux';
-import {useHistory} from 'react-router';
-import cn from 'bem-cn-lite';
-import {DropdownMenu} from '@yandex-cloud/uikit';
-import qs from 'qs';
-
-import {changeUserInput} from '../../../../store/reducers/executeQuery';
-import {setShowPreview} from '../../../../store/reducers/schema';
-import routes, {createHref} from '../../../../routes';
-
-import './SchemaNodeActions.scss';
-import {TenantGeneralTabsIds, TenantTabsGroups} from '../../TenantPages';
-import createToast from '../../../../utils/createToast';
-
-const b = cn('kv-schema-node-actions');
-
-const createTableTemplate = (path: string) => {
-    return `CREATE TABLE \`${path}/my_table\`
-(
-    \`id\` Uint64,
-    \`name\` String,
-    PRIMARY KEY (\`id\`)
-);`;
-};
-
-const alterTableTemplate = (path: string) => {
-    return `ALTER TABLE \`${path}\`
-    ADD COLUMN is_deleted Bool;`;
-};
-const selectQueryTemplate = (path: string) => {
-    return `SELECT \`id\`, \`name\`
-    FROM \`${path}\`
-    ORDER BY \`id\`
-    LIMIT 10;`;
-};
-const upsertQueryTemplate = (path: string) => {
-    return `UPSERT INTO \`${path}\`
-    ( \`id\`, \`name\` )
-VALUES ( );`;
-};
-
-interface SchemaNodeActionsProps {
-    name: string;
-    isTableType: boolean;
-}
-
-function SchemaNodeActions({name, isTableType}: SchemaNodeActionsProps) {
-    const dispatch = useDispatch();
-    const history = useHistory();
-
-    const queryParams = qs.parse(location.search, {
-        ignoreQueryPrefix: true,
-    });
-
-    const onCreateTableClick = () => {
-        dispatch(changeUserInput({input: createTableTemplate(name)}));
-    };
-
-    const onAlterTableClick = () => {
-        dispatch(changeUserInput({input: alterTableTemplate(name)}));
-    };
-
-    const onSelectQueryClick = () => {
-        dispatch(changeUserInput({input: selectQueryTemplate(name)}));
-    };
-
-    const onUpsertQueryClick = () => {
-        dispatch(changeUserInput({input: upsertQueryTemplate(name)}));
-    };
-
-    const onCopyPathClick = () => {
-        navigator.clipboard
-            .writeText(name)
-            .then(() => {
-                createToast({
-                    name: 'Copied',
-                    title: 'Path was copied to clipboard successfully',
-                    type: 'success',
-                });
-            })
-            .catch(() => {
-                createToast({
-                    name: 'Not copied',
-                    title: 'Path was not copied to clipboard successfully',
-                    type: 'error',
-                });
-            });
-    };
-
-    const onOpenPreviewClick = () => {
-        dispatch(setShowPreview(true));
-        history.push(
-            createHref(routes.tenant, undefined, {
-                ...queryParams,
-                [TenantTabsGroups.general]: TenantGeneralTabsIds.query,
-            }),
-        );
-    };
-
-    const copyItem = {text: 'Copy path', action: onCopyPathClick};
-
-    const tableItems = [
-        [{text: 'Open preview', action: onOpenPreviewClick}, copyItem],
-        [
-            {text: 'Alter table', action: onAlterTableClick},
-            {text: 'Select query', action: onSelectQueryClick},
-            {text: 'Upsert query', action: onUpsertQueryClick},
-        ],
-    ];
-
-    const catalogItems = [[copyItem], [{text: 'Create table', action: onCreateTableClick}]];
-
-    const items = isTableType ? tableItems : catalogItems;
-
-    return (
-        <DropdownMenu
-            items={items}
-            switcherWrapperClassName={b()}
-            popupClassName={b('popup')}
-            popupPlacement={['bottom-end']}
-        />
-    );
-}
-
-export default SchemaNodeActions;

package/dist/containers/Tenant/Schema/SchemaTree/SchemaTree.js

@@ -1,116 +0,0 @@
-import React from 'react';
-import ReactDOM from 'react-dom';
-import cn from 'bem-cn-lite';
-import PropTypes from 'prop-types';
-import {connect} from 'react-redux';
-import {Loader} from '@yandex-cloud/uikit';
-import {getSchema} from '../../../../store/reducers/schema';
-import './SchemaTree.scss';
-
-import SchemaNode from '../SchemaNode/SchemaNode';
-
-const b = cn('schema');
-
-class SchemaTree extends React.Component {
-    static propTypes = {
-        className: PropTypes.string,
-        loading: PropTypes.bool,
-        error: PropTypes.object,
-        schema: PropTypes.object,
-        wasLoaded: PropTypes.bool,
-        getSchema: PropTypes.func,
-        path: PropTypes.string.isRequired,
-        tenantPath: PropTypes.string,
-    };
-
-    componentDidMount() {
-        const {path: tenantPath, getSchema} = this.props;
-
-        getSchema({path: tenantPath});
-    }
-
-    emptySchema = React.createRef();
-
-    renderLoader() {
-        return (
-            <div className={b('loader')}>
-                <Loader size="m" />
-            </div>
-        );
-    }
-
-    removeArrow = () => {
-        // And how else to solve this problem, except to get into the DOM?
-        const nodeWithArrow =
-            // eslint-disable-next-line react/no-find-dom-node
-            ReactDOM.findDOMNode(this)?.parentNode?.parentNode?.querySelector('.tree-view_arrow');
-        if (nodeWithArrow) {
-            nodeWithArrow.setAttribute('style', 'visibility: hidden');
-        }
-
-        return '';
-    };
-
-    showEmptyNode() {
-        const {tenantPath, schema} = this.props;
-        if (schema.Path === tenantPath) {
-            return 'no data';
-        } else {
-            return String(this.removeArrow());
-        }
-    }
-
-    renderContent = () => {
-        const {schema, path} = this.props;
-        if (schema && schema.Status === 'StatusSuccess') {
-            return (
-                <div className={b()}>
-                    {schema && schema.PathDescription && schema.PathDescription.Children ? (
-                        schema.PathDescription.Children.map((it, key) => (
-                            <SchemaNode key={key} fullPath={path} data={it} />
-                        ))
-                    ) : (
-                        <div ref={this.emptySchema}>{this.showEmptyNode()}</div>
-                    )}
-                </div>
-            );
-        } else {
-            return null;
-        }
-    };
-
-    render() {
-        const {loading, wasLoaded, error, currentSchema: schema} = this.props;
-
-        if (loading && !wasLoaded) {
-            return this.renderLoader();
-        } else if (
-            (error && !error.isCancelled) ||
-            (schema && schema.Status === 'StatusAccessDenied')
-        ) {
-            return <div>{error?.statusText || 'Access denied'}</div>;
-        } else {
-            return this.renderContent();
-        }
-    }
-}
-
-function mapStateToProps(state, ownProps) {
-    const {data: schema = {}, loading, wasLoaded, error, currentSchema} = state.schema;
-    const tenantPath = state.tenant.tenant.Name;
-    const {path} = ownProps;
-    return {
-        tenantPath,
-        schema: schema[`${path}`],
-        loading,
-        wasLoaded,
-        error,
-        currentSchema,
-    };
-}
-
-const mapDispatchToProps = {
-    getSchema,
-};
-
-export default connect(mapStateToProps, mapDispatchToProps)(SchemaTree);

package/dist/containers/Tenant/Schema/SchemaTree/SchemaTree.scss

@@ -1,17 +0,0 @@
-@import '../../../../styles/mixins.scss';
-
-.schema {
-    .tree-view_item {
-        margin: 0;
-        padding: 2px 0;
-    }
-
-    .tree-view_children {
-        margin: 0;
-        padding-left: 15px;
-    }
-    &__loader {
-        display: flex;
-        justify-content: center;
-    }
-}

package/dist/styles/react-treeview.scss

@@ -1,45 +0,0 @@
-/* the tree node's style */
-
-.tree-view {
-    overflow-y: hidden;
-}
-
-.tree-view_item {
-    display: flex;
-    align-items: center;
-
-    margin: 10px 0;
-
-    cursor: pointer;
-    white-space: nowrap;
-}
-
-.tree-view_children {
-    margin-left: 35px;
-
-    cursor: pointer;
-    white-space: nowrap;
-}
-
-.tree-view_children-collapsed {
-    height: 0px;
-}
-
-.tree-view_arrow {
-    display: inline-block;
-
-    margin-right: 6px;
-
-    cursor: pointer;
-    user-select: none;
-}
-
-.tree-view_arrow:after {
-    content: '▾';
-}
-
-/* rotate the triangle to close it */
-
-.tree-view_arrow-collapsed {
-    transform: rotate(-90deg);
-}