ydb-embedded-ui 11.4.0 → 11.5.0

package/dist/components/ProgressWrapper/index.js

@@ -0,0 +1,9 @@
+// Main component - public API
+export { ProgressWrapper } from './ProgressWrapper';
+// Individual components - for direct usage if needed
+export { SingleProgress } from './SingleProgress';
+export { StackProgress } from './StackProgress';
+export { ProgressContainer } from './ProgressContainer';
+// Utils - for advanced usage
+export * from './progressUtils';
+//# sourceMappingURL=index.js.map

package/dist/components/ProgressWrapper/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/ProgressWrapper/index.ts"],"names":[],"mappings":"AAAA,8BAA8B;AAC9B,OAAO,EAAC,eAAe,EAAC,MAAM,mBAAmB,CAAC;AAElD,qDAAqD;AACrD,OAAO,EAAC,cAAc,EAAC,MAAM,kBAAkB,CAAC;AAChD,OAAO,EAAC,aAAa,EAAC,MAAM,iBAAiB,CAAC;AAC9C,OAAO,EAAC,iBAAiB,EAAC,MAAM,qBAAqB,CAAC;AAUtD,6BAA6B;AAC7B,cAAc,iBAAiB,CAAC"}

package/dist/components/ProgressWrapper/progressUtils.d.ts

@@ -0,0 +1,13 @@
+import type { FormatProgressViewerValues } from '../../utils/progress';
+export declare const DEFAULT_PROGRESS_WIDTH = 400;
+export declare const MAX_PERCENTAGE = 100;
+export declare const MIN_PERCENTAGE = 0;
+export declare const PROGRESS_SIZE = "s";
+export declare const isValidValue: (val?: number | string) => boolean;
+export declare function calculateProgressWidth(value: number, capacity: number): number;
+export declare function getProgressStyle(width?: number | 'full'): {
+    width: string;
+    flex: string;
+};
+export declare function formatProgressText(valueText: string | number | undefined, capacityText: string | number | undefined, numericCapacity: number): string;
+export declare function formatDisplayValues(value: number | string | undefined, capacity: number | string | undefined, formatValues?: FormatProgressViewerValues): [string | number | undefined, string | number | undefined];

package/dist/components/ProgressWrapper/progressUtils.js

@@ -0,0 +1,35 @@
+import { isNumeric, safeParseNumber } from '../../utils/utils';
+import i18n from './i18n';
+// Constants that were previously in TenantStorage/constants
+export const DEFAULT_PROGRESS_WIDTH = 400;
+export const MAX_PERCENTAGE = 100;
+export const MIN_PERCENTAGE = 0;
+export const PROGRESS_SIZE = 's';
+export const isValidValue = (val) => isNumeric(val) && safeParseNumber(val) >= 0;
+export function calculateProgressWidth(value, capacity) {
+    const rawPercentage = capacity > 0 ? Math.floor((value / capacity) * MAX_PERCENTAGE) : MAX_PERCENTAGE;
+    const fillWidth = Math.max(MIN_PERCENTAGE, rawPercentage);
+    return Math.min(fillWidth, MAX_PERCENTAGE);
+}
+export function getProgressStyle(width) {
+    const isFullWidth = width === 'full';
+    const validatedWidth = isFullWidth ? 0 : Math.max(0, width || DEFAULT_PROGRESS_WIDTH);
+    return {
+        width: isFullWidth ? '100%' : `${validatedWidth}px`,
+        flex: isFullWidth ? '1' : 'none',
+    };
+}
+export function formatProgressText(valueText, capacityText, numericCapacity) {
+    if (numericCapacity <= 0) {
+        return String(valueText);
+    }
+    return i18n('context_capacity-usage', { value: valueText, capacity: capacityText });
+}
+export function formatDisplayValues(value, capacity, formatValues) {
+    if (formatValues) {
+        const result = formatValues(Number(value), Number(capacity));
+        return [result[0], result[1]];
+    }
+    return [value, capacity];
+}
+//# sourceMappingURL=progressUtils.js.map

package/dist/components/ProgressWrapper/progressUtils.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"progressUtils.js","sourceRoot":"","sources":["../../../src/components/ProgressWrapper/progressUtils.ts"],"names":[],"mappings":"AACA,OAAO,EAAC,SAAS,EAAE,eAAe,EAAC,MAAM,mBAAmB,CAAC;AAE7D,OAAO,IAAI,MAAM,QAAQ,CAAC;AAE1B,4DAA4D;AAC5D,MAAM,CAAC,MAAM,sBAAsB,GAAG,GAAG,CAAC;AAC1C,MAAM,CAAC,MAAM,cAAc,GAAG,GAAG,CAAC;AAClC,MAAM,CAAC,MAAM,cAAc,GAAG,CAAC,CAAC;AAChC,MAAM,CAAC,MAAM,aAAa,GAAG,GAAG,CAAC;AAEjC,MAAM,CAAC,MAAM,YAAY,GAAG,CAAC,GAAqB,EAAW,EAAE,CAC3D,SAAS,CAAC,GAAG,CAAC,IAAI,eAAe,CAAC,GAAG,CAAC,IAAI,CAAC,CAAC;AAEhD,MAAM,UAAU,sBAAsB,CAAC,KAAa,EAAE,QAAgB;IAClE,MAAM,aAAa,GACf,QAAQ,GAAG,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,KAAK,GAAG,QAAQ,CAAC,GAAG,cAAc,CAAC,CAAC,CAAC,CAAC,cAAc,CAAC;IACpF,MAAM,SAAS,GAAG,IAAI,CAAC,GAAG,CAAC,cAAc,EAAE,aAAa,CAAC,CAAC;IAC1D,OAAO,IAAI,CAAC,GAAG,CAAC,SAAS,EAAE,cAAc,CAAC,CAAC;AAC/C,CAAC;AAED,MAAM,UAAU,gBAAgB,CAAC,KAAuB;IACpD,MAAM,WAAW,GAAG,KAAK,KAAK,MAAM,CAAC;IACrC,MAAM,cAAc,GAAG,WAAW,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,KAAK,IAAI,sBAAsB,CAAC,CAAC;IAEtF,OAAO;QACH,KAAK,EAAE,WAAW,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,GAAG,cAAc,IAAI;QACnD,IAAI,EAAE,WAAW,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,MAAM;KACnC,CAAC;AACN,CAAC;AAED,MAAM,UAAU,kBAAkB,CAC9B,SAAsC,EACtC,YAAyC,EACzC,eAAuB;IAEvB,IAAI,eAAe,IAAI,CAAC,EAAE,CAAC;QACvB,OAAO,MAAM,CAAC,SAAS,CAAC,CAAC;IAC7B,CAAC;IACD,OAAO,IAAI,CAAC,wBAAwB,EAAE,EAAC,KAAK,EAAE,SAAS,EAAE,QAAQ,EAAE,YAAY,EAAC,CAAC,CAAC;AACtF,CAAC;AAED,MAAM,UAAU,mBAAmB,CAC/B,KAAkC,EAClC,QAAqC,EACrC,YAAyC;IAEzC,IAAI,YAAY,EAAE,CAAC;QACf,MAAM,MAAM,GAAG,YAAY,CAAC,MAAM,CAAC,KAAK,CAAC,EAAE,MAAM,CAAC,QAAQ,CAAC,CAAC,CAAC;QAC7D,OAAO,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,MAAM,CAAC,CAAC,CAAC,CAA+D,CAAC;IAChG,CAAC;IACD,OAAO,CAAC,KAAK,EAAE,QAAQ,CAAC,CAAC;AAC7B,CAAC"}

