ydb-embedded-ui 3.3.0 → 3.3.1

package/CHANGELOG.md

@@ -1,5 +1,12 @@
 # Changelog
 
+## [3.3.1](https://github.com/ydb-platform/ydb-embedded-ui/compare/v3.3.0...v3.3.1) (2023-01-31)
+
+
+### Bug Fixes
+
+* **UserSettings:** reword nodes setting and add popup ([2fda2b8](https://github.com/ydb-platform/ydb-embedded-ui/commit/2fda2b815b921a8163f80527c45f788172df4ba8))
+
 ## [3.3.0](https://github.com/ydb-platform/ydb-embedded-ui/compare/v3.2.3...v3.3.0) (2023-01-30)
 
 

package/dist/containers/UserSettings/UserSettings.scss

@@ -0,0 +1,9 @@
+.ydb-user-settings {
+    &__item-with-popup {
+        max-width: 180px;
+    }
+
+    &__popup {
+        max-width: 370px;
+    }
+}

package/dist/containers/UserSettings/UserSettings.tsx

@@ -1,6 +1,8 @@
+import {ReactNode} from 'react';
 import {connect} from 'react-redux';
+import cn from 'bem-cn-lite';
 
-import {RadioButton, Switch} from '@gravity-ui/uikit';
+import {RadioButton, Switch, HelpPopover} from '@gravity-ui/uikit';
 import {Settings} from '@gravity-ui/navigation';
 
 import favoriteFilledIcon from '../../assets/icons/star.svg';
@@ -14,6 +16,10 @@ import {
 
 import {setSettingValue} from '../../store/reducers/settings';
 
+import './UserSettings.scss';
+
+const b = cn('ydb-user-settings');
+
 enum Theme {
     light = 'light',
     dark = 'dark',
@@ -33,6 +39,19 @@ function UserSettings(props: any) {
         props.setSettingValue(USE_NODES_ENDPOINT_IN_DIAGNOSTICS_KEY, String(value));
     };
 
+    const renderBreakNodesSettingsItem = (title: ReactNode) => {
+        return (
+            <div className={b('item-with-popup')}>
+                {title}
+                <HelpPopover
+                    content="Use /viewer/json/nodes endpoint for Nodes Tab in diagnostics. It returns incorrect data on older versions"
+                    contentClassName={b('popup')}
+                    hasArrow={true}
+                />
+            </div>
+        );
+    };
+
     return (
         <Settings>
             <Settings.Page
@@ -58,7 +77,10 @@ function UserSettings(props: any) {
                             onUpdate={_onInvertedDisksChangeHandler}
                         />
                     </Settings.Item>
-                    <Settings.Item title="Use /viewer/json/nodes for Nodes Tab in diagnostics">
+                    <Settings.Item
+                        title="Break the Nodes tab in Diagnostics"
+                        renderTitleComponent={renderBreakNodesSettingsItem}
+                    >
                         <Switch
                             checked={props.useNodesEndpointInDiagnostics}
                             onUpdate={_onNodesEndpointChangeHandler}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "ydb-embedded-ui",
-  "version": "3.3.0",
+  "version": "3.3.1",
   "files": [
     "dist"
   ],