ydb-embedded-ui 1.0.1 → 1.0.4

package/CHANGELOG.md

@@ -1,5 +1,29 @@
 # Changelog
 
+### [1.0.4](https://www.github.com/ydb-platform/ydb-embedded-ui/compare/v1.0.3...v1.0.4) (2022-03-24)
+
+
+### Bug Fixes
+
+* freeze deps ([349dee8](https://www.github.com/ydb-platform/ydb-embedded-ui/commit/349dee8cbc7376e316e3cb87f5eb46142975de6c))
+* styles ([502bc0b](https://www.github.com/ydb-platform/ydb-embedded-ui/commit/502bc0bd319a141e2d3e90787eae41abcd24e76d))
+
+### [1.0.3](https://www.github.com/ydb-platform/ydb-embedded-ui/compare/v1.0.2...v1.0.3) (2022-03-21)
+
+
+### Bug Fixes
+
+* query status should not be shown when query is loading ([d214eee](https://www.github.com/ydb-platform/ydb-embedded-ui/commit/d214eee575b63341082f0be33163e3fce520df88))
+* should set correct initial current index in queries history ([c3228d7](https://www.github.com/ydb-platform/ydb-embedded-ui/commit/c3228d7a6a0c810982db1bdbec7762889ac44ffa))
+* **Storage:** wording fixed [YDB-1552] ([3f487ff](https://www.github.com/ydb-platform/ydb-embedded-ui/commit/3f487ff01117963760b676d14281e93e5f3002c0))
+
+### [1.0.2](https://www.github.com/ydb-platform/ydb-embedded-ui/compare/v1.0.1...v1.0.2) (2022-03-11)
+
+
+### Bug Fixes
+
+* **Header:** add link to internal viewer ([64af24f](https://www.github.com/ydb-platform/ydb-embedded-ui/commit/64af24f8d78cf0d34466ac129be10c0764cce3d4))
+
 ### [1.0.1](https://www.github.com/ydb-platform/ydb-embedded-ui/compare/v1.0.0...v1.0.1) (2022-03-05)
 
 

package/dist/containers/Header/Header.scss

@@ -25,4 +25,16 @@
         font-size: var(--yc-text-body2-font-size);
         font-weight: 500;
     }
+
+    &__cluster-name-wrapper {
+        display: flex;
+        align-items: center;
+
+        height: 100%;
+        gap: 5px;
+    }
+
+    &__divider {
+        height: 80%;
+    }
 }

package/dist/containers/Header/Header.tsx

@@ -1,15 +1,19 @@
-import {useEffect} from 'react';
+import React, {useEffect} from 'react';
 import {useDispatch, useSelector} from 'react-redux';
 import cn from 'bem-cn-lite';
 import {useHistory, useLocation} from 'react-router';
+import {Breadcrumbs, BreadcrumbsItem, Link} from '@yandex-cloud/uikit';
 
-import {clusterName as clusterNameLocation} from '../../store';
+import Divider from '../../components/Divider/Divider';
+//@ts-ignore
+import Icon from '../../components/Icon/Icon';
+
+import {clusterName as clusterNameLocation, backend, customBackend} from '../../store';
 import {getClusterInfo} from '../../store/reducers/cluster';
 import {getHostInfo} from '../../store/reducers/host';
+import {HeaderItemType} from '../../store/reducers/header';
 
 import './Header.scss';
-import {Breadcrumbs, BreadcrumbsItem} from '@yandex-cloud/uikit';
-import {HeaderItemType} from '../../store/reducers/header';
 
 const b = cn('header');
 
@@ -49,6 +53,12 @@ function Header() {
     const renderHeader = () => {
         const clusterNameFinal = singleClusterMode ? host.ClusterName : clusterName;
 
+        let link = backend + '/internal';
+
+        if (singleClusterMode && !customBackend) {
+            link = `/internal`;
+        }
+
         const breadcrumbItems = header.reduce((acc, el) => {
             acc.push({text: el.text, action: () => history.push(el.link)});
             return acc;
@@ -63,8 +73,20 @@ function Header() {
                         firstDisplayedItemsCount={1}
                     />
                 </div>
-                <div>
-                    {clusterNameFinal && <ClusterName name={clusterNameFinal} />}
+
+                <div className={b('cluster-name-wrapper')}>
+                    <Link href={link} target="_blank">
+                        Internal viewer{' '}
+                        <Icon name="external" viewBox={'0 0 16 16'} width={16} height={16} />
+                    </Link>
+                    {clusterNameFinal && (
+                        <React.Fragment>
+                            <div className={b('divider')}>
+                                <Divider />
+                            </div>
+                            <ClusterName name={clusterNameFinal} />
+                        </React.Fragment>
+                    )}
                 </div>
             </header>
         );

package/dist/containers/Storage/StorageGroups/StorageGroups.tsx

@@ -210,13 +210,16 @@ function StorageGroups({data, tableSettings, visibleEntities, nodes}: StorageGro
     ];
 
     let columns = allColumns;
+    let emptyMessage = 'No such groups.';
 
     if (visibleEntities === VisibleEntities.Space) {
         columns = allColumns.filter((col) => col.name !== TableColumnsIds.Missing);
+        emptyMessage = 'No storage groups with space problems.';
     }
 
     if (visibleEntities === VisibleEntities.Missing) {
         columns = allColumns.filter((col) => col.name !== TableColumnsIds.UsedSpaceFlag);
+        emptyMessage = 'No degraded groups.';
     }
     return data ? (
         <DataTable
@@ -226,7 +229,7 @@ function StorageGroups({data, tableSettings, visibleEntities, nodes}: StorageGro
             columns={columns}
             settings={tableSettings}
             initialSortOrder={setSortOrder(visibleEntities)}
-            emptyDataMessage="No such groups."
+            emptyDataMessage={emptyMessage}
         />
     ) : null;
 }

package/dist/containers/Storage/StorageNodes/StorageNodes.tsx

@@ -114,9 +114,14 @@ function StorageNodes({data, tableSettings, visibleEntities}: StorageGroupsProps
     ];
 
     let columns = allColumns;
+    let emptyMessage = 'No such nodes.';
 
     if (visibleEntities === VisibleEntities.Space) {
         columns = allColumns.filter((col) => col.name !== TableColumnsIds.Missing);
+        emptyMessage = 'No nodes with space problems.';
+    }
+    if (visibleEntities === VisibleEntities.Missing) {
+        emptyMessage = 'No degraded nodes.';
     }
 
     return data ? (
@@ -127,7 +132,7 @@ function StorageNodes({data, tableSettings, visibleEntities}: StorageGroupsProps
             columns={columns}
             settings={tableSettings}
             initialSortOrder={setSortOrder(visibleEntities)}
-            emptyDataMessage="No such nodes."
+            emptyDataMessage={emptyMessage}
         />
     ) : null;
 }

package/dist/containers/Tenant/ObjectSummary/ObjectSummary.scss

@@ -147,6 +147,7 @@
     &__path-name {
         overflow: hidden;
 
+        white-space: nowrap;
         text-overflow: ellipsis;
     }
 

package/dist/containers/Tenant/QueryEditor/QueryEditor.js

@@ -154,7 +154,7 @@ function QueryEditor(props) {
     useEffect(() => {
         const {monacoHotKey, setMonacoHotKey} = props;
         if (monacoHotKey === null) {
-            return 
+            return;
         }
         setMonacoHotKey(null);
         switch (monacoHotKey) {
@@ -464,19 +464,12 @@ function QueryEditor(props) {
     };
 
     const getExecuteResult = () => {
-        const {
-            data = [],
-            error,
-            loading,
-            history: {queries},
-        } = props.executeQuery;
+        const {data = [], error} = props.executeQuery;
 
         if (error) {
             return error.data || error;
         } else if (data.length > 0) {
             return data;
-        } else if (!loading && queries.length) {
-            return 'The request was successful';
         } else {
             return '';
         }

package/dist/containers/Tenant/QueryEditor/QueryExplain/QueryExplain.js

@@ -252,28 +252,32 @@ function QueryExplain(props) {
     return (
         <React.Fragment>
             <div className={b('controls')}>
-                <div className={b('controls-right')}>
-                    <QueryExecutionStatus hasError={Boolean(props.error)} />
-                    {!props.error && (
-                        <React.Fragment>
-                            <Divider />
-                            <RadioButton
-                                options={explainOptions}
-                                value={activeOption}
-                                onUpdate={onSelectOption}
+                {!props.loading && (
+                    <React.Fragment>
+                        <div className={b('controls-right')}>
+                            <QueryExecutionStatus hasError={Boolean(props.error)} />
+                            {!props.error && (
+                                <React.Fragment>
+                                    <Divider />
+                                    <RadioButton
+                                        options={explainOptions}
+                                        value={activeOption}
+                                        onUpdate={onSelectOption}
+                                    />
+                                </React.Fragment>
+                            )}
+                        </div>
+                        <div className={b('controls-left')}>
+                            <EnableFullscreenButton disabled={Boolean(props.error)} />
+                            <PaneVisibilityToggleButtons
+                                onCollapse={props.onCollapseResults}
+                                onExpand={props.onExpandResults}
+                                isCollapsed={props.isResultsCollapsed}
+                                initialDirection="bottom"
                             />
-                        </React.Fragment>
-                    )}
-                </div>
-                <div className={b('controls-left')}>
-                    <EnableFullscreenButton disabled={Boolean(props.error)} />
-                    <PaneVisibilityToggleButtons
-                        onCollapse={props.onCollapseResults}
-                        onExpand={props.onExpandResults}
-                        isCollapsed={props.isResultsCollapsed}
-                        initialDirection="bottom"
-                    />
-                </div>
+                        </div>
+                    </React.Fragment>
+                )}
             </div>
             <div className={b('result')}>{renderContent()}</div>
         </React.Fragment>

package/dist/containers/Tenant/QueryEditor/QueryExplain/QueryExplain.scss

@@ -19,6 +19,7 @@
         justify-content: space-between;
         align-items: center;
 
+        height: 53px;
         padding: 12px 20px;
 
         border-bottom: 1px solid var(--yc-color-line-generic);

package/dist/containers/Tenant/QueryEditor/QueryResult/QueryResult.scss

@@ -28,6 +28,7 @@
         justify-content: space-between;
         align-items: center;
 
+        height: 53px;
         padding: 12px 20px;
 
         border-bottom: 1px solid var(--yc-color-line-generic);

package/dist/store/reducers/executeQuery.js

@@ -34,7 +34,10 @@ const initialState = {
     input: '',
     history: {
         queries: queriesHistoryInitial.slice(sliceLimit < 0 ? 0 : sliceLimit),
-        currentIndex: -1,
+        currentIndex:
+            queriesHistoryInitial.length > MAXIMUM_QUERIES_IN_HISTORY
+                ? MAXIMUM_QUERIES_IN_HISTORY - 1
+                : queriesHistoryInitial.length - 1,
     },
     runAction: RUN_ACTIONS_VALUES.script,
     monacoHotKey: null,

package/dist/store/reducers/storage.js

@@ -6,8 +6,8 @@ import {calcUptime} from '../../utils';
 
 export const VisibleEntities = {
     All: 'All',
-    Missing: 'Missing',
-    Space: 'Space',
+    Missing: 'Degraded',
+    Space: 'Out of space',
 };
 
 export const StorageTypes = {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "ydb-embedded-ui",
-  "version": "1.0.1",
+  "version": "1.0.4",
   "files": [
     "dist"
   ],
@@ -9,38 +9,38 @@
     "url": "git@github.com:ydb-platform/ydb-embedded-ui.git"
   },
   "dependencies": {
-    "@testing-library/jest-dom": "^5.15.0",
-    "@testing-library/react": "^11.2.7",
-    "@testing-library/user-event": "^12.8.3",
-    "@types/qs": "^6.9.7",
-    "@yandex-cloud/i18n": "^0.2.0",
-    "@yandex-cloud/paranoid": "^1.0.0",
-    "@yandex-cloud/react-data-table": "^0.2.1",
-    "axios": "^0.19.2",
-    "bem-cn-lite": "^4.0.0",
-    "history": "^4.9.0",
-    "js-cookie": "^2.2.1",
-    "keymaster": "^1.6.2",
-    "lodash": "^4.17.11",
-    "monaco-editor": "^0.24.0",
-    "numeral": "^2.0.6",
-    "path-to-regexp": "^3.0.0",
-    "react-json-inspector": "^7.1.1",
-    "react-list": "^0.8.11",
-    "react-monaco-editor": "^0.30.1",
-    "react-redux": "^7.0.3",
-    "react-router": "^5.0.1",
-    "react-router-dom": "^5.0.1",
+    "@testing-library/jest-dom": "5.15.0",
+    "@testing-library/react": "11.2.7",
+    "@testing-library/user-event": "12.8.3",
+    "@types/qs": "6.9.7",
+    "@yandex-cloud/i18n": "0.2.0",
+    "@yandex-cloud/paranoid": "1.0.0",
+    "@yandex-cloud/react-data-table": "0.2.1",
+    "axios": "0.19.2",
+    "bem-cn-lite": "4.0.0",
+    "history": "4.9.0",
+    "js-cookie": "2.2.1",
+    "keymaster": "1.6.2",
+    "lodash": "4.17.11",
+    "monaco-editor": "0.24.0",
+    "numeral": "2.0.6",
+    "path-to-regexp": "3.0.0",
+    "react-json-inspector": "7.1.1",
+    "react-list": "0.8.11",
+    "react-monaco-editor": "0.30.1",
+    "react-redux": "7.2.6",
+    "react-router": "5.2.0",
+    "react-router-dom": "5.2.0",
     "react-scripts": "4.0.3",
-    "react-split": "^2.0.14",
-    "react-transition-group": "^4.4.2",
-    "react-treeview": "^0.4.7",
-    "redux": "^4.0.1",
-    "redux-location-state": "^2.6.0",
-    "redux-thunk": "^2.3.0",
-    "reselect": "^4.0.0",
-    "sass": "^1.32.8",
-    "web-vitals": "^1.1.2"
+    "react-split": "2.0.14",
+    "react-transition-group": "4.4.2",
+    "react-treeview": "0.4.7",
+    "redux": "4.0.1",
+    "redux-location-state": "2.6.0",
+    "redux-thunk": "2.3.0",
+    "reselect": "4.0.0",
+    "sass": "1.32.8",
+    "web-vitals": "1.1.2"
   },
   "scripts": {
     "start": "react-app-rewired start",
@@ -66,28 +66,29 @@
     ]
   },
   "devDependencies": {
-    "@commitlint/cli": "^15.0.0",
-    "@commitlint/config-conventional": "^15.0.0",
-    "@types/lodash": "^4.14.178",
-    "@types/react-dom": "^17.0.11",
-    "@types/react-router": "^5.1.17",
-    "@types/react-router-dom": "^5.3.2",
-    "@types/react-transition-group": "^4.4.4",
-    "@types/react-virtualized-auto-sizer": "^1.0.1",
-    "@yandex-cloud/axios-wrapper": "^1.0.2",
-    "@yandex-cloud/eslint-config": "^1.0.0",
-    "@yandex-cloud/prettier-config": "^1.0.0",
-    "@yandex-cloud/stylelint-config": "^1.1.0",
-    "@yandex-cloud/tsconfig": "^1.0.0",
-    "@yandex-cloud/uikit": "^1.7.0",
-    "copyfiles": "^2.4.1",
-    "eslint-config-prettier": "^8.3.0",
-    "postcss": "^8.4.6",
-    "prettier": "^2.5.1",
-    "react": "^17.0.2",
-    "react-app-rewired": "^2.1.11",
-    "react-dom": "^17.0.2",
-    "stylelint": "^14.3.0",
-    "typescript": "^4.5.4"
+    "@commitlint/cli": "15.0.0",
+    "@commitlint/config-conventional": "15.0.0",
+    "@types/history": "4.7.11",
+    "@types/lodash": "4.14.178",
+    "@types/react-dom": "17.0.11",
+    "@types/react-router": "5.1.17",
+    "@types/react-router-dom": "5.3.2",
+    "@types/react-transition-group": "4.4.4",
+    "@types/react-virtualized-auto-sizer": "1.0.1",
+    "@yandex-cloud/axios-wrapper": "1.0.2",
+    "@yandex-cloud/eslint-config": "1.0.0",
+    "@yandex-cloud/prettier-config": "1.0.0",
+    "@yandex-cloud/stylelint-config": "1.1.0",
+    "@yandex-cloud/tsconfig": "1.0.0",
+    "@yandex-cloud/uikit": "1.7.0",
+    "copyfiles": "2.4.1",
+    "eslint-config-prettier": "8.3.0",
+    "postcss": "8.4.6",
+    "prettier": "2.5.1",
+    "react": "17.0.2",
+    "react-app-rewired": "2.1.11",
+    "react-dom": "17.0.2",
+    "stylelint": "14.3.0",
+    "typescript": "4.5.4"
   }
 }