package/dist/components/ProgressWrapper/types.d.ts

@@ -0,0 +1,29 @@
+import type { ProgressSize } from '@gravity-ui/uikit';
+import type { FormatProgressViewerValues } from '../../utils/progress';
+import type { MemorySegment } from '../MemoryViewer/utils';
+export interface ProgressWrapperBaseProps {
+    formatValues?: FormatProgressViewerValues;
+    className?: string;
+    width?: number | 'full';
+    size?: ProgressSize;
+    withCapacityUsage?: boolean;
+}
+export interface ProgressWrapperSingleProps extends ProgressWrapperBaseProps {
+    value?: number | string;
+    capacity?: number | string;
+    stack?: never;
+}
+export interface ProgressWrapperStackProps extends ProgressWrapperBaseProps {
+    stack: MemorySegment[];
+    totalCapacity?: number | string;
+    value?: never;
+    capacity?: never;
+}
+export type ProgressWrapperProps = ProgressWrapperSingleProps | ProgressWrapperStackProps;
+export interface ProgressContainerProps {
+    children: React.ReactNode;
+    displayText?: string;
+    withCapacityUsage?: boolean;
+    className?: string;
+    width?: number | 'full';
+}

package/dist/components/ProgressWrapper/types.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=types.js.map

package/dist/components/ProgressWrapper/types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../src/components/ProgressWrapper/types.ts"],"names":[],"mappings":""}

package/dist/components/QueriesActivityBar/QueriesActivityAlert.d.ts

