ydb-embedded-ui 6.11.0 → 6.13.0

package/dist/containers/PDiskPage/PDiskSpaceDistribution/PDiskSpaceDistribution.js

@@ -0,0 +1,93 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { ContentWithPopup } from '../../../components/ContentWithPopup/ContentWithPopup';
+import { DiskStateProgressBar } from '../../../components/DiskStateProgressBar/DiskStateProgressBar';
+import { InfoViewer } from '../../../components/InfoViewer';
+import { InternalLink } from '../../../components/InternalLink';
+import { ProgressViewer } from '../../../components/ProgressViewer/ProgressViewer';
+import { VDiskInfo } from '../../../components/VDiskInfo/VDiskInfo';
+import { getVDiskPagePath } from '../../../routes';
+import { valueIsDefined } from '../../../utils';
+import { formatBytes } from '../../../utils/bytesParsers';
+import { cn } from '../../../utils/cn';
+import { formatStorageValuesToGb } from '../../../utils/dataFormatters/dataFormatters';
+import { pDiskPageKeyset } from '../i18n';
+import { isEmptySlot, isLogSlot, isVDiskSlot } from './utils';
+import './PDiskSpaceDistribution.scss';
+const b = cn('ydb-pdisk-space-distribution');
+const SLOT_HEIGHT = 40;
+export function PDiskSpaceDistribution({ data }) {
+    const { SlotItems } = data;
+    const { PDiskId, NodeId } = data;
+    const containerHeight = SLOT_HEIGHT * ((SlotItems === null || SlotItems === void 0 ? void 0 : SlotItems.length) || 1);
+    const renderSlots = () => {
+        return SlotItems === null || SlotItems === void 0 ? void 0 : SlotItems.map((item, index) => {
+            return _jsx(Slot, { item: item, pDiskId: PDiskId, nodeId: NodeId }, index);
+        });
+    };
+    if (!(SlotItems === null || SlotItems === void 0 ? void 0 : SlotItems.length)) {
+        return pDiskPageKeyset('no-slots-data');
+    }
+    return (_jsx("div", { className: b(null), style: {
+            height: containerHeight,
+            minHeight: containerHeight,
+        }, children: _jsx(DiskStateProgressBar, { className: b('pdisk-bar'), severity: data.Severity, diskAllocatedPercent: data.AllocatedPercent, content: renderSlots(), faded: true }) }));
+}
+function Slot({ item, pDiskId, nodeId }) {
+    const renderContent = () => {
+        var _a;
+        if (isVDiskSlot(item)) {
+            const vDiskPagePath = valueIsDefined((_a = item.SlotData) === null || _a === void 0 ? void 0 : _a.VDiskSlotId) &&
+                valueIsDefined(pDiskId) &&
+                valueIsDefined(nodeId)
+                ? getVDiskPagePath(item.SlotData.VDiskSlotId, pDiskId, nodeId)
+                : undefined;
+            return (_jsx(ContentWithPopup, { content: _jsx(VDiskInfo, { data: item.SlotData, withTitle: true }), contentClassName: b('vdisk-popup'), placement: ['right', 'top'], children: _jsx(InternalLink, { to: vDiskPagePath, children: _jsx(DiskStateProgressBar, { className: b('slot'), severity: item.Severity, diskAllocatedPercent: item.UsagePercent, content: _jsx(SlotContent, { id: item.Id, title: item.Title, used: item.Used, total: item.Total }) }) }) }));
+        }
+        if (isLogSlot(item)) {
+            return (_jsx(ContentWithPopup, { content: _jsx(LogInfo, { data: item.SlotData }), contentClassName: b('vdisk-popup'), placement: ['right', 'top'], children: _jsx(DiskStateProgressBar, { className: b('slot'), severity: item.Severity, diskAllocatedPercent: item.UsagePercent, content: _jsx(SlotContent, { title: pDiskPageKeyset('log'), used: item.Used, total: item.Total }) }) }));
+        }
+        if (isEmptySlot(item)) {
+            return (_jsx(ContentWithPopup, { content: _jsx(EmptySlotInfo, { data: item.SlotData }), contentClassName: b('vdisk-popup'), placement: ['right', 'top'], children: _jsx(DiskStateProgressBar, { className: b('slot'), severity: item.Severity, empty: true, content: _jsx(SlotContent, { title: pDiskPageKeyset('empty-slot'), 
+                        // Empty slots have only total size
+                        used: item.Total }) }) }));
+        }
+        return null;
+    };
+    return (_jsx("div", { className: b('slot-wrapper'), style: { flexGrow: Number(item.Total) || 1 }, children: renderContent() }));
+}
+function SlotContent({ id, title, used, total }) {
+    const renderSize = () => {
+        const [formattedUsed, formattedTotal] = formatStorageValuesToGb(used, total);
+        if (!total) {
+            return formattedUsed;
+        }
+        return `${formattedUsed} / ${formattedTotal}`;
+    };
+    return (_jsxs("div", { className: b('slot-content'), children: [_jsxs("span", { children: [valueIsDefined(id) ? _jsx("span", { className: b('slot-id'), children: id }) : null, title] }), _jsx("span", { className: b('slot-size'), children: renderSize() })] }));
+}
+function LogInfo({ data }) {
+    const { LogTotalSize, LogUsedSize, SystemSize } = data;
+    const info = [
+        {
+            label: pDiskPageKeyset('label.log-size'),
+            value: (_jsx(ProgressViewer, { value: LogUsedSize, capacity: LogTotalSize, formatValues: formatStorageValuesToGb })),
+        },
+    ];
+    if (valueIsDefined(SystemSize)) {
+        info.push({
+            label: pDiskPageKeyset('label.system-size'),
+            value: formatBytes({ value: SystemSize }),
+        });
+    }
+    return _jsx(InfoViewer, { title: pDiskPageKeyset('log'), info: info });
+}
+function EmptySlotInfo({ data }) {
+    const { Size } = data;
+    const info = [
+        {
+            label: pDiskPageKeyset('label.slot-size'),
+            value: formatBytes({ value: Size }),
+        },
+    ];
+    return _jsx(InfoViewer, { title: pDiskPageKeyset('empty-slot'), info: info });
+}

