Merge branch 'main' into astandrik.very-bad-performance-1472

Author: astandrik

CHANGELOG.md

@@ -1,5 +1,24 @@
 # Changelog
 
+## [6.28.0](https://github.com/ydb-platform/ydb-embedded-ui/compare/v6.27.1...v6.28.0) (2024-10-23)
+
+
+### Features
+
+* add developer ui links to disks popups ([#1512](https://github.com/ydb-platform/ydb-embedded-ui/issues/1512)) ([57d2092](https://github.com/ydb-platform/ydb-embedded-ui/commit/57d20927839b4a11b7f24b57f7d3cf9b7549fb0f))
+
+
+### Bug Fixes
+
+* **Cluster:** handle cluster error in meta requests ([#1525](https://github.com/ydb-platform/ydb-embedded-ui/issues/1525)) ([71b254e](https://github.com/ydb-platform/ydb-embedded-ui/commit/71b254ec73ae492d722f8a720cda4e1de714e286))
+* correct width for columns with ProgressViewer ([#1522](https://github.com/ydb-platform/ydb-embedded-ui/issues/1522)) ([e27749a](https://github.com/ydb-platform/ydb-embedded-ui/commit/e27749af04d9230edd8cd24f5e3a59d968d87dcf))
+* **EntityStatus:** remove additionalControls, fix ClipboardButton layout ([#1524](https://github.com/ydb-platform/ydb-embedded-ui/issues/1524)) ([ea4d3a9](https://github.com/ydb-platform/ydb-embedded-ui/commit/ea4d3a95ffe99c8380f0a8971ff41f9b9b534aa7))
+* fields required in all groups and nodes requests ([#1515](https://github.com/ydb-platform/ydb-embedded-ui/issues/1515)) ([a9f79a3](https://github.com/ydb-platform/ydb-embedded-ui/commit/a9f79a31ced8a642dabd6231df4e810e1f14eaa3))
+* operations kind button width ([#1521](https://github.com/ydb-platform/ydb-embedded-ui/issues/1521)) ([980d4fa](https://github.com/ydb-platform/ydb-embedded-ui/commit/980d4facf842eb2f64275afaf925e6dde309c0fe))
+* replace EntityStatus with StatusIcon where possible ([#1518](https://github.com/ydb-platform/ydb-embedded-ui/issues/1518)) ([017c82a](https://github.com/ydb-platform/ydb-embedded-ui/commit/017c82a54fac97c2e62422ac971f615f39434d84))
+* **Storage:** display unavailable vdisks with average size ([#1511](https://github.com/ydb-platform/ydb-embedded-ui/issues/1511)) ([1868e18](https://github.com/ydb-platform/ydb-embedded-ui/commit/1868e182bd88fec178b400f32219f80f1cee1c02))
+* update license ([#1516](https://github.com/ydb-platform/ydb-embedded-ui/issues/1516)) ([cabcb5c](https://github.com/ydb-platform/ydb-embedded-ui/commit/cabcb5c89b0fa50ea4fdb2018eff39091d1b440f))
+
 ## [6.27.1](https://github.com/ydb-platform/ydb-embedded-ui/compare/v6.27.0...v6.27.1) (2024-10-22)
 
 

package-lock.json

@@ -1,6 +1,6 @@
 {
   "name": "ydb-embedded-ui",
-  "version": "6.27.1",
+  "version": "6.28.0",
   "files": [
     "dist"
   ],
@@ -22,7 +22,7 @@
     "@gravity-ui/paranoid": "^2.0.1",
     "@gravity-ui/react-data-table": "^2.1.1",
     "@gravity-ui/table": "^0.5.0",
-    "@gravity-ui/uikit": "^6.20.1",
+    "@gravity-ui/uikit": "^6.33.0",
     "@gravity-ui/websql-autocomplete": "^9.1.0",
     "@hookform/resolvers": "^3.9.0",
     "@reduxjs/toolkit": "^2.2.3",

package.json

@@ -1,12 +1,12 @@
 @import '../../styles/mixins.scss';
 
 .entity-status {
+    --button-width: 28px;
     position: relative;
 
     display: inline-flex;
     align-items: center;
 
-    min-width: 90px;
     max-width: 100%;
     height: 100%;
 
@@ -20,6 +20,18 @@
         color: var(--g-color-text-secondary);
 
         @include table-hover-appearing-button();
+
+        &_visible {
+            opacity: 1;
+        }
+    }
+
+    &__wrapper {
+        position: relative;
+
+        overflow: hidden;
+
+        padding-right: var(--button-width);
     }
 
     &__controls-wrapper {
@@ -34,13 +46,18 @@
         width: 0;
         height: 100%;
 
-        background-color: var(--g-color-base-float);
+        &_visible {
+            width: min-content;
+            padding: var(--g-spacing-1);
+        }
 
         .data-table__row:hover &,
         .ydb-paginated-table__row:hover &,
         .ydb-tree-view__item & {
             width: min-content;
             padding: var(--g-spacing-1);
+
+            background-color: var(--g-color-base-float);
         }
     }
 
@@ -57,13 +74,18 @@
     }
 
     &__link {
+        display: inline-block;
         overflow: hidden;
 
+        width: calc(100% + var(--button-width));
+        margin-top: 5px;
+
         white-space: nowrap;
         text-overflow: ellipsis;
     }
 
     &__link_with-left-trim {
+        text-align: end;
         direction: rtl;
 
         .entity-status__name {

src/components/EntityStatus/EntityStatus.scss

@@ -28,8 +28,6 @@ interface EntityStatusProps {
     clipboardButtonAlwaysVisible?: boolean;
 
     className?: string;
-
-    additionalControls?: React.ReactNode;
 }
 
 export function EntityStatus({
@@ -50,8 +48,6 @@ export function EntityStatus({
     clipboardButtonAlwaysVisible = false,
 
     className,
-
-    additionalControls,
 }: EntityStatusProps) {
     const renderIcon = () => {
         if (!showStatus) {
@@ -93,22 +89,29 @@ export function EntityStatus({
                     {label}
                 </span>
             )}
-            <span className={b('link', {'with-left-trim': withLeftTrim})}>{renderLink()}</span>
-            <div className={b('controls-wrapper')}>
-                {hasClipboardButton && (
-                    <ClipboardButton
-                        text={name}
-                        size="xs"
-                        view="normal"
-                        className={b('clipboard-button', {
-                            visible: clipboardButtonAlwaysVisible,
-                        })}
-                    />
-                )}
-                {additionalControls && (
-                    <span className={b('additional-controls')}>{additionalControls}</span>
-                )}
-            </div>
+            {(path || name) && (
+                <div className={b('wrapper')}>
+                    <span className={b('link', {'with-left-trim': withLeftTrim})}>
+                        {renderLink()}
+                    </span>
+                    {hasClipboardButton && (
+                        <div
+                            className={b('controls-wrapper', {
+                                visible: clipboardButtonAlwaysVisible,
+                            })}
+                        >
+                            <ClipboardButton
+                                text={name}
+                                size="xs"
+                                view="normal"
+                                className={b('clipboard-button', {
+                                    visible: clipboardButtonAlwaysVisible,
+                                })}
+                            />
+                        </div>
+                    )}
+                </div>
+            )}
         </div>
     );
 }

src/components/EntityStatus/EntityStatus.tsx

@@ -1,32 +1,20 @@
 import type {ButtonSize} from '@gravity-ui/uikit';
 import {Button, Icon} from '@gravity-ui/uikit';
 
-import {cn} from '../../utils/cn';
-
 import monitoringIcon from '../../assets/icons/monitoring.svg';
 
-import './MonitoringButton.scss';
-
-const b = cn('kv-monitoring-button');
-
 interface MonitoringButtonProps {
     className?: string;
-    visible?: boolean;
     href: string;
     size?: ButtonSize;
 }
 
-export function MonitoringButton({
-    href,
-    visible = false,
-    className,
-    size = 's',
-}: MonitoringButtonProps) {
+export function MonitoringButton({href, className, size = 'xs'}: MonitoringButtonProps) {
     return (
         <Button
             href={href}
             target="_blank"
-            className={b({visible}, className)}
+            className={className}
             size={size}
             title="Monitoring dashboard"
         >

src/components/MonitoringButton/MonitoringButton.scss

@@ -6,7 +6,6 @@ import type {TSystemStateInfo} from '../../types/api/nodes';
 import {createDeveloperUILinkWithNodeId} from '../../utils/developerUI/developerUI';
 import {isUnavailableNode} from '../../utils/nodes';
 import {CellWithPopover} from '../CellWithPopover/CellWithPopover';
-import {DeveloperUILinkButton} from '../DeveloperUILinkButton/DeveloperUILinkButton';
 import {EntityStatus} from '../EntityStatus/EntityStatus';
 import {NodeEndpointsTooltipContent} from '../TooltipsContent';
 
@@ -42,14 +41,10 @@ export const NodeHostWrapper = ({node, getNodeRef, database}: NodeHostWrapperPro
           })
         : undefined;
 
-    const additionalControls = nodeHref ? (
-        <DeveloperUILinkButton href={nodeHref} size="xs" />
-    ) : null;
-
     return (
         <CellWithPopover
             disabled={!isNodeAvailable}
-            content={<NodeEndpointsTooltipContent data={node} />}
+            content={<NodeEndpointsTooltipContent data={node} nodeHref={nodeHref} />}
             placement={['top', 'bottom']}
             behavior={PopoverBehavior.Immediate}
         >
@@ -58,7 +53,6 @@ export const NodeHostWrapper = ({node, getNodeRef, database}: NodeHostWrapperPro
                 status={node.SystemState}
                 path={nodePath}
                 hasClipboardButton
-                additionalControls={additionalControls}
             />
         </CellWithPopover>
     );