@@ -0,0 +1,8 @@
+import './QueriesActivityAlert.scss';
+interface QueriesActivityAlertProps {
+    runningQueriesCount: number;
+    uniqueApplications: number;
+    uniqueUsers: number;
+}
+export declare function QueriesActivityAlert({ runningQueriesCount, uniqueApplications, uniqueUsers, }: QueriesActivityAlertProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/QueriesActivityBar/QueriesActivityAlert.js

@@ -0,0 +1,26 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { CirclePlay, Display, Person } from '@gravity-ui/icons';
+import { Button, Card, Flex, Icon, Label, Text } from '@gravity-ui/uikit';
+import { useHistory, useLocation } from 'react-router-dom';
+import { TenantTabsGroups, getTenantPath } from '../../containers/Tenant/TenantPages';
+import { parseQuery } from '../../routes';
+import { TENANT_DIAGNOSTICS_TABS_IDS } from '../../store/reducers/tenant/constants';
+import { cn } from '../../utils/cn';
+import i18n from './i18n';
+import './QueriesActivityAlert.scss';
+const b = cn('queries-activity-alert');
+export function QueriesActivityAlert({ runningQueriesCount, uniqueApplications, uniqueUsers, }) {
+    const history = useHistory();
+    const location = useLocation();
+    const handleOpenRunningQueries = () => {
+        const queryParams = parseQuery(location);
+        const path = getTenantPath({
+            ...queryParams,
+            [TenantTabsGroups.diagnosticsTab]: TENANT_DIAGNOSTICS_TABS_IDS.topQueries,
+            queryMode: 'running',
+        });
+        history.push(path);
+    };
+    return (_jsx("div", { className: b(), children: _jsx(Card, { className: b('card'), type: "container", view: "outlined", children: _jsxs(Flex, { direction: "row", justifyContent: "space-between", alignItems: "center", gap: 4, className: b('content'), children: [_jsx(Flex, { children: _jsx(Text, { variant: "subheader-2", className: b('title'), children: i18n('title_queries-activity') }) }), _jsxs(Flex, { wrap: true, alignItems: "center", gap: 1, className: b('stats'), children: [_jsx(Label, { theme: runningQueriesCount > 0 ? 'success' : 'unknown', icon: _jsx(Icon, { data: CirclePlay }), size: "s", value: String(runningQueriesCount), children: i18n('field_running-queries') }), _jsx(Label, { theme: "unknown", icon: _jsx(Icon, { data: Display }), size: "s", value: String(uniqueApplications), children: i18n('field_applications') }), _jsx(Label, { theme: "unknown", icon: _jsx(Icon, { data: Person }), size: "s", value: String(uniqueUsers), children: i18n('field_users') }), runningQueriesCount > 0 && (_jsx(Button, { view: "outlined", size: "s", onClick: handleOpenRunningQueries, className: b('open-queries-button'), children: i18n('action_open-running-queries') }))] })] }) }) }));
+}
+//# sourceMappingURL=QueriesActivityAlert.js.map

package/dist/components/QueriesActivityBar/QueriesActivityAlert.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"QueriesActivityAlert.js","sourceRoot":"","sources":["../../../src/components/QueriesActivityBar/QueriesActivityAlert.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAC,UAAU,EAAE,OAAO,EAAE,MAAM,EAAC,MAAM,mBAAmB,CAAC;AAC9D,OAAO,EAAC,MAAM,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,IAAI,EAAC,MAAM,mBAAmB,CAAC;AACxE,OAAO,EAAC,UAAU,EAAE,WAAW,EAAC,MAAM,kBAAkB,CAAC;AAEzD,OAAO,EAAC,gBAAgB,EAAE,aAAa,EAAC,MAAM,qCAAqC,CAAC;AACpF,OAAO,EAAC,UAAU,EAAC,MAAM,cAAc,CAAC;AACxC,OAAO,EAAC,2BAA2B,EAAC,MAAM,uCAAuC,CAAC;AAClF,OAAO,EAAC,EAAE,EAAC,MAAM,gBAAgB,CAAC;AAElC,OAAO,IAAI,MAAM,QAAQ,CAAC;AAE1B,OAAO,6BAA6B,CAAC;AAErC,MAAM,CAAC,GAAG,EAAE,CAAC,wBAAwB,CAAC,CAAC;AAQvC,MAAM,UAAU,oBAAoB,CAAC,EACjC,mBAAmB,EACnB,kBAAkB,EAClB,WAAW,GACa;IACxB,MAAM,OAAO,GAAG,UAAU,EAAE,CAAC;IAC7B,MAAM,QAAQ,GAAG,WAAW,EAAE,CAAC;IAE/B,MAAM,wBAAwB,GAAG,GAAG,EAAE;QAClC,MAAM,WAAW,GAAG,UAAU,CAAC,QAAQ,CAAC,CAAC;QACzC,MAAM,IAAI,GAAG,aAAa,CAAC;YACvB,GAAG,WAAW;YACd,CAAC,gBAAgB,CAAC,cAAc,CAAC,EAAE,2BAA2B,CAAC,UAAU;YACzE,SAAS,EAAE,SAAS;SACvB,CAAC,CAAC;QACH,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IACvB,CAAC,CAAC;IAEF,OAAO,CACH,cAAK,SAAS,EAAE,CAAC,EAAE,YACf,KAAC,IAAI,IAAC,SAAS,EAAE,CAAC,CAAC,MAAM,CAAC,EAAE,IAAI,EAAC,WAAW,EAAC,IAAI,EAAC,UAAU,YACxD,MAAC,IAAI,IACD,SAAS,EAAC,KAAK,EACf,cAAc,EAAC,eAAe,EAC9B,UAAU,EAAC,QAAQ,EACnB,GAAG,EAAE,CAAC,EACN,SAAS,EAAE,CAAC,CAAC,SAAS,CAAC,aAEvB,KAAC,IAAI,cACD,KAAC,IAAI,IAAC,OAAO,EAAC,aAAa,EAAC,SAAS,EAAE,CAAC,CAAC,OAAO,CAAC,YAC5C,IAAI,CAAC,wBAAwB,CAAC,GAC5B,GACJ,EACP,MAAC,IAAI,IAAC,IAAI,QAAC,UAAU,EAAC,QAAQ,EAAC,GAAG,EAAE,CAAC,EAAE,SAAS,EAAE,CAAC,CAAC,OAAO,CAAC,aACxD,KAAC,KAAK,IACF,KAAK,EAAE,mBAAmB,GAAG,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,SAAS,EACtD,IAAI,EAAE,KAAC,IAAI,IAAC,IAAI,EAAE,UAAU,GAAI,EAChC,IAAI,EAAC,GAAG,EACR,KAAK,EAAE,MAAM,CAAC,mBAAmB,CAAC,YAEjC,IAAI,CAAC,uBAAuB,CAAC,GAC1B,EAER,KAAC,KAAK,IACF,KAAK,EAAC,SAAS,EACf,IAAI,EAAE,KAAC,IAAI,IAAC,IAAI,EAAE,OAAO,GAAI,EAC7B,IAAI,EAAC,GAAG,EACR,KAAK,EAAE,MAAM,CAAC,kBAAkB,CAAC,YAEhC,IAAI,CAAC,oBAAoB,CAAC,GACvB,EAER,KAAC,KAAK,IACF,KAAK,EAAC,SAAS,EACf,IAAI,EAAE,KAAC,IAAI,IAAC,IAAI,EAAE,MAAM,GAAI,EAC5B,IAAI,EAAC,GAAG,EACR,KAAK,EAAE,MAAM,CAAC,WAAW,CAAC,YAEzB,IAAI,CAAC,aAAa,CAAC,GAChB,EAEP,mBAAmB,GAAG,CAAC,IAAI,CACxB,KAAC,MAAM,IACH,IAAI,EAAC,UAAU,EACf,IAAI,EAAC,GAAG,EACR,OAAO,EAAE,wBAAwB,EACjC,SAAS,EAAE,CAAC,CAAC,qBAAqB,CAAC,YAElC,IAAI,CAAC,6BAA6B,CAAC,GAC/B,CACZ,IACE,IACJ,GACJ,GACL,CACT,CAAC;AACN,CAAC"}

package/dist/components/QueriesActivityBar/QueriesActivityAlert.scss

@@ -0,0 +1,25 @@
+.queries-activity-alert {
+    $b: &;
+
+    border-radius: var(--g-border-radius-s);
+
+    &__card {
+        width: 100%;
+        padding: 0;
+
+        border: 1px solid var(--g-color-line-generic);
+        border-radius: var(--g-border-radius-s);
+    }
+
+    &__content {
+        padding: calc(var(--g-spacing-5) - 1px) var(--g-spacing-4);
+    }
+
+    &__title {
+        color: var(--g-color-text-primary);
+    }
+
+    &__open-queries-button {
+        margin-left: var(--g-spacing-1);
+    }
+}

package/dist/components/QueriesActivityBar/QueriesActivityBar.js

@@ -1,100 +1,20 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import React from 'react';
-import { CirclePlay, Clock, Display, Person, Rocket } from '@gravity-ui/icons';
-import { ArrowToggle, Button, Card, Flex, Icon, Label, Text } from '@gravity-ui/uikit';
-import { useHistory, useLocation } from 'react-router-dom';
-import { TenantTabsGroups, getTenantPath } from '../../containers/Tenant/TenantPages';
-import { parseQuery } from '../../routes';
-import { topQueriesApi } from '../../store/reducers/executeTopQueries/executeTopQueries';
-import { TENANT_DIAGNOSTICS_TABS_IDS } from '../../store/reducers/tenant/constants';
-import { cn } from '../../utils/cn';
-import { useAutoRefreshInterval } from '../../utils/hooks';
-import { chartApi } from '../MetricChart/reducer';
-import { QueriesActivityCharts } from './QueriesActivityCharts';
-import i18n from './i18n';
-import { calculateLatency, calculateQueriesPerSecond, formatTrendValue } from './utils';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { QueriesActivityAlert } from './QueriesActivityAlert';
+import { QueriesActivityExpandable } from './QueriesActivityExpandable';
+import { QueriesActivitySkeleton } from './QueriesActivitySkeleton';
+import { useQueriesActivityData } from './useQueriesActivityData';
 import './QueriesActivityBar.scss';
-const b = cn('queries-activity-bar');
 export function QueriesActivityBar({ tenantName }) {
-    var _a, _b, _c, _d, _e, _f, _g;
-    const history = useHistory();
-    const location = useLocation();
-    const [autoRefreshInterval] = useAutoRefreshInterval();
-    const [expanded, setExpanded] = React.useState(false);
-    const [queriesTimeFrame] = React.useState('1h');
-    const [latenciesTimeFrame] = React.useState('1h');
-    const [isActivityBarHidden, setIsActivityBarHidden] = React.useState(true);
-    // Refetch data only if activity bar successfully loaded
-    const shouldRefresh = isActivityBarHidden ? 0 : autoRefreshInterval;
-    /**
-     * Activity bar should be hidden, if charts are not enabled:
-     * 1. GraphShard is not enabled
-     * 2. ydb version does not have /viewer/json/render endpoint (400, 404, CORS error, etc.)
-     *
-     * If at least one chart successfully loaded, activity bar should be shown
-     * @link https://github.com/ydb-platform/ydb-embedded-ui/issues/659
-     * @todo disable only for specific errors ('GraphShard is not enabled') after ydb-stable-24 is generally used
-     */
-    const handleChartDataStatusChange = React.useCallback((chartStatus) => {
-        if (chartStatus === 'success') {
-            setIsActivityBarHidden(false);
-        }
-    }, []);
-    // Fetch running queries
-    const { data: runningQueriesData } = topQueriesApi.useGetRunningQueriesQuery({
-        database: tenantName,
-        filters: {},
-    }, { pollingInterval: shouldRefresh });
-    // Fetch queries per second data for header metrics
-    const { data: queriesPerSecData } = chartApi.useGetChartDataQuery({
-        database: tenantName,
-        metrics: [{ target: 'queries.requests' }],
-        timeFrame: queriesTimeFrame,
-        maxDataPoints: 30,
-    }, { pollingInterval: shouldRefresh });
-    // Fetch latency data for header metrics
-    const { data: latencyData } = chartApi.useGetChartDataQuery({
-        database: tenantName,
-        metrics: [{ target: 'queries.latencies.p99' }],
-        timeFrame: latenciesTimeFrame,
-        maxDataPoints: 30,
-    }, { pollingInterval: shouldRefresh });
-    const runningQueriesCount = ((_c = (_b = (_a = runningQueriesData === null || runningQueriesData === void 0 ? void 0 : runningQueriesData.resultSets) === null || _a === void 0 ? void 0 : _a[0]) === null || _b === void 0 ? void 0 : _b.result) === null || _c === void 0 ? void 0 : _c.length) || 0;
-    const qps = React.useMemo(() => { var _a, _b; return calculateQueriesPerSecond((_b = (_a = queriesPerSecData === null || queriesPerSecData === void 0 ? void 0 : queriesPerSecData.metrics) === null || _a === void 0 ? void 0 : _a[0]) === null || _b === void 0 ? void 0 : _b.data); }, [(_e = (_d = queriesPerSecData === null || queriesPerSecData === void 0 ? void 0 : queriesPerSecData.metrics) === null || _d === void 0 ? void 0 : _d[0]) === null || _e === void 0 ? void 0 : _e.data]);
-    const latency = React.useMemo(() => { var _a, _b; return calculateLatency((_b = (_a = latencyData === null || latencyData === void 0 ? void 0 : latencyData.metrics) === null || _a === void 0 ? void 0 : _a[0]) === null || _b === void 0 ? void 0 : _b.data); }, [(_g = (_f = latencyData === null || latencyData === void 0 ? void 0 : latencyData.metrics) === null || _f === void 0 ? void 0 : _f[0]) === null || _g === void 0 ? void 0 : _g.data]);
-    // Calculate unique applications and users
-    const uniqueApplications = React.useMemo(() => {
-        var _a, _b, _c;
-        const apps = new Set();
-        (_c = (_b = (_a = runningQueriesData === null || runningQueriesData === void 0 ? void 0 : runningQueriesData.resultSets) === null || _a === void 0 ? void 0 : _a[0]) === null || _b === void 0 ? void 0 : _b.result) === null || _c === void 0 ? void 0 : _c.forEach((row) => {
-            if (row.ApplicationName) {
-                apps.add(String(row.ApplicationName));
-            }
-        });
-        return apps.size;
-    }, [runningQueriesData]);
-    const uniqueUsers = React.useMemo(() => {
-        var _a, _b, _c;
-        const users = new Set();
-        (_c = (_b = (_a = runningQueriesData === null || runningQueriesData === void 0 ? void 0 : runningQueriesData.resultSets) === null || _a === void 0 ? void 0 : _a[0]) === null || _b === void 0 ? void 0 : _b.result) === null || _c === void 0 ? void 0 : _c.forEach((row) => {
-            if (row.UserSID) {
-                users.add(String(row.UserSID));
-            }
-        });
-        return users.size;
-    }, [runningQueriesData]);
-    const handleOpenRunningQueries = () => {
-        const queryParams = parseQuery(location);
-        const path = getTenantPath({
-            ...queryParams,
-            [TenantTabsGroups.diagnosticsTab]: TENANT_DIAGNOSTICS_TABS_IDS.topQueries,
-            queryMode: 'running',
-        });
-        history.push(path);
-    };
-    const handleToggleExpanded = () => {
-        setExpanded(!expanded);
-    };
-    return (_jsx("div", { className: b({ expanded }), style: { display: isActivityBarHidden ? 'none' : undefined }, children: _jsxs(Card, { className: b('card'), type: "container", view: expanded ? 'outlined' : 'raised', children: [_jsxs("div", { className: b('header'), onClick: handleToggleExpanded, children: [_jsxs(Flex, { justifyContent: "space-between", className: b('content-wrapper'), children: [_jsxs(Flex, { direction: "column", className: b('title-section'), children: [_jsx(Text, { variant: "subheader-2", className: b('title'), children: i18n('title_queries-activity') }), _jsx(Text, { color: "secondary", variant: "caption-2", className: b('subtitle'), children: i18n('context_monitor-changes-realtime') })] }), _jsxs("div", { className: b('metrics'), children: [_jsx(Label, { theme: runningQueriesCount > 0 ? 'success' : 'unknown', size: "s", icon: _jsx(Icon, { data: CirclePlay, size: 14 }), children: runningQueriesCount }), _jsx(Label, { theme: "clear", size: "s", icon: _jsx(Icon, { data: Rocket, size: 14 }), value: formatTrendValue(qps.trend.value), children: i18n('value_per-sec', { count: qps.value }) }), _jsx(Label, { theme: "clear", size: "s", icon: _jsx(Icon, { data: Clock, size: 14 }), value: formatTrendValue(latency.trend.value), children: i18n('value_ms', { time: latency.value }) })] })] }), _jsx(ArrowToggle, { direction: expanded ? 'top' : 'bottom' })] }), expanded && (_jsx("div", { className: b('content'), children: _jsxs("div", { className: b('stats'), children: [_jsx(Label, { theme: "unknown", icon: _jsx(Icon, { data: CirclePlay }), size: "s", value: String(runningQueriesCount), children: i18n('field_running-queries') }), _jsx(Label, { theme: "unknown", icon: _jsx(Icon, { data: Display }), size: "s", value: String(uniqueApplications), children: i18n('field_applications') }), _jsx(Label, { theme: "unknown", icon: _jsx(Icon, { data: Person }), size: "s", value: String(uniqueUsers), children: i18n('field_users') }), _jsx(Button, { view: "outlined", size: "s", onClick: handleOpenRunningQueries, className: b('open-queries-button'), children: i18n('action_open-running-queries') })] }) })), _jsx(QueriesActivityCharts, { tenantName: tenantName, expanded: expanded, onChartDataStatusChange: handleChartDataStatusChange })] }) }));
+    const { runningQueriesCount, uniqueApplications, uniqueUsers, qps, latency, areChartsAvailable } = useQueriesActivityData(tenantName);
+    // Show skeleton while determining chart availability
+    if (areChartsAvailable === null) {
+        return _jsx(QueriesActivitySkeleton, {});
+    }
+    // Render compact alert-style mode when charts are not available
+    if (areChartsAvailable === false) {
+        return (_jsx(QueriesActivityAlert, { runningQueriesCount: runningQueriesCount, uniqueApplications: uniqueApplications, uniqueUsers: uniqueUsers }));
+    }
+    // Render expandable mode when charts are available
+    return (_jsx(QueriesActivityExpandable, { tenantName: tenantName, runningQueriesCount: runningQueriesCount, uniqueApplications: uniqueApplications, uniqueUsers: uniqueUsers, qps: qps, latency: latency }));
 }
 //# sourceMappingURL=QueriesActivityBar.js.map

package/dist/components/QueriesActivityBar/QueriesActivityBar.js.map

@@ -1 +1 @@
-{"version":3,"file":"QueriesActivityBar.js","sourceRoot":"","sources":["../../../src/components/QueriesActivityBar/QueriesActivityBar.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"QueriesActivityBar.js","sourceRoot":"","sources":["../../../src/components/QueriesActivityBar/QueriesActivityBar.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAC,oBAAoB,EAAC,MAAM,wBAAwB,CAAC;AAC5D,OAAO,EAAC,yBAAyB,EAAC,MAAM,6BAA6B,CAAC;AACtE,OAAO,EAAC,uBAAuB,EAAC,MAAM,2BAA2B,CAAC;AAClE,OAAO,EAAC,sBAAsB,EAAC,MAAM,0BAA0B,CAAC;AAEhE,OAAO,2BAA2B,CAAC;AAMnC,MAAM,UAAU,kBAAkB,CAAC,EAAC,UAAU,EAA0B;IACpE,MAAM,EAAC,mBAAmB,EAAE,kBAAkB,EAAE,WAAW,EAAE,GAAG,EAAE,OAAO,EAAE,kBAAkB,EAAC,GAC1F,sBAAsB,CAAC,UAAU,CAAC,CAAC;IAEvC,qDAAqD;IACrD,IAAI,kBAAkB,KAAK,IAAI,EAAE,CAAC;QAC9B,OAAO,KAAC,uBAAuB,KAAG,CAAC;IACvC,CAAC;IAED,gEAAgE;IAChE,IAAI,kBAAkB,KAAK,KAAK,EAAE,CAAC;QAC/B,OAAO,CACH,KAAC,oBAAoB,IACjB,mBAAmB,EAAE,mBAAmB,EACxC,kBAAkB,EAAE,kBAAkB,EACtC,WAAW,EAAE,WAAW,GAC1B,CACL,CAAC;IACN,CAAC;IAED,mDAAmD;IACnD,OAAO,CACH,KAAC,yBAAyB,IACtB,UAAU,EAAE,UAAU,EACtB,mBAAmB,EAAE,mBAAmB,EACxC,kBAAkB,EAAE,kBAAkB,EACtC,WAAW,EAAE,WAAW,EACxB,GAAG,EAAE,GAAG,EACR,OAAO,EAAE,OAAO,GAClB,CACL,CAAC;AACN,CAAC"}

package/dist/components/QueriesActivityBar/QueriesActivityBar.scss

@@ -1,5 +1,3 @@
-@use '../../styles/mixins.scss';
-
 .queries-activity-bar {
     $b: &;
 
@@ -15,11 +13,6 @@
     }
 
     &__header {
-        display: flex;
-        justify-content: space-between;
-        align-items: center;
-        gap: var(--g-spacing-3);
-
         padding: var(--g-spacing-3) var(--g-spacing-4);
 
         cursor: pointer;
@@ -44,63 +37,24 @@
         }
     }
 
-    &__content-wrapper {
-        display: flex;
-        flex-grow: 1;
-        align-items: center;
-        gap: var(--g-spacing-2);
-    }
-
-    &__metrics {
-        display: flex;
-        align-items: center;
-        gap: var(--g-spacing-1);
-    }
-
     &__content {
-        display: flex;
-        flex-direction: column;
-        gap: var(--g-spacing-4);
-
         padding-top: var(--g-spacing-3);
         padding-bottom: var(--g-spacing-3);
     }
 
     &__stats {
-        display: flex;
-        flex-wrap: wrap;
-        align-items: center;
-        gap: var(--g-spacing-1);
-
         padding: 0 var(--g-spacing-4);
     }
 
     &__open-queries-button {
-        margin-left: 4px;
+        margin-left: var(--g-spacing-1);
     }
 
     &__charts {
-        display: flex;
-        gap: var(--g-spacing-4);
-
         padding: 0 var(--g-spacing-4);
 
         @media (max-width: 1200px) {
-            flex-direction: column;
+            flex-direction: column !important;
         }
     }
-
-    &__chart-container {
-        display: flex;
-        flex: 1;
-        flex-direction: column;
-        gap: var(--g-spacing-3);
-    }
-
-    // Focus states for accessibility
-    &__header:focus-visible,
-    &__open-queries-button:focus-visible {
-        outline: 2px solid var(--g-color-line-focus);
-        outline-offset: 2px;
-    }
 }

package/dist/components/QueriesActivityBar/QueriesActivityCharts.js

@@ -1,11 +1,14 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import React from 'react';
+import { Flex } from '@gravity-ui/uikit';
 import { defaultDashboardConfig } from '../../containers/Tenant/Diagnostics/TenantOverview/DefaultOverviewContent/defaultDashboardConfig';
 import { cn } from '../../utils/cn';
 import { useAutoRefreshInterval } from '../../utils/hooks';
 import { MetricChart } from '../MetricChart/MetricChart';
 const b = cn('queries-activity-bar');
-const ACTIVITY_CHART_HEIGHT = 292;
+const LEGEND_HEIGHT = 34.5;
+const QUERIES_PER_SECOND_CHART_HEIGHT = 292;
+const QUERIES_LATENCIES_CHART_HEIGHT = 292 + LEGEND_HEIGHT;
 export function QueriesActivityCharts({ tenantName, expanded, onChartDataStatusChange, }) {
     const [autoRefreshInterval] = useAutoRefreshInterval();
     const [hasChartsLoaded, setHasChartsLoaded] = React.useState(false);
@@ -35,6 +38,6 @@ export function QueriesActivityCharts({ tenantName, expanded, onChartDataStatusC
     // that use CSS transforms or have complex nested DOM structures. The tooltip initialization
     // fails when the chart is not immediately visible during mounting.
     // TODO: Remove this workaround once the upstream issue is fixed
-    return (_jsxs("div", { className: b('charts'), style: { display: expanded ? undefined : 'none' }, children: [_jsx("div", { className: b('chart-container'), children: _jsx(MetricChart, { database: tenantName, metrics: queriesChartConfig.metrics, autorefresh: shouldRefresh, height: ACTIVITY_CHART_HEIGHT, chartOptions: queriesChartConfig.options, onChartDataStatusChange: handleChartDataStatusChange, isChartVisible: hasChartsLoaded && expanded, title: queriesChartConfig.title }) }), _jsx("div", { className: b('chart-container'), children: _jsx(MetricChart, { database: tenantName, metrics: latenciesChartConfig.metrics, autorefresh: shouldRefresh, height: ACTIVITY_CHART_HEIGHT, chartOptions: latenciesChartConfig.options, onChartDataStatusChange: handleChartDataStatusChange, isChartVisible: hasChartsLoaded && expanded, title: latenciesChartConfig.title }) })] }));
+    return (_jsxs(Flex, { className: b('charts'), gap: 4, direction: "row", style: { display: expanded ? undefined : 'none' }, children: [_jsx(Flex, { direction: "column", gap: 3, grow: true, children: _jsx(MetricChart, { database: tenantName, metrics: queriesChartConfig.metrics, autorefresh: shouldRefresh, height: QUERIES_PER_SECOND_CHART_HEIGHT, chartOptions: queriesChartConfig.options, onChartDataStatusChange: handleChartDataStatusChange, isChartVisible: hasChartsLoaded && expanded, title: queriesChartConfig.title }) }), _jsx(Flex, { direction: "column", gap: 3, grow: true, children: _jsx(MetricChart, { database: tenantName, metrics: latenciesChartConfig.metrics, autorefresh: shouldRefresh, height: QUERIES_LATENCIES_CHART_HEIGHT, chartOptions: latenciesChartConfig.options, onChartDataStatusChange: handleChartDataStatusChange, isChartVisible: hasChartsLoaded && expanded, title: latenciesChartConfig.title }) })] }));
 }
 //# sourceMappingURL=QueriesActivityCharts.js.map

package/dist/components/QueriesActivityBar/QueriesActivityCharts.js.map

@@ -1 +1 @@
-{"version":3,"file":"QueriesActivityCharts.js","sourceRoot":"","sources":["../../../src/components/QueriesActivityBar/QueriesActivityCharts.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"QueriesActivityCharts.js","sourceRoot":"","sources":["../../../src/components/QueriesActivityBar/QueriesActivityCharts.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAC,IAAI,EAAC,MAAM,mBAAmB,CAAC;AAEvC,OAAO,EAAC,sBAAsB,EAAC,MAAM,kGAAkG,CAAC;AACxI,OAAO,EAAC,EAAE,EAAC,MAAM,gBAAgB,CAAC;AAClC,OAAO,EAAC,sBAAsB,EAAC,MAAM,mBAAmB,CAAC;AACzD,OAAO,EAAC,WAAW,EAAC,MAAM,4BAA4B,CAAC;AAGvD,MAAM,CAAC,GAAG,EAAE,CAAC,sBAAsB,CAAC,CAAC;AAQrC,MAAM,aAAa,GAAG,IAAI,CAAC;AAC3B,MAAM,+BAA+B,GAAG,GAAG,CAAC;AAC5C,MAAM,8BAA8B,GAAG,GAAG,GAAG,aAAa,CAAC;AAE3D,MAAM,UAAU,qBAAqB,CAAC,EAClC,UAAU,EACV,QAAQ,EACR,uBAAuB,GACE;IACzB,MAAM,CAAC,mBAAmB,CAAC,GAAG,sBAAsB,EAAE,CAAC;IACvD,MAAM,CAAC,eAAe,EAAE,kBAAkB,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC;IAEpE,2DAA2D;IAC3D,MAAM,gBAAgB,GAAG,CAAC,MAAc,EAAE,EAAE;QACxC,OAAO,sBAAsB,CAAC,IAAI,CAAC,CAAC,KAAK,EAAE,EAAE,CACzC,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC,MAAM,EAAE,EAAE,CAAC,MAAM,CAAC,MAAM,KAAK,MAAM,CAAC,CAC3D,CAAC;IACN,CAAC,CAAC;IAEF,MAAM,kBAAkB,GAAG,gBAAgB,CAAC,kBAAkB,CAAC,CAAC;IAChE,MAAM,oBAAoB,GAAG,gBAAgB,CAAC,uBAAuB,CAAC,CAAC;IAEvE,gDAAgD;IAChD,IAAI,CAAC,kBAAkB,IAAI,CAAC,oBAAoB,EAAE,CAAC;QAC/C,OAAO,CAAC,IAAI,CAAC,mEAAmE,CAAC,CAAC;QAClF,OAAO,IAAI,CAAC;IAChB,CAAC;IAED,qEAAqE;IACrE,MAAM,aAAa,GAAG,eAAe,CAAC,CAAC,CAAC,mBAAmB,CAAC,CAAC,CAAC,CAAC,CAAC;IAEhE,MAAM,2BAA2B,GAAG,KAAK,CAAC,WAAW,CACjD,CAAC,MAAuB,EAAE,EAAE;QACxB,IAAI,MAAM,KAAK,SAAS,EAAE,CAAC;YACvB,kBAAkB,CAAC,IAAI,CAAC,CAAC;QAC7B,CAAC;QACD,wCAAwC;QACxC,uBAAuB,aAAvB,uBAAuB,uBAAvB,uBAAuB,CAAG,MAAM,CAAC,CAAC;IACtC,CAAC,EACD,CAAC,uBAAuB,CAAC,CAC5B,CAAC;IAEF,uFAAuF;IACvF,uDAAuD;IAEvD,0FAA0F;IAC1F,4FAA4F;IAC5F,mEAAmE;IAEnE,gEAAgE;IAEhE,OAAO,CACH,MAAC,IAAI,IACD,SAAS,EAAE,CAAC,CAAC,QAAQ,CAAC,EACtB,GAAG,EAAE,CAAC,EACN,SAAS,EAAC,KAAK,EACf,KAAK,EAAE,EAAC,OAAO,EAAE,QAAQ,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,MAAM,EAAC,aAE/C,KAAC,IAAI,IAAC,SAAS,EAAC,QAAQ,EAAC,GAAG,EAAE,CAAC,EAAE,IAAI,kBACjC,KAAC,WAAW,IACR,QAAQ,EAAE,UAAU,EACpB,OAAO,EAAE,kBAAkB,CAAC,OAAO,EACnC,WAAW,EAAE,aAAa,EAC1B,MAAM,EAAE,+BAA+B,EACvC,YAAY,EAAE,kBAAkB,CAAC,OAAO,EACxC,uBAAuB,EAAE,2BAA2B,EACpD,cAAc,EAAE,eAAe,IAAI,QAAQ,EAC3C,KAAK,EAAE,kBAAkB,CAAC,KAAK,GACjC,GACC,EAEP,KAAC,IAAI,IAAC,SAAS,EAAC,QAAQ,EAAC,GAAG,EAAE,CAAC,EAAE,IAAI,kBACjC,KAAC,WAAW,IACR,QAAQ,EAAE,UAAU,EACpB,OAAO,EAAE,oBAAoB,CAAC,OAAO,EACrC,WAAW,EAAE,aAAa,EAC1B,MAAM,EAAE,8BAA8B,EACtC,YAAY,EAAE,oBAAoB,CAAC,OAAO,EAC1C,uBAAuB,EAAE,2BAA2B,EACpD,cAAc,EAAE,eAAe,IAAI,QAAQ,EAC3C,KAAK,EAAE,oBAAoB,CAAC,KAAK,GACnC,GACC,IACJ,CACV,CAAC;AACN,CAAC"}

package/dist/components/QueriesActivityBar/QueriesActivityExpandable.d.ts

@@ -0,0 +1,21 @@
+import './QueriesActivityBar.scss';
+interface QueriesActivityExpandableProps {
+    tenantName: string;
+    runningQueriesCount: number;
+    uniqueApplications: number;
+    uniqueUsers: number;
+    qps?: {
+        value?: string;
+        trend?: {
+            value?: number;
+        };
+    };
+    latency?: {
+        value?: string;
+        trend?: {
+            value?: number;
+        };
+    };
+}
+export declare function QueriesActivityExpandable({ tenantName, runningQueriesCount, uniqueApplications, uniqueUsers, qps, latency, }: QueriesActivityExpandableProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/QueriesActivityBar/QueriesActivityExpandable.js

@@ -0,0 +1,34 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import React from 'react';
+import { CirclePlay, Clock, Display, Person, Rocket } from '@gravity-ui/icons';
+import { ArrowToggle, Button, Card, Flex, Icon, Label, Text } from '@gravity-ui/uikit';
+import { useHistory, useLocation } from 'react-router-dom';
+import { TenantTabsGroups, getTenantPath } from '../../containers/Tenant/TenantPages';
+import { parseQuery } from '../../routes';
+import { TENANT_DIAGNOSTICS_TABS_IDS } from '../../store/reducers/tenant/constants';
+import { cn } from '../../utils/cn';
+import { QueriesActivityCharts } from './QueriesActivityCharts';
+import i18n from './i18n';
+import { formatTrendValue } from './utils';
+import './QueriesActivityBar.scss';
+const b = cn('queries-activity-bar');
+export function QueriesActivityExpandable({ tenantName, runningQueriesCount, uniqueApplications, uniqueUsers, qps, latency, }) {
+    var _a, _b, _c, _d, _e, _f;
+    const history = useHistory();
+    const location = useLocation();
+    const [expanded, setExpanded] = React.useState(false);
+    const handleOpenRunningQueries = () => {
+        const queryParams = parseQuery(location);
+        const path = getTenantPath({
+            ...queryParams,
+            [TenantTabsGroups.diagnosticsTab]: TENANT_DIAGNOSTICS_TABS_IDS.topQueries,
+            queryMode: 'running',
+        });
+        history.push(path);
+    };
+    const handleToggleExpanded = () => {
+        setExpanded(!expanded);
+    };
+    return (_jsx("div", { className: b({ expanded }), children: _jsxs(Card, { className: b('card'), type: "container", view: expanded ? 'outlined' : 'raised', children: [_jsxs(Flex, { className: b('header'), onClick: handleToggleExpanded, justifyContent: "space-between", alignItems: "center", gap: 3, children: [_jsxs(Flex, { direction: "column", children: [_jsx(Text, { variant: "subheader-2", className: b('title'), children: i18n('title_queries-activity') }), _jsx(Text, { color: "secondary", variant: "caption-2", className: b('subtitle'), children: i18n('context_monitor-changes-realtime') })] }), _jsxs(Flex, { alignItems: "center", gap: 4, children: [_jsxs(Flex, { alignItems: "center", gap: 1, children: [_jsx(Label, { theme: runningQueriesCount > 0 ? 'success' : 'unknown', size: "s", icon: _jsx(Icon, { data: CirclePlay, size: 14 }), children: runningQueriesCount }), _jsx(Label, { theme: "unknown", icon: _jsx(Icon, { data: Rocket }), size: "s", value: formatTrendValue((_b = (_a = qps === null || qps === void 0 ? void 0 : qps.trend) === null || _a === void 0 ? void 0 : _a.value) !== null && _b !== void 0 ? _b : 0), children: i18n('value_per-sec', { count: (_c = qps === null || qps === void 0 ? void 0 : qps.value) !== null && _c !== void 0 ? _c : '0' }) }), _jsx(Label, { theme: "unknown", icon: _jsx(Icon, { data: Clock }), size: "s", value: formatTrendValue((_e = (_d = latency === null || latency === void 0 ? void 0 : latency.trend) === null || _d === void 0 ? void 0 : _d.value) !== null && _e !== void 0 ? _e : 0), children: i18n('value_ms', { time: (_f = latency === null || latency === void 0 ? void 0 : latency.value) !== null && _f !== void 0 ? _f : '0' }) })] }), _jsx(ArrowToggle, { direction: expanded ? 'top' : 'bottom', size: 16 })] })] }), expanded && (_jsx(Flex, { direction: "column", gap: 4, className: b('content'), children: _jsxs(Flex, { wrap: true, alignItems: "center", gap: 1, className: b('stats'), children: [_jsx(Label, { theme: "unknown", icon: _jsx(Icon, { data: CirclePlay }), size: "s", value: String(runningQueriesCount), children: i18n('field_running-queries') }), _jsx(Label, { theme: "unknown", icon: _jsx(Icon, { data: Display }), size: "s", value: String(uniqueApplications), children: i18n('field_applications') }), _jsx(Label, { theme: "unknown", icon: _jsx(Icon, { data: Person }), size: "s", value: String(uniqueUsers), children: i18n('field_users') }), runningQueriesCount > 0 && (_jsx(Button, { view: "outlined", size: "s", onClick: handleOpenRunningQueries, className: b('open-queries-button'), children: i18n('action_open-running-queries') }))] }) })), _jsx(QueriesActivityCharts, { tenantName: tenantName, expanded: expanded })] }) }));
+}
+//# sourceMappingURL=QueriesActivityExpandable.js.map

package/dist/components/QueriesActivityBar/QueriesActivityExpandable.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"QueriesActivityExpandable.js","sourceRoot":"","sources":["../../../src/components/QueriesActivityBar/QueriesActivityExpandable.tsx"],"names":[],"mappings":"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"}

package/dist/components/QueriesActivityBar/QueriesActivitySkeleton.d.ts

@@ -0,0 +1,2 @@
+import './QueriesActivitySkeleton.scss';
+export declare function QueriesActivitySkeleton(): import("react/jsx-runtime").JSX.Element;

package/dist/components/QueriesActivityBar/QueriesActivitySkeleton.js

@@ -0,0 +1,9 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Skeleton } from '@gravity-ui/uikit';
+import { cn } from '../../utils/cn';
+import './QueriesActivitySkeleton.scss';
+const b = cn('queries-activity-skeleton');
+export function QueriesActivitySkeleton() {
+    return _jsx(Skeleton, { className: b('skeleton') });
+}
+//# sourceMappingURL=QueriesActivitySkeleton.js.map

package/dist/components/QueriesActivityBar/QueriesActivitySkeleton.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"QueriesActivitySkeleton.js","sourceRoot":"","sources":["../../../src/components/QueriesActivityBar/QueriesActivitySkeleton.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAC,QAAQ,EAAC,MAAM,mBAAmB,CAAC;AAE3C,OAAO,EAAC,EAAE,EAAC,MAAM,gBAAgB,CAAC;AAElC,OAAO,gCAAgC,CAAC;AAExC,MAAM,CAAC,GAAG,EAAE,CAAC,2BAA2B,CAAC,CAAC;AAE1C,MAAM,UAAU,uBAAuB;IACnC,OAAO,KAAC,QAAQ,IAAC,SAAS,EAAE,CAAC,CAAC,UAAU,CAAC,GAAI,CAAC;AAClD,CAAC"}

package/dist/components/QueriesActivityBar/QueriesActivitySkeleton.scss

@@ -0,0 +1,6 @@
+.queries-activity-skeleton {
+    &__skeleton {
+        width: 100%;
+        height: 62px;
+    }
+}

package/dist/components/QueriesActivityBar/useQueriesActivityData.d.ts

@@ -0,0 +1,11 @@
+import { calculateLatency, calculateQueriesPerSecond } from './utils';
+interface UseQueriesActivityDataResult {
+    runningQueriesCount: number;
+    uniqueApplications: number;
+    uniqueUsers: number;
+    qps: ReturnType<typeof calculateQueriesPerSecond>;
+    latency: ReturnType<typeof calculateLatency>;
+    areChartsAvailable: boolean | null;
+}
+export declare function useQueriesActivityData(tenantName: string): UseQueriesActivityDataResult;
+export {};