package/dist/containers/PDiskPage/PDiskSpaceDistribution/PDiskSpaceDistribution.scss

@@ -0,0 +1,52 @@
+.ydb-pdisk-space-distribution {
+    .storage-disk-progress-bar {
+        height: 100%;
+    }
+
+    &__pdisk-bar {
+        display: flex;
+        flex-grow: 1;
+        flex-direction: column;
+        gap: var(--g-spacing-2);
+
+        min-width: 500px;
+        max-width: 800px;
+        padding: var(--g-spacing-2);
+    }
+
+    &__slot-wrapper {
+        z-index: 1;
+
+        background-color: var(--g-color-base-background);
+    }
+
+    &__slot {
+        display: flex;
+
+        width: 100%;
+    }
+
+    &__slot-content {
+        z-index: 1;
+
+        display: flex;
+        flex-grow: 1;
+        flex-direction: row;
+        justify-content: space-between;
+        align-items: center;
+
+        padding: 0 var(--g-spacing-2);
+
+        line-height: 15px;
+    }
+
+    &__slot-id {
+        margin-right: var(--g-spacing-3);
+
+        font-weight: 600;
+    }
+
+    &__vdisk-popup {
+        padding: var(--g-spacing-half) var(--g-spacing-2) var(--g-spacing-2);
+    }
+}

package/dist/containers/PDiskPage/PDiskSpaceDistribution/utils.d.ts

@@ -0,0 +1,4 @@
+import type { SlotItem, SlotItemType } from '../../../store/reducers/pdisk/types';
+export declare function isVDiskSlot(slot: SlotItem<SlotItemType>): slot is SlotItem<'vDisk'>;
+export declare function isLogSlot(slot: SlotItem<SlotItemType>): slot is SlotItem<'log'>;
+export declare function isEmptySlot(slot: SlotItem<SlotItemType>): slot is SlotItem<'empty'>;

package/dist/containers/PDiskPage/PDiskSpaceDistribution/utils.js

@@ -0,0 +1,9 @@
+export function isVDiskSlot(slot) {
+    return slot.SlotType === 'vDisk';
+}
+export function isLogSlot(slot) {
+    return slot.SlotType === 'log';
+}
+export function isEmptySlot(slot) {
+    return slot.SlotType === 'empty';
+}

package/dist/containers/PDiskPage/i18n/en.json

@@ -1,9 +1,17 @@
 {
     "fqdn": "FQDN",
     "pdisk": "PDisk",
-    "groups": "Groups",
     "node": "Node",
+    "groups": "Groups",
+    "disk-distribution": "Disk distribution",
+    "empty-slot": "Empty slot",
+    "log": "Log",
+    "label.log-size": "Log Size",
+    "label.system-size": "System Size",
+    "label.slot-size": "Slot Size",
+    "no-slots-data": "No slots data",
     "restart-pdisk-button": "Restart PDisk",
+    "force-restart-pdisk-button": "Restart anyway",
     "restart-pdisk-dialog": "PDisk will be restarted. Do you want to proceed?",
     "restart-pdisk-not-allowed": "You don't have enough rights to restart PDisk"
 }

package/dist/containers/PDiskPage/i18n/index.d.ts

