ydb-embedded-ui 1.8.0 → 1.8.3

package/CHANGELOG.md

@@ -1,5 +1,28 @@
 # Changelog
 
+## [1.8.3](https://github.com/ydb-platform/ydb-embedded-ui/compare/v1.8.2...v1.8.3) (2022-07-08)
+
+
+### Bug Fixes
+
+* timeout 600 sec for requests /viewer/json/query ([cf65122](https://github.com/ydb-platform/ydb-embedded-ui/commit/cf651221f866e5f56ecf6c900b3778dedc31eb95))
+
+## [1.8.2](https://github.com/ydb-platform/ydb-embedded-ui/compare/v1.8.1...v1.8.2) (2022-07-07)
+
+
+### Bug Fixes
+
+* **Tenant:** 3 tabs for indexes ([9280384](https://github.com/ydb-platform/ydb-embedded-ui/commit/9280384733938c4bd269bf6f9adf23efb552c6e8))
+* **Tenant:** hide preview button for index tables ([a25e0ea](https://github.com/ydb-platform/ydb-embedded-ui/commit/a25e0ea0413277e27c54d123e2be7a15b8a2aaa4))
+
+## [1.8.1](https://github.com/ydb-platform/ydb-embedded-ui/compare/v1.8.0...v1.8.1) (2022-07-06)
+
+
+### Bug Fixes
+
+* **Tenant:** diagnostics view for table indexes ([63d3133](https://github.com/ydb-platform/ydb-embedded-ui/commit/63d3133c0d61f6d39186f0c5df2eb6983a9c8bf7))
+* **Tenant:** own context actions for table indexes ([3cd946a](https://github.com/ydb-platform/ydb-embedded-ui/commit/3cd946a333be402cec70569affef5865b0dd8934))
+
 ## [1.8.0](https://github.com/ydb-platform/ydb-embedded-ui/compare/v1.7.1...v1.8.0) (2022-07-05)
 
 

package/dist/containers/Tenant/Diagnostics/Diagnostics.tsx

@@ -30,9 +30,8 @@ import Tablets from '../../Tablets/Tablets';
 
 import routes, {createHref} from '../../../routes';
 import type {EPathType} from '../../../types/api/schema';
-import {isTableType} from '../utils/schema';
 import {TenantGeneralTabsIds, TenantTabsGroups} from '../TenantPages';
-import {GeneralPagesIds, DATABASE_PAGES, TABLE_PAGES, DIR_PAGES} from './DiagnosticsPages';
+import {GeneralPagesIds, DATABASE_PAGES, getPagesByType} from './DiagnosticsPages';
 //@ts-ignore
 import {enableAutorefresh, disableAutorefresh} from '../../../store/reducers/schema';
 import {setTopLevelTab, setDiagnosticsTab} from '../../../store/reducers/tenant';
@@ -66,20 +65,15 @@ function Diagnostics(props: DiagnosticsProps) {
 
     const {name: tenantName} = queryParams;
 
-    const isDatabase = currentSchemaPath === tenantName;
+    const isRoot = currentSchemaPath === tenantName;
 
     const pages = useMemo(() => {
-        const isTable = isTableType(props.type);
-
-        let pages = DIR_PAGES;
-
-        if (isDatabase) {
-            pages = DATABASE_PAGES;
-        } else if (isTable) {
-            pages = TABLE_PAGES;
+        if (isRoot) {
+            return DATABASE_PAGES;
         }
-        return pages;
-    }, [props.type, isDatabase]);
+
+        return getPagesByType(props.type);
+    }, [props.type, isRoot]);
 
     const forwardToDiagnosticTab = (tab: GeneralPagesIds) => {
         dispatch(setDiagnosticsTab(tab));

package/dist/containers/Tenant/Diagnostics/DiagnosticsPages.ts

@@ -1,3 +1,5 @@
+import {EPathType} from "../../../types/api/schema";
+
 export enum GeneralPagesIds {
     'overview' = 'Overview',
     'topQueries' = 'topQueries',
@@ -73,3 +75,18 @@ export const DATABASE_PAGES = [
 export const TABLE_PAGES = [overview, topShards, graph, tablets, hotKeys, describe];
 
 export const DIR_PAGES = [overview, topShards, describe];
+
+export const getPagesByType = (type?: EPathType) => {
+    switch (type) {
+        case EPathType.EPathTypeColumnStore:
+        case EPathType.EPathTypeSubDomain:
+            return DATABASE_PAGES;
+        case EPathType.EPathTypeColumnTable:
+        case EPathType.EPathTypeTable:
+            return TABLE_PAGES;
+        case EPathType.EPathTypeDir:
+        case EPathType.EPathTypeTableIndex:
+        default:
+            return DIR_PAGES;
+    }
+}

package/dist/containers/Tenant/ObjectSummary/ObjectSummary.tsx

@@ -16,8 +16,8 @@ import CopyToClipboard from '../../../components/CopyToClipboard/CopyToClipboard
 import InfoViewer from '../../../components/InfoViewer/InfoViewer';
 import Icon from '../../../components/Icon/Icon';
 
-import type {EPathType} from '../../../types/api/schema';
-import {isColumnEntityType, isTableType} from '../utils/schema';
+import type {EPathSubType, EPathType} from '../../../types/api/schema';
+import {isColumnEntityType, isIndexTable, isTableType} from '../utils/schema';
 
 import {
     DEFAULT_IS_TENANT_COMMON_INFO_COLLAPSED,
@@ -71,6 +71,7 @@ function prepareOlapTableSchema(tableSchema: any) {
 
 interface ObjectSummaryProps {
     type?: EPathType;
+    subType?: EPathSubType;
     onCollapseSummary: VoidFunction;
     onExpandSummary: VoidFunction;
     isCollapsed: boolean;
@@ -229,10 +230,10 @@ function ObjectSummary(props: ObjectSummaryProps) {
     };
 
     const renderCommonInfoControls = () => {
-        const isTable = isTableType(props.type);
+        const showPreview = isTableType(props.type) && !isIndexTable(props.subType);
         return (
             <React.Fragment>
-                {isTable && (
+                {showPreview && (
                     <Button view="flat-secondary" onClick={onOpenPreview} title="Show preview">
                         <Icon name="tablePreview" viewBox={'0 0 16 16'} height={16} width={16} />
                     </Button>

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

@@ -32,9 +32,9 @@ export function SchemaTree(props: SchemaTreeProps) {
         {concurrentId: `NavigationTree.getSchema|${path}`},
     )
         .then(({PathDescription: {Children = []} = {}}) => {
-            return Children.map(({Name = '', PathType}) => ({
+            return Children.map(({Name = '', PathType, PathSubType}) => ({
                 name: Name,
-                type: mapPathTypeToNavigationTreeType(PathType),
+                type: mapPathTypeToNavigationTreeType(PathType, PathSubType),
                 // FIXME: should only be explicitly set to true for tables with indexes
                 // at the moment of writing there is no property to determine this, fix later
                 expandable: true,

package/dist/containers/Tenant/Tenant.tsx

@@ -104,7 +104,10 @@ function Tenant(props: TenantProps) {
         };
     }, [tenantName, dispatch]);
 
-    const currentPathType = (currentItem as TEvDescribeSchemeResult).PathDescription?.Self?.PathType;
+    const {
+        PathType: currentPathType,
+        PathSubType: currentPathSubType,
+    } = (currentItem as TEvDescribeSchemeResult).PathDescription?.Self || {};
 
     const onCollapseSummaryHandler = () => {
         dispatchSummaryVisibilityAction(PaneVisibilityActionTypes.triggerCollapse);
@@ -138,6 +141,7 @@ function Tenant(props: TenantProps) {
                 >
                     <ObjectSummary
                         type={currentPathType}
+                        subType={currentPathSubType}
                         onCollapseSummary={onCollapseSummaryHandler}
                         onExpandSummary={onExpandSummaryHandler}
                         isCollapsed={summaryVisibilityState.collapsed}

package/dist/containers/Tenant/utils/schema.ts

@@ -1,8 +1,19 @@
 import type {NavigationTreeNodeType} from 'ydb-ui-components';
-import {EPathType} from '../../../types/api/schema';
+import {EPathSubType, EPathType} from '../../../types/api/schema';
+
+const mapTablePathSubTypeToNavigationTreeType = (subType?: EPathSubType) => {
+    switch (subType) {
+        case EPathSubType.EPathSubTypeSyncIndexImplTable:
+        case EPathSubType.EPathSubTypeAsyncIndexImplTable:
+            return 'index_table';
+        default:
+            return 'table';
+    }
+};
 
 export const mapPathTypeToNavigationTreeType = (
     type: EPathType = EPathType.EPathTypeDir,
+    subType?: EPathSubType,
     defaultType: NavigationTreeNodeType = 'directory'
 ): NavigationTreeNodeType => {
     switch (type) {
@@ -10,11 +21,12 @@ export const mapPathTypeToNavigationTreeType = (
             return 'database';
         case EPathType.EPathTypeTable:
         case EPathType.EPathTypeColumnTable:
-            return 'table';
+            return mapTablePathSubTypeToNavigationTreeType(subType);
         case EPathType.EPathTypeDir:
         case EPathType.EPathTypeColumnStore:
-        case EPathType.EPathTypeTableIndex:
             return 'directory';
+        case EPathType.EPathTypeTableIndex:
+            return 'index';
         default:
             return defaultType;
     }
@@ -23,6 +35,9 @@ export const mapPathTypeToNavigationTreeType = (
 export const isTableType = (type?: EPathType) =>
     mapPathTypeToNavigationTreeType(type) === 'table';
 
+export const isIndexTable = (subType?: EPathSubType) =>
+    mapTablePathSubTypeToNavigationTreeType(subType) === 'index_table';
+
 export const isColumnEntityType = (type?: EPathType) =>
     type === EPathType.EPathTypeColumnStore ||
     type === EPathType.EPathTypeColumnTable;

package/dist/containers/Tenant/utils/schemaActions.ts

@@ -15,7 +15,6 @@ const createTableTemplate = (path: string) => {
     PRIMARY KEY (\`id\`)
 );`;
 };
-
 const alterTableTemplate = (path: string) => {
     return `ALTER TABLE \`${path}\`
     ADD COLUMN is_deleted Bool;`;
@@ -32,40 +31,23 @@ const upsertQueryTemplate = (path: string) => {
 VALUES ( );`;
 };
 
-export const getActions = (
+const bindActions = (
+    path: string,
     dispatch: Dispatch<any>,
     setActivePath: (path: string) => void,
-) =>
-    (path: string, type: NavigationTreeNodeType) => {
-        const switchTabToQuery = () => {
-            dispatch(setTopLevelTab(TenantGeneralTabsIds.query));
-        };
-
-        const onCreateTableClick = () => {
-            dispatch(changeUserInput({input: createTableTemplate(path)}));
-            switchTabToQuery();
-            setActivePath(path);
-        };
+) => {
+    const inputQuery = (tmpl: (path: string) => string) => () => {
+        dispatch(changeUserInput({input: tmpl(path)}));
+        dispatch(setTopLevelTab(TenantGeneralTabsIds.query))
+        setActivePath(path);
+    }
 
-        const onAlterTableClick = () => {
-            dispatch(changeUserInput({input: alterTableTemplate(path)}));
-            switchTabToQuery();
-            setActivePath(path);
-        };
-
-        const onSelectQueryClick = () => {
-            dispatch(changeUserInput({input: selectQueryTemplate(path)}));
-            switchTabToQuery();
-            setActivePath(path);
-        };
-
-        const onUpsertQueryClick = () => {
-            dispatch(changeUserInput({input: upsertQueryTemplate(path)}));
-            switchTabToQuery();
-            setActivePath(path);
-        };
-
-        const onCopyPathClick = () => {
+    return {
+        createTable: inputQuery(createTableTemplate),
+        alterTable: inputQuery(alterTableTemplate),
+        selectQuery: inputQuery(selectQueryTemplate),
+        upsertQuery: inputQuery(upsertQueryTemplate),
+        copyPath: () => {
             navigator.clipboard
                 .writeText(path)
                 .then(() => {
@@ -82,34 +64,52 @@ export const getActions = (
                         type: 'error',
                     });
                 });
-        };
-
-        const onOpenPreviewClick = () => {
+        },
+        openPreview: () => {
             dispatch(setShowPreview(true));
-            switchTabToQuery();
+            dispatch(setTopLevelTab(TenantGeneralTabsIds.query))
             setActivePath(path);
-        };
+        },
+    };
+};
 
-        const copyItem = {text: 'Copy path', action: onCopyPathClick};
+export const getActions = (
+    dispatch: Dispatch<any>,
+    setActivePath: (path: string) => void,
+) =>
+    (path: string, type: NavigationTreeNodeType) => {
+        const actions = bindActions(path, dispatch, setActivePath);
+        const copyItem = {text: 'Copy path', action: actions.copyPath};
 
-        return type === 'table'
-            ? [
-                [
-                    {text: 'Open preview', action: onOpenPreviewClick},
-                    copyItem,
-                ],
-                [
-                    {text: 'Alter table...', action: onAlterTableClick},
-                    {text: 'Select query...', action: onSelectQueryClick},
-                    {text: 'Upsert query...', action: onUpsertQueryClick},
-                ],
-            ]
-            : [
-                [
+        switch (type) {
+            case 'database':
+            case 'directory':
+                return [
+                    [
+                        copyItem,
+                    ],
+                    [
+                        {text: 'Create table...', action: actions.createTable},
+                    ],
+                ];
+            case 'table':
+                return [
+                    [
+                        {text: 'Open preview', action: actions.openPreview},
+                        copyItem,
+                    ],
+                    [
+                        {text: 'Alter table...', action: actions.alterTable},
+                        {text: 'Select query...', action: actions.selectQuery},
+                        {text: 'Upsert query...', action: actions.upsertQuery},
+                    ],
+                ];
+            case 'index_table':
+                return [
                     copyItem,
-                ],
-                [
-                    {text: 'Create table...', action: onCreateTableClick},
-                ],
-            ];
+                ];
+            case 'index':
+            default:
+                return [];
+        }
     };

package/dist/services/api.js

@@ -153,6 +153,7 @@ export class YdbEmbeddedAPI extends AxiosWrapper {
             database,
             action,
             stats,
+            timeout: 600000,
         });
     }
     getExplainQuery(query, database) {
@@ -160,6 +161,7 @@ export class YdbEmbeddedAPI extends AxiosWrapper {
             query,
             database,
             action: 'explain',
+            timeout: 600000,
         });
     }
     getExplainQueryAst(query, database) {
@@ -167,6 +169,7 @@ export class YdbEmbeddedAPI extends AxiosWrapper {
             query,
             database,
             action: 'explain-ast',
+            timeout: 600000,
         });
     }
     getHotKeys(path, enableSampling) {

package/dist/types/api/schema.ts

@@ -91,7 +91,7 @@ export enum EPathType {
     EPathTypeTableIndex = 'EPathTypeTableIndex', 
 }
 
-enum EPathSubType {
+export enum EPathSubType {
     EPathSubTypeEmpty = 'EPathSubTypeEmpty',
     EPathSubTypeSyncIndexImplTable = 'EPathSubTypeSyncIndexImplTable',
     EPathSubTypeAsyncIndexImplTable = 'EPathSubTypeAsyncIndexImplTable',

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "ydb-embedded-ui",
-  "version": "1.8.0",
+  "version": "1.8.3",
   "files": [
     "dist"
   ],
@@ -40,7 +40,7 @@
     "reselect": "4.0.0",
     "sass": "1.32.8",
     "web-vitals": "1.1.2",
-    "ydb-ui-components": "2.1.0"
+    "ydb-ui-components": "2.2.0"
   },
   "scripts": {
     "start": "react-app-rewired start",