@@ -1 +1 @@
-export declare const pDiskPageKeyset: (key: "node" | "groups" | "fqdn" | "pdisk" | "restart-pdisk-button" | "restart-pdisk-dialog" | "restart-pdisk-not-allowed", params?: import("@gravity-ui/i18n").Params) => string;
+export declare const pDiskPageKeyset: (key: "node" | "groups" | "fqdn" | "log" | "pdisk" | "disk-distribution" | "empty-slot" | "label.log-size" | "label.system-size" | "label.slot-size" | "no-slots-data" | "restart-pdisk-button" | "force-restart-pdisk-button" | "restart-pdisk-dialog" | "restart-pdisk-not-allowed", params?: import("@gravity-ui/i18n").Params) => string;

package/dist/containers/Storage/PDisk/PDisk.js

@@ -5,17 +5,16 @@ import { InternalLink } from '../../../components/InternalLink';
 import { PDiskPopup } from '../../../components/PDiskPopup/PDiskPopup';
 import { VDiskWithDonorsStack } from '../../../components/VDisk/VDiskWithDonorsStack';
 import routes, { createHref, getPDiskPagePath } from '../../../routes';
+import { useDiskPagesAvailable } from '../../../store/reducers/capabilities/hooks';
 import { valueIsDefined } from '../../../utils';
 import { cn } from '../../../utils/cn';
-import { USE_SEPARATE_DISKS_PAGES_KEY } from '../../../utils/constants';
 import { stringifyVdiskId } from '../../../utils/dataFormatters/dataFormatters';
-import { useSetting } from '../../../utils/hooks';
 import { STRUCTURE } from '../../Node/NodePages';
 import './PDisk.scss';
 const b = cn('pdisk-storage');
 export const PDisk = ({ nodeId, data = {}, vDisks }) => {
     const [isPopupVisible, setIsPopupVisible] = React.useState(false);
-    const [useSeparateDisksPages] = useSetting(USE_SEPARATE_DISKS_PAGES_KEY);
+    const diskPagesAvailable = useDiskPagesAvailable();
     const anchor = React.useRef(null);
     const showPopup = () => {
         setIsPopupVisible(true);
@@ -36,7 +35,7 @@ export const PDisk = ({ nodeId, data = {}, vDisks }) => {
             }) }));
     };
     let pDiskPath = createHref(routes.node, { id: nodeId, activeTab: STRUCTURE }, { pdiskId: data.PDiskId || '' });
-    if (useSeparateDisksPages && valueIsDefined(data.PDiskId)) {
+    if (diskPagesAvailable && valueIsDefined(data.PDiskId)) {
         pDiskPath = getPDiskPagePath(data.PDiskId, nodeId);
     }
     return (_jsxs(React.Fragment, { children: [_jsx(PDiskPopup, { data: data, anchorRef: anchor, open: isPopupVisible }), _jsxs("div", { className: b(), ref: anchor, children: [renderVDisks(), _jsxs(InternalLink, { to: pDiskPath, className: b('content'), onMouseEnter: showPopup, onMouseLeave: hidePopup, children: [_jsx(DiskStateProgressBar, { diskAllocatedPercent: data.AllocatedPercent, severity: data.Severity }), _jsx("div", { className: b('media-type'), children: data.Type })] })] })] }));

package/dist/containers/Storage/Storage.js

@@ -2,6 +2,7 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import React from 'react';
 import { ArrayParam, StringParam, useQueryParams, withDefault } from 'use-query-params';
 import { AccessDenied } from '../../components/Errors/403';
+import { isAccessError } from '../../components/Errors/PageError/PageError';
 import { ResponseError } from '../../components/Errors/ResponseError';
 import { TableWithControlsLayout } from '../../components/TableWithControlsLayout/TableWithControlsLayout';
 import { selectNodesMap } from '../../store/reducers/nodesList';
@@ -104,11 +105,8 @@ export const Storage = ({ additionalNodesProps, tenant, nodeId }) => {
                 ? storageGroups.length
                 : storageNodes.length, entitiesCountTotal: entitiesCount.total, entitiesLoading: isLoading }));
     };
-    if (error) {
-        if (error.status === 403) {
-            return _jsx(AccessDenied, { position: "left" });
-        }
-        return _jsx(ResponseError, { error: error });
+    if (isAccessError(error)) {
+        return _jsx(AccessDenied, { position: "left" });
     }
-    return (_jsxs(TableWithControlsLayout, { children: [_jsx(TableWithControlsLayout.Controls, { children: renderControls() }), _jsx(TableWithControlsLayout.Table, { loading: isLoading, className: b('table'), children: renderDataTable() })] }));
+    return (_jsxs(TableWithControlsLayout, { children: [_jsx(TableWithControlsLayout.Controls, { children: renderControls() }), error ? _jsx(ResponseError, { error: error }) : null, _jsx(TableWithControlsLayout.Table, { loading: isLoading, className: b('table'), children: currentData ? renderDataTable() : null })] }));
 };

package/dist/containers/Storage/StorageGroups/getStorageGroupsColumns.js

@@ -56,9 +56,9 @@ const erasureColumn = {
     name: GROUPS_COLUMNS_IDS.Erasure,
     header: 'Erasure',
     width: 100,
+    sortAccessor: (row) => row.ErasureSpecies,
     render: ({ row }) => (row.ErasureSpecies ? row.ErasureSpecies : '-'),
     align: DataTable.LEFT,
-    sortable: false,
 };
 const degradedColumn = {
     name: GROUPS_COLUMNS_IDS.Degraded,
@@ -82,7 +82,6 @@ const usageColumn = {
     // without a limit exclude usage from sort to display at the bottom
     sortAccessor: (row) => (row.Limit ? row.Usage : null),
     align: DataTable.LEFT,
-    sortable: false,
 };
 const groupIdColumn = {
     name: GROUPS_COLUMNS_IDS.GroupId,
@@ -93,7 +92,6 @@ const groupIdColumn = {
     },
     sortAccessor: (row) => Number(row.GroupID),
     align: DataTable.RIGHT,
-    sortable: false,
 };
 const usedColumn = {
     name: GROUPS_COLUMNS_IDS.Used,
@@ -103,7 +101,6 @@ const usedColumn = {
         return bytesToGB(row.Used, true);
     },
     align: DataTable.RIGHT,
-    sortable: false,
 };
 const limitColumn = {
     name: GROUPS_COLUMNS_IDS.Limit,
@@ -113,7 +110,6 @@ const limitColumn = {
         return bytesToGB(row.Limit);
     },
     align: DataTable.RIGHT,
-    sortable: false,
 };
 const usedSpaceFlagColumn = {
     name: GROUPS_COLUMNS_IDS.UsedSpaceFlag,
@@ -166,9 +162,23 @@ const getVDisksColumn = (nodes) => ({
     align: DataTable.CENTER,
     width: 900,
     resizeable: false,
+    sortable: false,
 });
 export const getStorageTopGroupsColumns = () => {
-    return [groupIdColumn, typeColumn, erasureColumn, usageColumn, usedColumn, limitColumn];
+    const columns = [
+        groupIdColumn,
+        typeColumn,
+        erasureColumn,
+        usageColumn,
+        usedColumn,
+        limitColumn,
+    ];
+    return columns.map((column) => {
+        return {
+            ...column,
+            sortable: false,
+        };
+    });
 };
 export const getPDiskStorageColumns = (nodes) => {
     return [

package/dist/containers/Tablet/Tablet.js

@@ -54,7 +54,7 @@ export const Tablet = () => {
         if (loading && id !== tabletId && isFirstDataFetchRef.current) {
             return _jsx(Loader, { size: "l" });
         }
-        if (error) {
+        if (error && !currentData) {
             return _jsx(ResponseError, { error: error });
         }
         if (!tablet || !Object.keys(tablet).length) {
@@ -67,7 +67,7 @@ export const Tablet = () => {
                 path: `/tablets?TabletID=${TabletId}`,
             },
         ];
-        return (_jsx("div", { className: b(), children: _jsxs("div", { className: b('pane-wrapper'), children: [_jsxs("div", { className: b('left-pane'), children: [_jsx("ul", { className: b('links'), children: externalLinks.map(renderExternalLinks) }), _jsxs("div", { className: b('row', { header: true }), children: [_jsx("span", { className: b('title'), children: i18n('tablet.header') }), _jsx(EntityStatus, { status: Overall, name: TabletId }), _jsx("a", { rel: "noopener noreferrer", className: b('link', { external: true }), href: `${backend}/tablets?TabletID=${TabletId}`, target: "_blank", children: _jsx(Icon, { data: ArrowUpRightFromSquare }) }), Leader && _jsx(Tag, { text: "Leader", type: "blue" }), _jsx("span", { className: b('loader'), children: loading && _jsx(Loader, { size: "s" }) })] }), _jsx(TabletInfo, { tablet: tablet, tenantPath: tenantName }), _jsx(TabletControls, { tablet: tablet, fetchData: refetch })] }), _jsx("div", { className: b('rigth-pane'), children: _jsx(TabletTable, { history: history }) })] }) }));
+        return (_jsxs("div", { className: b(), children: [error ? _jsx(ResponseError, { error: error }) : null, _jsxs("div", { className: b('pane-wrapper'), children: [_jsxs("div", { className: b('left-pane'), children: [_jsx("ul", { className: b('links'), children: externalLinks.map(renderExternalLinks) }), _jsxs("div", { className: b('row', { header: true }), children: [_jsx("span", { className: b('title'), children: i18n('tablet.header') }), _jsx(EntityStatus, { status: Overall, name: TabletId }), _jsx("a", { rel: "noopener noreferrer", className: b('link', { external: true }), href: `${backend}/tablets?TabletID=${TabletId}`, target: "_blank", children: _jsx(Icon, { data: ArrowUpRightFromSquare }) }), Leader && _jsx(Tag, { text: "Leader", type: "blue" }), _jsx("span", { className: b('loader'), children: loading && _jsx(Loader, { size: "s" }) })] }), _jsx(TabletInfo, { tablet: tablet, tenantPath: tenantName }), _jsx(TabletControls, { tablet: tablet, fetchData: refetch })] }), _jsx("div", { className: b('rigth-pane'), children: _jsx(TabletTable, { history: history }) })] })] }));
     };
     return (_jsxs(React.Fragment, { children: [_jsx(Helmet, { children: _jsx("title", { children: `${id} — ${i18n('tablet.header')} — ${tenantName || queryClusterName || CLUSTER_DEFAULT_TITLE}` }) }), renderView()] }));
 };

package/dist/containers/Tablet/TabletControls/TabletControls.js

@@ -1,13 +1,14 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import React from 'react';
 import { ButtonWithConfirmDialog } from '../../../components/ButtonWithConfirmDialog/ButtonWithConfirmDialog';
+import { selectIsUserAllowedToMakeChanges } from '../../../store/reducers/authentication/authentication';
 import { ETabletState } from '../../../types/api/tablet';
 import { useTypedSelector } from '../../../utils/hooks';
 import { b } from '../Tablet';
 import i18n from '../i18n';
 export const TabletControls = ({ tablet, fetchData }) => {
     const { TabletId, HiveId } = tablet;
-    const { isUserAllowedToMakeChanges } = useTypedSelector((state) => state.authentication);
+    const isUserAllowedToMakeChanges = useTypedSelector(selectIsUserAllowedToMakeChanges);
     const _onKillClick = () => {
         return window.api.killTablet(TabletId);
     };

package/dist/containers/Tablets/Tablets.js

@@ -3,19 +3,20 @@ import { ArrowsRotateRight } from '@gravity-ui/icons';
 import { Icon, Label, Text } from '@gravity-ui/uikit';
 import { skipToken } from '@reduxjs/toolkit/query';
 import { ButtonWithConfirmDialog } from '../../components/ButtonWithConfirmDialog/ButtonWithConfirmDialog';
-import { DeveloperUiLink } from '../../components/DeveloperUiLink/DeveloperUiLink';
+import { DeveloperUILinkButton } from '../../components/DeveloperUILinkButton/DeveloperUILinkButton';
 import { EntityStatus } from '../../components/EntityStatus/EntityStatus';
 import { ResponseError } from '../../components/Errors/ResponseError';
 import { InternalLink } from '../../components/InternalLink';
 import { ResizeableDataTable } from '../../components/ResizeableDataTable/ResizeableDataTable';
 import { TableSkeleton } from '../../components/TableSkeleton/TableSkeleton';
 import routes, { createHref } from '../../routes';
-import { backend } from '../../store';
+import { selectIsUserAllowedToMakeChanges } from '../../store/reducers/authentication/authentication';
 import { selectTabletsWithFqdn, tabletsApi } from '../../store/reducers/tablets';
 import { ETabletState } from '../../types/api/tablet';
 import { cn } from '../../utils/cn';
-import { DEFAULT_TABLE_SETTINGS } from '../../utils/constants';
+import { DEFAULT_TABLE_SETTINGS, EMPTY_DATA_PLACEHOLDER } from '../../utils/constants';
 import { calcUptime } from '../../utils/dataFormatters/dataFormatters';
+import { createTabletDeveloperUIHref } from '../../utils/developerUI/developerUI';
 import { useAutoRefreshInterval, useTypedDispatch, useTypedSelector } from '../../utils/hooks';
 import { mapTabletStateToLabelTheme } from '../../utils/tablet';
 import { getDefaultNodePath } from '../Node/NodePages';
@@ -28,20 +29,23 @@ const columns = [
             return i18n('Type');
         },
         render: ({ row }) => {
-            return (_jsxs("span", { children: [row.Type, " ", row.Leader ? '' : _jsx(Text, { color: "secondary", children: "follower" })] }));
+            const isFollower = row.Leader === false;
+            return (_jsxs("span", { children: [row.Type, " ", isFollower ? _jsx(Text, { color: "secondary", children: "follower" }) : ''] }));
         },
     },
     {
         name: 'TabletId',
-        width: 230,
+        width: 220,
         get header() {
             return i18n('Tablet');
         },
         render: ({ row }) => {
             var _a;
-            const tabletPath = row.TabletId &&
-                createHref(routes.tablet, { id: row.TabletId }, { nodeId: row.NodeId, type: row.Type });
-            return (_jsx(EntityStatus, { name: (_a = row.TabletId) === null || _a === void 0 ? void 0 : _a.toString(), path: tabletPath, hasClipboardButton: true, showStatus: false, additionalControls: _jsx(DeveloperUiLink, { href: `${backend}/tablets?TabletID=${row.TabletId}` }) }));
+            if (!row.TabletId) {
+                return EMPTY_DATA_PLACEHOLDER;
+            }
+            const tabletPath = createHref(routes.tablet, { id: row.TabletId }, { nodeId: row.NodeId, type: row.Type });
+            return (_jsx(EntityStatus, { name: (_a = row.TabletId) === null || _a === void 0 ? void 0 : _a.toString(), path: tabletPath, hasClipboardButton: true, showStatus: false, additionalControls: _jsx(DeveloperUILinkButton, { href: createTabletDeveloperUIHref(row.TabletId) }) }));
         },
     },
     {
@@ -107,7 +111,7 @@ const columns = [
 function TabletActions(tablet) {
     const isDisabledRestart = tablet.State === ETabletState.Stopped;
     const dispatch = useTypedDispatch();
-    const { isUserAllowedToMakeChanges } = useTypedSelector((state) => state.authentication);
+    const isUserAllowedToMakeChanges = useTypedSelector(selectIsUserAllowedToMakeChanges);
     return (_jsx(ButtonWithConfirmDialog, { buttonView: "outlined", dialogContent: i18n('dialog.kill'), onConfirmAction: () => {
             return window.api.killTablet(tablet.TabletId);
         }, onConfirmActionSuccess: () => {
@@ -132,8 +136,5 @@ export function Tablets({ nodeId, path, className }) {
     if (loading) {
         return _jsx(TableSkeleton, {});
     }
-    if (error) {
-        return _jsx(ResponseError, { error: error });
-    }
-    return (_jsx("div", { className: b(null, className), children: _jsx(ResizeableDataTable, { columns: columns, data: tablets, settings: DEFAULT_TABLE_SETTINGS, emptyDataMessage: i18n('noTabletsData') }) }));
+    return (_jsxs("div", { className: b(null, className), children: [error ? _jsx(ResponseError, { error: error }) : null, currentData ? (_jsx(ResizeableDataTable, { columns: columns, data: tablets, settings: DEFAULT_TABLE_SETTINGS, emptyDataMessage: i18n('noTabletsData') })) : null] }));
 }

package/dist/containers/Tenant/Acl/Acl.d.ts

@@ -1,4 +1,5 @@
 import './Acl.scss';
-export declare const Acl: ({ path }: {
+export declare const Acl: ({ path, database }: {
     path: string;
+    database: string;
 }) => import("react/jsx-runtime").JSX.Element;

package/dist/containers/Tenant/Acl/Acl.js

@@ -6,7 +6,7 @@ import { Loader } from '../../../components/Loader';
 import { schemaAclApi } from '../../../store/reducers/schemaAcl/schemaAcl';
 import { valueIsDefined } from '../../../utils';
 import { cn } from '../../../utils/cn';
-import i18n from '../i18n';
+import i18n from './i18n';
 import './Acl.scss';
 const b = cn('ydb-acl');
 const prepareLogin = (value) => {
@@ -87,15 +87,16 @@ function getOwnerItem(owner) {
     return [
         {
             name: _jsx("span", { className: b('owner'), children: preparedOwner }),
-            content: _jsx("span", { className: b('owner'), children: i18n('acl.owner') }),
+            content: _jsx("span", { className: b('owner'), children: i18n('title_owner') }),
         },
     ];
 }
-export const Acl = ({ path }) => {
-    const { currentData, isFetching, error } = schemaAclApi.useGetSchemaAclQuery({ path });
+export const Acl = ({ path, database }) => {
+    const { currentData, isFetching, error } = schemaAclApi.useGetSchemaAclQuery({ path, database });
     const loading = isFetching && !currentData;
-    const { acl, owner } = currentData || {};
+    const { acl, effectiveAcl, owner } = currentData || {};
     const aclListItems = getAclListItems(acl);
+    const effectiveAclListItems = getAclListItems(effectiveAcl);
     const ownerItem = getOwnerItem(owner);
     if (loading) {
         return _jsx(Loader, {});
@@ -103,8 +104,9 @@ export const Acl = ({ path }) => {
     if (error) {
         return _jsx(ResponseError, { error: error });
     }
-    if (!acl && !owner) {
-        return _jsx(React.Fragment, { children: i18n('acl.empty') });
+    if (!acl && !owner && !effectiveAcl) {
+        return _jsx(React.Fragment, { children: i18n('description_empty') });
     }
-    return (_jsxs("div", { className: b(), children: [ownerItem.length ? (_jsx(DefinitionList, { items: ownerItem, nameMaxWidth: 200, className: b('owner-container') })) : null, aclListItems.length ? (_jsx(DefinitionList, { items: aclListItems, nameMaxWidth: 200, className: b('result') })) : null] }));
+    const accessRightsItems = ownerItem.concat(aclListItems);
+    return (_jsxs("div", { className: b(), children: [accessRightsItems.length ? (_jsxs(React.Fragment, { children: [_jsx("div", { className: b('list-title'), children: i18n('title_rights') }), _jsx(DefinitionList, { items: accessRightsItems, nameMaxWidth: 200, className: b('result') })] })) : null, effectiveAclListItems.length ? (_jsxs(React.Fragment, { children: [_jsx("div", { className: b('list-title'), children: i18n('title_effective-rights') }), _jsx(DefinitionList, { items: effectiveAclListItems, nameMaxWidth: 200, className: b('result') })] })) : null] }));
 };

package/dist/containers/Tenant/Acl/Acl.scss

@@ -2,20 +2,20 @@
 
 .ydb-acl {
     width: 100%;
-    &__owner-container {
-        padding-bottom: 25px;
-    }
     &__result {
-        padding-bottom: 16px;
-    }
-
-    &__owner {
-        font-weight: 600;
+        padding-bottom: var(--g-spacing-4);
+        padding-left: var(--g-spacing-2);
     }
     &__definition-content {
         display: flex;
         flex-direction: column;
     }
+    &__list-title {
+        margin: var(--g-spacing-3) 0 var(--g-spacing-5);
+
+        font-weight: 600;
+        @include subheader-2-typography();
+    }
     &__group-label {
         @include subheader-2-typography();
     }

package/dist/containers/Tenant/Acl/i18n/en.json

@@ -0,0 +1,6 @@
+{
+    "title_rights": "Access Rights",
+    "title_effective-rights": "Effective Access Rights",
+    "title_owner": "Owner",
+    "description_empty": "No Acl data"
+}

package/dist/containers/Tenant/Acl/i18n/index.d.ts

@@ -0,0 +1,2 @@
+declare const _default: (key: "title_rights" | "title_effective-rights" | "title_owner" | "description_empty", params?: import("@gravity-ui/i18n").Params) => string;
+export default _default;

package/dist/containers/Tenant/Acl/i18n/index.js

@@ -0,0 +1,4 @@
+import { registerKeysets } from '../../../../utils/i18n';
+import en from './en.json';
+const COMPONENT = 'ydb-acl';
+export default registerKeysets(COMPONENT, { en });

package/dist/containers/Tenant/Diagnostics/Consumers/Consumers.js

@@ -38,11 +38,8 @@ export const Consumers = ({ path, type }) => {
     if (loading) {
         return _jsx(Loader, { size: "m" });
     }
-    if (error) {
-        return _jsx(ResponseError, { error: error });
-    }
-    if (!consumers || !consumers.length) {
+    if (!error && (!consumers || !consumers.length)) {
         return _jsx("div", { children: i18n(`noConsumersMessage.${isCdcStream ? 'stream' : 'topic'}`) });
     }
-    return (_jsxs("div", { className: b(), children: [_jsxs("div", { className: b('controls'), children: [_jsx(Search, { onChange: handleSearchChange, placeholder: i18n('controls.search'), className: b('search'), value: searchValue }), topic && _jsx(ConsumersTopicStats, { data: topic })] }), _jsx("div", { className: b('table-wrapper'), children: _jsx("div", { className: b('table-content'), children: _jsx(ResizeableDataTable, { columnsWidthLSKey: CONSUMERS_COLUMNS_WIDTH_LS_KEY, wrapperClassName: b('table'), data: dataToRender, columns: columns, settings: DEFAULT_TABLE_SETTINGS, emptyDataMessage: i18n('table.emptyDataMessage') }) }) })] }));
+    return (_jsxs("div", { className: b(), children: [_jsxs("div", { className: b('controls'), children: [_jsx(Search, { onChange: handleSearchChange, placeholder: i18n('controls.search'), className: b('search'), value: searchValue }), topic && _jsx(ConsumersTopicStats, { data: topic })] }), error ? _jsx(ResponseError, { error: error }) : null, consumers ? (_jsx("div", { className: b('table-wrapper'), children: _jsx("div", { className: b('table-content'), children: _jsx(ResizeableDataTable, { columnsWidthLSKey: CONSUMERS_COLUMNS_WIDTH_LS_KEY, wrapperClassName: b('table'), data: dataToRender, columns: columns, settings: DEFAULT_TABLE_SETTINGS, emptyDataMessage: i18n('table.emptyDataMessage') }) }) })) : null] }));
 };

package/dist/containers/Tenant/Diagnostics/Describe/Describe.d.ts

@@ -3,7 +3,8 @@ import './Describe.scss';
 import 'react-json-inspector/json-inspector.css';
 interface IDescribeProps {
     path: string;
+    database: string;
     type?: EPathType;
 }
-declare const Describe: ({ path, type }: IDescribeProps) => import("react/jsx-runtime").JSX.Element;
+declare const Describe: ({ path, database, type }: IDescribeProps) => import("react/jsx-runtime").JSX.Element;
 export default Describe;

package/dist/containers/Tenant/Diagnostics/Describe/Describe.js

@@ -1,4 +1,4 @@
-import { jsx as _jsx } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { skipToken } from '@reduxjs/toolkit/query';
 import JSONTree from 'react-json-inspector';
 import { shallowEqual } from 'react-redux';
@@ -13,18 +13,18 @@ import './Describe.scss';
 import 'react-json-inspector/json-inspector.css';
 const b = cn('kv-describe');
 const expandMap = new Map();
-const Describe = ({ path, type }) => {
+const Describe = ({ path, database, type }) => {
     const [autoRefreshInterval] = useAutoRefreshInterval();
     const isEntityWithMergedImpl = isEntityWithMergedImplementation(type);
-    const mergedChildrenPaths = useTypedSelector((state) => selectSchemaMergedChildrenPaths(state, path, type), shallowEqual);
-    let paths = skipToken;
+    const mergedChildrenPaths = useTypedSelector((state) => selectSchemaMergedChildrenPaths(state, path, type, database), shallowEqual);
+    let paths = [];
     if (!isEntityWithMergedImpl) {
         paths = [path];
     }
     else if (mergedChildrenPaths) {
         paths = [path, ...mergedChildrenPaths];
     }
-    const { currentData, isFetching, error } = describeApi.useGetDescribeQuery(paths, {
+    const { currentData, isFetching, error } = describeApi.useGetDescribeQuery(paths.length ? { paths, database } : skipToken, {
         pollingInterval: autoRefreshInterval,
     });
     const loading = isFetching && currentData === undefined;
@@ -42,19 +42,16 @@ const Describe = ({ path, type }) => {
     if (loading || (isEntityWithMergedImpl && !mergedChildrenPaths)) {
         return _jsx(Loader, { size: "m" });
     }
-    if (error) {
-        return _jsx(ResponseError, { error: error, className: b('message-container') });
-    }
-    if (!loading && !preparedDescribeData) {
+    if (!preparedDescribeData && !error) {
         return _jsx("div", { className: b('message-container'), children: "Empty" });
     }
-    return (_jsx("div", { className: b(), children: _jsx("div", { className: b('result'), children: _jsx(JSONTree, { data: preparedDescribeData, className: b('tree'), onClick: ({ path }) => {
-                    const newValue = !(expandMap.get(path) || false);
-                    expandMap.set(path, newValue);
-                }, searchOptions: {
-                    debounceTime: 300,
-                }, isExpanded: (keypath) => {
-                    return expandMap.get(keypath) || false;
-                } }) }) }));
+    return (_jsxs("div", { className: b(), children: [error ? _jsx(ResponseError, { error: error }) : null, preparedDescribeData ? (_jsx("div", { className: b('result'), children: _jsx(JSONTree, { data: preparedDescribeData, className: b('tree'), onClick: ({ path }) => {
+                        const newValue = !(expandMap.get(path) || false);
+                        expandMap.set(path, newValue);
+                    }, searchOptions: {
+                        debounceTime: 300,
+                    }, isExpanded: (keypath) => {
+                        return expandMap.get(keypath) || false;
+                    } }) })) : null] }));
 };
 export default Describe;

package/dist/containers/Tenant/Diagnostics/DetailedOverview/DetailedOverview.js

@@ -10,6 +10,6 @@ function DetailedOverview(props) {
         return (_jsx("div", { className: b('section'), children: _jsx(TenantOverview, { tenantName: tenantName, additionalTenantProps: additionalTenantProps, additionalNodesProps: additionalNodesProps }) }));
     };
     const isTenant = tenantName === path;
-    return (_jsx("div", { className: b(), children: isTenant ? renderTenantOverview() : _jsx(Overview, { type: type, path: path }) }));
+    return (_jsx("div", { className: b(), children: isTenant ? (renderTenantOverview()) : (_jsx(Overview, { type: type, path: path, database: tenantName })) }));
 }
 export default DetailedOverview;

package/dist/containers/Tenant/Diagnostics/DetailedOverview/DetailedOverview.scss

@@ -1,5 +1,6 @@
 .kv-detailed-overview {
     display: flex;
+    flex-direction: column;
     gap: 20px;
 
     width: 100%;