ydb-embedded-ui 8.26.2 → 9.1.0

package/dist/containers/Tenant/Diagnostics/TopQueries/RunningQueriesData.js

@@ -1,6 +1,8 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import React from 'react';
 import { TableColumnSetup } from '@gravity-ui/uikit';
+import { isEqual } from 'lodash';
+import { DrawerWrapper } from '../../../../components/Drawer';
 import { ResponseError } from '../../../../components/Errors/ResponseError';
 import { ResizeableDataTable } from '../../../../components/ResizeableDataTable/ResizeableDataTable';
 import { Search } from '../../../../components/Search';
@@ -10,16 +12,20 @@ import { cn } from '../../../../utils/cn';
 import { useAutoRefreshInterval, useTypedSelector } from '../../../../utils/hooks';
 import { useSelectedColumns } from '../../../../utils/hooks/useSelectedColumns';
 import { parseQueryErrorToString } from '../../../../utils/query';
+import { QueryDetailsDrawerContent } from './QueryDetails/QueryDetailsDrawerContent';
 import { getRunningQueriesColumns } from './columns/columns';
 import { DEFAULT_RUNNING_QUERIES_COLUMNS, QUERIES_COLUMNS_TITLES, REQUIRED_RUNNING_QUERIES_COLUMNS, RUNNING_QUERIES_COLUMNS_WIDTH_LS_KEY, RUNNING_QUERIES_SELECTED_COLUMNS_LS_KEY, } from './columns/constants';
 import { useRunningQueriesSort } from './hooks/useRunningQueriesSort';
 import i18n from './i18n';
 import { TOP_QUERIES_TABLE_SETTINGS } from './utils';
 const b = cn('kv-top-queries');
-export const RunningQueriesData = ({ tenantName, renderQueryModeControl, onRowClick, handleTextSearchUpdate, }) => {
-    var _a;
+export const RunningQueriesData = ({ tenantName, renderQueryModeControl, handleTextSearchUpdate, }) => {
+    var _a, _b;
     const [autoRefreshInterval] = useAutoRefreshInterval();
     const filters = useTypedSelector((state) => state.executeTopQueries);
+    // Internal state for selected row
+    // null is reserved for not found state
+    const [selectedRow, setSelectedRow] = React.useState(undefined);
     // Get columns for running queries
     const columns = React.useMemo(() => {
         return getRunningQueriesColumns();
@@ -27,14 +33,29 @@ export const RunningQueriesData = ({ tenantName, renderQueryModeControl, onRowCl
     // Use selected columns hook
     const { columnsToShow, columnsToSelect, setColumns } = useSelectedColumns(columns, RUNNING_QUERIES_SELECTED_COLUMNS_LS_KEY, QUERIES_COLUMNS_TITLES, DEFAULT_RUNNING_QUERIES_COLUMNS, REQUIRED_RUNNING_QUERIES_COLUMNS);
     const { tableSort, handleTableSort, backendSort } = useRunningQueriesSort();
-    const { currentData, data, isFetching, isLoading, error } = topQueriesApi.useGetRunningQueriesQuery({
+    const { currentData, isFetching, isLoading, error } = topQueriesApi.useGetRunningQueriesQuery({
         database: tenantName,
         filters,
         sortOrder: backendSort,
     }, { pollingInterval: autoRefreshInterval });
-    const handleRowClick = (row) => {
-        return onRowClick(row.QueryText);
-    };
-    return (_jsxs(TableWithControlsLayout, { children: [_jsxs(TableWithControlsLayout.Controls, { children: [renderQueryModeControl(), _jsx(Search, { value: filters.text, onChange: handleTextSearchUpdate, placeholder: i18n('filter.text.placeholder'), className: b('search') }), _jsx(TableColumnSetup, { popupWidth: 200, items: columnsToSelect, showStatus: true, onUpdate: setColumns, sortable: false })] }), error ? _jsx(ResponseError, { error: parseQueryErrorToString(error) }) : null, _jsx(TableWithControlsLayout.Table, { loading: isLoading, children: _jsx(ResizeableDataTable, { emptyDataMessage: i18n('no-data'), columnsWidthLSKey: RUNNING_QUERIES_COLUMNS_WIDTH_LS_KEY, columns: columnsToShow, data: ((_a = data === null || data === void 0 ? void 0 : data.resultSets) === null || _a === void 0 ? void 0 : _a[0].result) || [], loading: isFetching && currentData === undefined, settings: TOP_QUERIES_TABLE_SETTINGS, onRowClick: handleRowClick, rowClassName: () => b('row'), sortOrder: tableSort, onSort: handleTableSort }) })] }));
+    const rows = (_b = (_a = currentData === null || currentData === void 0 ? void 0 : currentData.resultSets) === null || _a === void 0 ? void 0 : _a[0]) === null || _b === void 0 ? void 0 : _b.result;
+    const isDrawerVisible = selectedRow !== undefined;
+    const handleCloseDetails = React.useCallback(() => {
+        setSelectedRow(undefined);
+    }, [setSelectedRow]);
+    const renderDrawerContent = React.useCallback(() => _jsx(QueryDetailsDrawerContent, { row: selectedRow, onClose: handleCloseDetails }), [selectedRow, handleCloseDetails]);
+    const onRowClick = React.useCallback((row, _index, event) => {
+        event === null || event === void 0 ? void 0 : event.stopPropagation();
+        setSelectedRow(row);
+    }, [setSelectedRow]);
+    const inputRef = React.useRef(null);
+    React.useEffect(() => {
+        var _a;
+        if (isDrawerVisible) {
+            (_a = inputRef.current) === null || _a === void 0 ? void 0 : _a.blur();
+        }
+    }, [isDrawerVisible]);
+    const drawerControls = React.useMemo(() => [{ type: 'close' }], []);
+    return (_jsx(DrawerWrapper, { isDrawerVisible: isDrawerVisible, onCloseDrawer: handleCloseDetails, renderDrawerContent: renderDrawerContent, drawerId: "running-query-details", storageKey: "running-queries-drawer-width", detectClickOutside: true, isPercentageWidth: true, title: i18n('query-details.title'), drawerControls: drawerControls, children: _jsxs(TableWithControlsLayout, { children: [_jsxs(TableWithControlsLayout.Controls, { children: [renderQueryModeControl(), _jsx(Search, { value: filters.text, onChange: handleTextSearchUpdate, placeholder: i18n('filter.text.placeholder'), className: b('search'), inputRef: inputRef }), _jsx(TableColumnSetup, { popupWidth: 200, items: columnsToSelect, showStatus: true, onUpdate: setColumns, sortable: false })] }), error ? _jsx(ResponseError, { error: parseQueryErrorToString(error) }) : null, _jsx(TableWithControlsLayout.Table, { loading: isLoading, children: _jsx(ResizeableDataTable, { emptyDataMessage: i18n('no-data'), columnsWidthLSKey: RUNNING_QUERIES_COLUMNS_WIDTH_LS_KEY, columns: columnsToShow, data: rows || [], loading: isFetching && currentData === undefined, settings: TOP_QUERIES_TABLE_SETTINGS, onRowClick: onRowClick, rowClassName: (row) => b('row', { active: isEqual(row, selectedRow) }), sortOrder: tableSort, onSort: handleTableSort }) })] }) }));
 };
 //# sourceMappingURL=RunningQueriesData.js.map

package/dist/containers/Tenant/Diagnostics/TopQueries/RunningQueriesData.js.map

@@ -1 +1 @@
-{"version":3,"file":"RunningQueriesData.js","sourceRoot":"","sources":["../../../../../src/containers/Tenant/Diagnostics/TopQueries/RunningQueriesData.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"RunningQueriesData.js","sourceRoot":"","sources":["../../../../../src/containers/Tenant/Diagnostics/TopQueries/RunningQueriesData.tsx"],"names":[],"mappings":"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"}

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

@@ -1,16 +1,10 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import React from 'react';
 import { RadioButton } from '@gravity-ui/uikit';
-import { useHistory, useLocation } from 'react-router-dom';
 import { StringParam, useQueryParam } from 'use-query-params';
 import { z } from 'zod';
-import { parseQuery } from '../../../../routes';
 import { setTopQueriesFilters } from '../../../../store/reducers/executeTopQueries/executeTopQueries';
-import { changeUserInput, setIsDirty } from '../../../../store/reducers/query/query';
-import { TENANT_PAGE, TENANT_PAGES_IDS, TENANT_QUERY_TABS_ID, } from '../../../../store/reducers/tenant/constants';
 import { useTypedDispatch } from '../../../../utils/hooks';
-import { useChangeInputWithConfirmation } from '../../../../utils/hooks/withConfirmation/useChangeInputWithConfirmation';
-import { TenantTabsGroups, getTenantPath } from '../../TenantPages';
 import { RunningQueriesData } from './RunningQueriesData';
 import { TopQueriesData } from './TopQueriesData';
 import { TimeFrameIds } from './constants';
@@ -38,25 +32,11 @@ const queryModeSchema = z.nativeEnum(QueryModeIds).catch(QueryModeIds.top);
 const timeFrameSchema = z.nativeEnum(TimeFrameIds).catch(TimeFrameIds.hour);
 export const TopQueries = ({ tenantName }) => {
     const dispatch = useTypedDispatch();
-    const location = useLocation();
-    const history = useHistory();
-    const [_queryMode = QueryModeIds.top, setQueryMode] = useQueryParam('queryMode', StringParam);
-    const [_timeFrame = TimeFrameIds.hour, setTimeFrame] = useQueryParam('timeFrame', StringParam);
-    const queryMode = queryModeSchema.parse(_queryMode);
-    const timeFrame = timeFrameSchema.parse(_timeFrame);
+    const [rawQueryMode = QueryModeIds.top, setQueryMode] = useQueryParam('queryMode', StringParam);
+    const [rawTimeFrame = TimeFrameIds.hour, setTimeFrame] = useQueryParam('timeFrame', StringParam);
+    const queryMode = queryModeSchema.parse(rawQueryMode);
+    const timeFrame = timeFrameSchema.parse(rawTimeFrame);
     const isTopQueries = queryMode === QueryModeIds.top;
-    const applyRowClick = React.useCallback((input) => {
-        dispatch(changeUserInput({ input }));
-        dispatch(setIsDirty(false));
-        const queryParams = parseQuery(location);
-        const queryPath = getTenantPath({
-            ...queryParams,
-            [TENANT_PAGE]: TENANT_PAGES_IDS.query,
-            [TenantTabsGroups.queryTab]: TENANT_QUERY_TABS_ID.newQuery,
-        });
-        history.push(queryPath);
-    }, [dispatch, history, location]);
-    const onRowClick = useChangeInputWithConfirmation(applyRowClick);
     const handleTextSearchUpdate = (text) => {
         dispatch(setTopQueriesFilters({ text }));
     };
@@ -69,6 +49,6 @@ export const TopQueries = ({ tenantName }) => {
     const renderQueryModeControl = React.useCallback(() => {
         return (_jsx(RadioButton, { options: QUERY_MODE_OPTIONS, value: queryMode, onUpdate: setQueryMode }));
     }, [queryMode, setQueryMode]);
-    return isTopQueries ? (_jsx(TopQueriesData, { tenantName: tenantName, timeFrame: timeFrame, renderQueryModeControl: renderQueryModeControl, onRowClick: onRowClick, handleTimeFrameChange: handleTimeFrameChange, handleDateRangeChange: handleDateRangeChange, handleTextSearchUpdate: handleTextSearchUpdate })) : (_jsx(RunningQueriesData, { tenantName: tenantName, renderQueryModeControl: renderQueryModeControl, onRowClick: onRowClick, handleTextSearchUpdate: handleTextSearchUpdate }));
+    return isTopQueries ? (_jsx(TopQueriesData, { tenantName: tenantName, timeFrame: timeFrame, renderQueryModeControl: renderQueryModeControl, handleTimeFrameChange: handleTimeFrameChange, handleDateRangeChange: handleDateRangeChange, handleTextSearchUpdate: handleTextSearchUpdate })) : (_jsx(RunningQueriesData, { tenantName: tenantName, renderQueryModeControl: renderQueryModeControl, handleTextSearchUpdate: handleTextSearchUpdate }));
 };
 //# sourceMappingURL=TopQueries.js.map

package/dist/containers/Tenant/Diagnostics/TopQueries/TopQueries.js.map

@@ -1 +1 @@
-{"version":3,"file":"TopQueries.js","sourceRoot":"","sources":["../../../../../src/containers/Tenant/Diagnostics/TopQueries/TopQueries.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"TopQueries.js","sourceRoot":"","sources":["../../../../../src/containers/Tenant/Diagnostics/TopQueries/TopQueries.tsx"],"names":[],"mappings":"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"}

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

@@ -14,6 +14,14 @@
 
     &__row {
         cursor: pointer;
+
+        &_active {
+            background-color: var(--g-color-base-selection);
+
+            &:hover {
+                background: var(--g-color-base-selection-hover) !important;
+            }
+        }
     }
 
     &__query {
@@ -32,4 +40,25 @@
 
         text-overflow: ellipsis;
     }
+
+    &__drawer {
+        margin-top: calc(-1 * var(--g-spacing-4));
+    }
+
+    &__empty-state-icon {
+        color: var(--g-color-text-primary);
+    }
+
+    &__not-found-container {
+        height: 100%;
+        padding: var(--g-spacing-5) 0;
+    }
+
+    &__not-found-description {
+        margin-top: var(--g-spacing-2);
+    }
+
+    &__not-found-close {
+        margin-top: var(--g-spacing-5);
+    }
 }

package/dist/containers/Tenant/Diagnostics/TopQueries/TopQueriesData.d.ts

@@ -5,10 +5,9 @@ interface TopQueriesDataProps {
     tenantName: string;
     timeFrame: TimeFrame;
     renderQueryModeControl: () => React.ReactNode;
-    onRowClick: (query: string) => void;
     handleTimeFrameChange: (value: string[]) => void;
     handleDateRangeChange: (value: DateRangeValues) => void;
     handleTextSearchUpdate: (text: string) => void;
 }
-export declare const TopQueriesData: ({ tenantName, timeFrame, renderQueryModeControl, onRowClick, handleTimeFrameChange, handleDateRangeChange, handleTextSearchUpdate, }: TopQueriesDataProps) => import("react/jsx-runtime").JSX.Element;
+export declare const TopQueriesData: ({ tenantName, timeFrame, renderQueryModeControl, handleTimeFrameChange, handleDateRangeChange, handleTextSearchUpdate, }: TopQueriesDataProps) => import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/containers/Tenant/Diagnostics/TopQueries/TopQueriesData.js

@@ -1,7 +1,9 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import React from 'react';
 import { Select, TableColumnSetup } from '@gravity-ui/uikit';
+import { isEqual } from 'lodash';
 import { DateRange } from '../../../../components/DateRange';
+import { DrawerWrapper } from '../../../../components/Drawer';
 import { ResponseError } from '../../../../components/Errors/ResponseError';
 import { ResizeableDataTable } from '../../../../components/ResizeableDataTable/ResizeableDataTable';
 import { Search } from '../../../../components/Search';
@@ -11,34 +13,61 @@ import { cn } from '../../../../utils/cn';
 import { useAutoRefreshInterval, useTypedSelector } from '../../../../utils/hooks';
 import { useSelectedColumns } from '../../../../utils/hooks/useSelectedColumns';
 import { parseQueryErrorToString } from '../../../../utils/query';
+import { QueryDetailsDrawerContent } from './QueryDetails/QueryDetailsDrawerContent';
 import { getTopQueriesColumns } from './columns/columns';
 import { DEFAULT_TOP_QUERIES_COLUMNS, QUERIES_COLUMNS_TITLES, REQUIRED_TOP_QUERIES_COLUMNS, TOP_QUERIES_COLUMNS_WIDTH_LS_KEY, TOP_QUERIES_SELECTED_COLUMNS_LS_KEY, } from './columns/constants';
 import { DEFAULT_TIME_FILTER_VALUE, TIME_FRAME_OPTIONS } from './constants';
+import { useSetSelectedTopQueryRowFromParams } from './hooks/useSetSelectedTopQueryRowFromParams';
 import { useTopQueriesSort } from './hooks/useTopQueriesSort';
 import i18n from './i18n';
 import { TOP_QUERIES_TABLE_SETTINGS } from './utils';
+import { generateShareableUrl } from './utils/generateShareableUrl';
 const b = cn('kv-top-queries');
-export const TopQueriesData = ({ tenantName, timeFrame, renderQueryModeControl, onRowClick, handleTimeFrameChange, handleDateRangeChange, handleTextSearchUpdate, }) => {
-    var _a;
+export const TopQueriesData = ({ tenantName, timeFrame, renderQueryModeControl, handleTimeFrameChange, handleDateRangeChange, handleTextSearchUpdate, }) => {
+    var _a, _b;
     const [autoRefreshInterval] = useAutoRefreshInterval();
     const filters = useTypedSelector((state) => state.executeTopQueries);
+    // Internal state for selected row
+    // null is reserved for not found state
+    const [selectedRow, setSelectedRow] = React.useState(undefined);
     // Get columns for top queries
     const columns = React.useMemo(() => {
         return getTopQueriesColumns();
     }, []);
     // Use selected columns hook
     const { columnsToShow, columnsToSelect, setColumns } = useSelectedColumns(columns, TOP_QUERIES_SELECTED_COLUMNS_LS_KEY, QUERIES_COLUMNS_TITLES, DEFAULT_TOP_QUERIES_COLUMNS, REQUIRED_TOP_QUERIES_COLUMNS);
-    // Use the sort params from URL in the hook
     const { tableSort, handleTableSort, backendSort } = useTopQueriesSort();
-    const { currentData, data, isFetching, isLoading, error } = topQueriesApi.useGetTopQueriesQuery({
+    const { currentData, isFetching, isLoading, error } = topQueriesApi.useGetTopQueriesQuery({
         database: tenantName,
         filters,
         sortOrder: backendSort,
         timeFrame,
     }, { pollingInterval: autoRefreshInterval });
-    const handleRowClick = (row) => {
-        return onRowClick(row.QueryText);
-    };
-    return (_jsxs(TableWithControlsLayout, { children: [_jsxs(TableWithControlsLayout.Controls, { children: [renderQueryModeControl(), _jsx(Select, { options: TIME_FRAME_OPTIONS, value: [timeFrame], onUpdate: handleTimeFrameChange }), _jsx(DateRange, { from: filters.from, to: filters.to, onChange: handleDateRangeChange, defaultValue: DEFAULT_TIME_FILTER_VALUE }), _jsx(Search, { value: filters.text, onChange: handleTextSearchUpdate, placeholder: i18n('filter.text.placeholder'), className: b('search') }), _jsx(TableColumnSetup, { popupWidth: 200, items: columnsToSelect, showStatus: true, onUpdate: setColumns, sortable: false })] }), error ? _jsx(ResponseError, { error: parseQueryErrorToString(error) }) : null, _jsx(TableWithControlsLayout.Table, { loading: isLoading, children: _jsx(ResizeableDataTable, { emptyDataMessage: i18n('no-data'), columnsWidthLSKey: TOP_QUERIES_COLUMNS_WIDTH_LS_KEY, columns: columnsToShow, data: ((_a = data === null || data === void 0 ? void 0 : data.resultSets) === null || _a === void 0 ? void 0 : _a[0].result) || [], loading: isFetching && currentData === undefined, settings: TOP_QUERIES_TABLE_SETTINGS, onRowClick: handleRowClick, rowClassName: () => b('row'), sortOrder: tableSort, onSort: handleTableSort }) })] }));
+    const rows = (_b = (_a = currentData === null || currentData === void 0 ? void 0 : currentData.resultSets) === null || _a === void 0 ? void 0 : _a[0]) === null || _b === void 0 ? void 0 : _b.result;
+    useSetSelectedTopQueryRowFromParams(setSelectedRow, rows);
+    const handleCloseDetails = React.useCallback(() => {
+        setSelectedRow(undefined);
+    }, [setSelectedRow]);
+    const isDrawerVisible = selectedRow !== undefined;
+    const getTopQueryUrl = React.useCallback(() => {
+        if (selectedRow) {
+            return generateShareableUrl(selectedRow);
+        }
+        return '';
+    }, [selectedRow]);
+    const renderDrawerContent = React.useCallback(() => _jsx(QueryDetailsDrawerContent, { row: selectedRow, onClose: handleCloseDetails }), [selectedRow, handleCloseDetails]);
+    const onRowClick = React.useCallback((row, _index, event) => {
+        event === null || event === void 0 ? void 0 : event.stopPropagation();
+        setSelectedRow(row);
+    }, [setSelectedRow]);
+    const inputRef = React.useRef(null);
+    React.useEffect(() => {
+        var _a;
+        if (isDrawerVisible) {
+            (_a = inputRef.current) === null || _a === void 0 ? void 0 : _a.blur();
+        }
+    }, [isDrawerVisible]);
+    const drawerControls = React.useMemo(() => [{ type: 'copyLink', link: getTopQueryUrl() }, { type: 'close' }], [getTopQueryUrl]);
+    return (_jsx(DrawerWrapper, { isDrawerVisible: isDrawerVisible, onCloseDrawer: handleCloseDetails, renderDrawerContent: renderDrawerContent, drawerId: "query-details", storageKey: "kv-top-queries-drawer-width", detectClickOutside: true, isPercentageWidth: true, title: i18n('query-details.title'), drawerControls: drawerControls, children: _jsxs(TableWithControlsLayout, { children: [_jsxs(TableWithControlsLayout.Controls, { children: [renderQueryModeControl(), _jsx(Select, { options: TIME_FRAME_OPTIONS, value: [timeFrame], onUpdate: handleTimeFrameChange }), _jsx(DateRange, { from: filters.from, to: filters.to, onChange: handleDateRangeChange, defaultValue: DEFAULT_TIME_FILTER_VALUE }), _jsx(Search, { value: filters.text, inputRef: inputRef, onChange: handleTextSearchUpdate, placeholder: i18n('filter.text.placeholder'), className: b('search') }), _jsx(TableColumnSetup, { popupWidth: 200, items: columnsToSelect, showStatus: true, onUpdate: setColumns, sortable: false })] }), error ? _jsx(ResponseError, { error: parseQueryErrorToString(error) }) : null, _jsx(TableWithControlsLayout.Table, { loading: isLoading, children: _jsx(ResizeableDataTable, { emptyDataMessage: i18n('no-data'), columnsWidthLSKey: TOP_QUERIES_COLUMNS_WIDTH_LS_KEY, columns: columnsToShow, data: rows || [], loading: isFetching && currentData === undefined, settings: TOP_QUERIES_TABLE_SETTINGS, onRowClick: onRowClick, rowClassName: (row) => b('row', { active: isEqual(row, selectedRow) }), sortOrder: tableSort, onSort: handleTableSort }) })] }) }));
 };
 //# sourceMappingURL=TopQueriesData.js.map

package/dist/containers/Tenant/Diagnostics/TopQueries/TopQueriesData.js.map

@@ -1 +1 @@
-{"version":3,"file":"TopQueriesData.js","sourceRoot":"","sources":["../../../../../src/containers/Tenant/Diagnostics/TopQueries/TopQueriesData.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"TopQueriesData.js","sourceRoot":"","sources":["../../../../../src/containers/Tenant/Diagnostics/TopQueries/TopQueriesData.tsx"],"names":[],"mappings":"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"}

package/dist/containers/Tenant/Diagnostics/TopQueries/hooks/useSetSelectedTopQueryRowFromParams.d.ts

@@ -0,0 +1,8 @@
+import type { KeyValueRow } from '../../../../../types/api/query';
+export interface SearchParamsQueryParams {
+    rank?: string;
+    intervalEnd?: string;
+    endTime?: string;
+    queryHash?: string;
+}
+export declare function useSetSelectedTopQueryRowFromParams(setSelectedRow: (row: KeyValueRow | null) => void, rows?: KeyValueRow[] | null): null;

package/dist/containers/Tenant/Diagnostics/TopQueries/hooks/useSetSelectedTopQueryRowFromParams.js

@@ -0,0 +1,33 @@
+import React from 'react';
+import { StringParam, useQueryParams } from 'use-query-params';
+import { getTopQueryRowQueryParams } from '../utils/getTopQueryRowQueryParams';
+export function useSetSelectedTopQueryRowFromParams(setSelectedRow, rows) {
+    const [queryParams, setQueryParams] = useQueryParams({
+        selectedRow: StringParam,
+    });
+    // Handle initialization from URL params
+    React.useEffect(() => {
+        if (rows && queryParams.selectedRow) {
+            const searchParamsQuery = JSON.parse(decodeURIComponent(queryParams.selectedRow));
+            const matchedRow = rows.find((row) => {
+                const params = getTopQueryRowQueryParams(row);
+                return (params.rank === searchParamsQuery.rank &&
+                    params.intervalEnd === searchParamsQuery.intervalEnd &&
+                    params.endTime === searchParamsQuery.endTime &&
+                    searchParamsQuery.queryHash === params.queryHash);
+            });
+            if (matchedRow) {
+                setSelectedRow(matchedRow);
+            }
+            else {
+                // If we had a selectedRow in URL but couldn't find a matching row,
+                // explicitly set selectedRow to null to indicate empty state
+                setSelectedRow(null);
+            }
+            // Clear URL params after using them
+            setQueryParams({ selectedRow: undefined });
+        }
+    }, [queryParams.selectedRow, setQueryParams, rows, setSelectedRow]);
+    return null;
+}
+//# sourceMappingURL=useSetSelectedTopQueryRowFromParams.js.map

package/dist/containers/Tenant/Diagnostics/TopQueries/hooks/useSetSelectedTopQueryRowFromParams.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useSetSelectedTopQueryRowFromParams.js","sourceRoot":"","sources":["../../../../../../src/containers/Tenant/Diagnostics/TopQueries/hooks/useSetSelectedTopQueryRowFromParams.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAC,WAAW,EAAE,cAAc,EAAC,MAAM,kBAAkB,CAAC;AAG7D,OAAO,EAAC,yBAAyB,EAAC,MAAM,oCAAoC,CAAC;AAS7E,MAAM,UAAU,mCAAmC,CAC/C,cAAiD,EACjD,IAA2B;IAE3B,MAAM,CAAC,WAAW,EAAE,cAAc,CAAC,GAAG,cAAc,CAAC;QACjD,WAAW,EAAE,WAAW;KAC3B,CAAC,CAAC;IAEH,wCAAwC;IACxC,KAAK,CAAC,SAAS,CAAC,GAAG,EAAE;QACjB,IAAI,IAAI,IAAI,WAAW,CAAC,WAAW,EAAE,CAAC;YAClC,MAAM,iBAAiB,GAA4B,IAAI,CAAC,KAAK,CACzD,kBAAkB,CAAC,WAAW,CAAC,WAAW,CAAC,CAC9C,CAAC;YACF,MAAM,UAAU,GAAG,IAAI,CAAC,IAAI,CAAC,CAAC,GAAG,EAAE,EAAE;gBACjC,MAAM,MAAM,GAAG,yBAAyB,CAAC,GAAG,CAAC,CAAC;gBAC9C,OAAO,CACH,MAAM,CAAC,IAAI,KAAK,iBAAiB,CAAC,IAAI;oBACtC,MAAM,CAAC,WAAW,KAAK,iBAAiB,CAAC,WAAW;oBACpD,MAAM,CAAC,OAAO,KAAK,iBAAiB,CAAC,OAAO;oBAC5C,iBAAiB,CAAC,SAAS,KAAK,MAAM,CAAC,SAAS,CACnD,CAAC;YACN,CAAC,CAAC,CAAC;YAEH,IAAI,UAAU,EAAE,CAAC;gBACb,cAAc,CAAC,UAAU,CAAC,CAAC;YAC/B,CAAC;iBAAM,CAAC;gBACJ,mEAAmE;gBACnE,6DAA6D;gBAC7D,cAAc,CAAC,IAAI,CAAC,CAAC;YACzB,CAAC;YAED,oCAAoC;YACpC,cAAc,CAAC,EAAC,WAAW,EAAE,SAAS,EAAC,CAAC,CAAC;QAC7C,CAAC;IACL,CAAC,EAAE,CAAC,WAAW,CAAC,WAAW,EAAE,cAAc,EAAE,IAAI,EAAE,cAAc,CAAC,CAAC,CAAC;IAEpE,OAAO,IAAI,CAAC;AAChB,CAAC"}

package/dist/containers/Tenant/Diagnostics/TopQueries/i18n/en.json

@@ -4,5 +4,11 @@
     "mode_top": "Top",
     "mode_running": "Running",
     "timeframe_hour": "Per hour",
-    "timeframe_minute": "Per minute"
+    "timeframe_minute": "Per minute",
+    "query-details.title": "Query",
+    "query-details.open-in-editor": "Open in Editor",
+    "query-details.close": "Close",
+    "query-details.query.title": "Query Text",
+    "query-details.not-found.title": "Not found",
+    "query-details.not-found.description": "This query no longer exists"
 }

package/dist/containers/Tenant/Diagnostics/TopQueries/i18n/index.d.ts

@@ -1,2 +1,2 @@
-declare const _default: (key: "no-data" | "filter.text.placeholder" | "mode_top" | "mode_running" | "timeframe_hour" | "timeframe_minute", params?: import("@gravity-ui/i18n").Params) => string;
+declare const _default: (key: "no-data" | "filter.text.placeholder" | "mode_top" | "mode_running" | "timeframe_hour" | "timeframe_minute" | "query-details.title" | "query-details.open-in-editor" | "query-details.close" | "query-details.query.title" | "query-details.not-found.title" | "query-details.not-found.description", params?: import("@gravity-ui/i18n").Params) => string;
 export default _default;

package/dist/containers/Tenant/Diagnostics/TopQueries/utils/generateShareableUrl.d.ts

@@ -0,0 +1,7 @@
+import type { KeyValueRow } from '../../../../../types/api/query';
+/**
+ * Generates a shareable URL with query parameters for a top query row
+ * @param row The top query row data
+ * @returns A shareable URL string with the row's parameters encoded in the URL
+ */
+export declare function generateShareableUrl(row: KeyValueRow): string;

package/dist/containers/Tenant/Diagnostics/TopQueries/utils/generateShareableUrl.js

@@ -0,0 +1,20 @@
+import { getTopQueryRowQueryParams } from './getTopQueryRowQueryParams';
+/**
+ * Generates a shareable URL with query parameters for a top query row
+ * @param row The top query row data
+ * @returns A shareable URL string with the row's parameters encoded in the URL
+ */
+export function generateShareableUrl(row) {
+    const params = getTopQueryRowQueryParams(row);
+    const url = new URL(window.location.href);
+    const searchParams = new URLSearchParams(url.search);
+    searchParams.set('selectedRow', encodeURIComponent(JSON.stringify({
+        rank: params.rank || undefined,
+        intervalEnd: params.intervalEnd || undefined,
+        endTime: params.endTime || undefined,
+        queryHash: params.queryHash || undefined,
+    })));
+    url.search = searchParams.toString();
+    return url.toString();
+}
+//# sourceMappingURL=generateShareableUrl.js.map

package/dist/containers/Tenant/Diagnostics/TopQueries/utils/generateShareableUrl.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"generateShareableUrl.js","sourceRoot":"","sources":["../../../../../../src/containers/Tenant/Diagnostics/TopQueries/utils/generateShareableUrl.ts"],"names":[],"mappings":"AAEA,OAAO,EAAC,yBAAyB,EAAC,MAAM,6BAA6B,CAAC;AAEtE;;;;GAIG;AACH,MAAM,UAAU,oBAAoB,CAAC,GAAgB;IACjD,MAAM,MAAM,GAAG,yBAAyB,CAAC,GAAG,CAAC,CAAC;IAE9C,MAAM,GAAG,GAAG,IAAI,GAAG,CAAC,MAAM,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC;IAE1C,MAAM,YAAY,GAAG,IAAI,eAAe,CAAC,GAAG,CAAC,MAAM,CAAC,CAAC;IAErD,YAAY,CAAC,GAAG,CACZ,aAAa,EACb,kBAAkB,CACd,IAAI,CAAC,SAAS,CAAC;QACX,IAAI,EAAE,MAAM,CAAC,IAAI,IAAI,SAAS;QAC9B,WAAW,EAAE,MAAM,CAAC,WAAW,IAAI,SAAS;QAC5C,OAAO,EAAE,MAAM,CAAC,OAAO,IAAI,SAAS;QACpC,SAAS,EAAE,MAAM,CAAC,SAAS,IAAI,SAAS;KAC3C,CAAC,CACL,CACJ,CAAC;IAEF,GAAG,CAAC,MAAM,GAAG,YAAY,CAAC,QAAQ,EAAE,CAAC;IAErC,OAAO,GAAG,CAAC,QAAQ,EAAE,CAAC;AAC1B,CAAC"}

package/dist/containers/Tenant/Diagnostics/TopQueries/utils/getTopQueryRowQueryParams.d.ts

@@ -0,0 +1,8 @@
+import type { KeyValueRow } from '../../../../../types/api/query';
+import type { SearchParamsQueryParams } from '../hooks/useSetSelectedTopQueryRowFromParams';
+/**
+ * Extract query parameters from a row for use in URL search params
+ * @param row The top query row data
+ * @returns Parameters for URL search params
+ */
+export declare function getTopQueryRowQueryParams(row: KeyValueRow): SearchParamsQueryParams;

package/dist/containers/Tenant/Diagnostics/TopQueries/utils/getTopQueryRowQueryParams.js

@@ -0,0 +1,16 @@
+import { generateHash } from '../../../../../utils/generateHash';
+/**
+ * Extract query parameters from a row for use in URL search params
+ * @param row The top query row data
+ * @returns Parameters for URL search params
+ */
+export function getTopQueryRowQueryParams(row) {
+    const queryHash = generateHash(String(row.QueryText));
+    return {
+        rank: String(row.Rank),
+        intervalEnd: String(row.IntervalEnd),
+        endTime: String(row.EndTime),
+        queryHash,
+    };
+}
+//# sourceMappingURL=getTopQueryRowQueryParams.js.map

package/dist/containers/Tenant/Diagnostics/TopQueries/utils/getTopQueryRowQueryParams.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"getTopQueryRowQueryParams.js","sourceRoot":"","sources":["../../../../../../src/containers/Tenant/Diagnostics/TopQueries/utils/getTopQueryRowQueryParams.ts"],"names":[],"mappings":"AACA,OAAO,EAAC,YAAY,EAAC,MAAM,mCAAmC,CAAC;AAG/D;;;;GAIG;AACH,MAAM,UAAU,yBAAyB,CAAC,GAAgB;IACtD,MAAM,SAAS,GAAG,YAAY,CAAC,MAAM,CAAC,GAAG,CAAC,SAAS,CAAC,CAAC,CAAC;IAEtD,OAAO;QACH,IAAI,EAAE,MAAM,CAAC,GAAG,CAAC,IAAI,CAAC;QACtB,WAAW,EAAE,MAAM,CAAC,GAAG,CAAC,WAAW,CAAC;QACpC,OAAO,EAAE,MAAM,CAAC,GAAG,CAAC,OAAO,CAAC;QAC5B,SAAS;KACZ,CAAC;AACN,CAAC"}

package/dist/containers/Tenant/Diagnostics/TopQueries/utils.d.ts

@@ -1,2 +1,5 @@
 import type { Settings } from '@gravity-ui/react-data-table';
+import type { InfoViewerItem } from '../../../../components/InfoViewer';
+import type { KeyValueRow } from '../../../../types/api/query';
 export declare const TOP_QUERIES_TABLE_SETTINGS: Settings;
+export declare function createQueryInfoItems(data: KeyValueRow): InfoViewerItem[];

package/dist/containers/Tenant/Diagnostics/TopQueries/utils.js

@@ -1,7 +1,76 @@
+import { formatDateTime, formatNumber } from '../../../../utils/dataFormatters/dataFormatters';
+import { generateHash } from '../../../../utils/generateHash';
+import { formatToMs, parseUsToMs } from '../../../../utils/timeParsers';
 import { QUERY_TABLE_SETTINGS } from '../../utils/constants';
+import columnsI18n from './columns/i18n';
 export const TOP_QUERIES_TABLE_SETTINGS = {
     ...QUERY_TABLE_SETTINGS,
     disableSortReset: true,
     externalSort: true,
 };
+export function createQueryInfoItems(data) {
+    var _a, _b;
+    const items = [];
+    if (data.QueryText) {
+        items.push({
+            label: columnsI18n('query-hash'),
+            value: generateHash(String(data.QueryText)),
+        });
+    }
+    if (data.CPUTimeUs !== undefined) {
+        items.push({
+            label: columnsI18n('cpu-time'),
+            value: formatToMs(parseUsToMs((_a = data.CPUTimeUs) !== null && _a !== void 0 ? _a : undefined)),
+        });
+    }
+    if (data.Duration !== undefined) {
+        items.push({
+            label: columnsI18n('duration'),
+            value: formatToMs(parseUsToMs((_b = data.Duration) !== null && _b !== void 0 ? _b : undefined)),
+        });
+    }
+    if (data.ReadBytes !== undefined) {
+        items.push({
+            label: columnsI18n('read-bytes'),
+            value: formatNumber(data.ReadBytes),
+        });
+    }
+    if (data.RequestUnits !== undefined) {
+        items.push({
+            label: columnsI18n('request-units'),
+            value: formatNumber(data.RequestUnits),
+        });
+    }
+    if (data.EndTime) {
+        items.push({
+            label: columnsI18n('end-time'),
+            value: formatDateTime(new Date(data.EndTime).getTime()),
+        });
+    }
+    if (data.ReadRows !== undefined) {
+        items.push({
+            label: columnsI18n('read-rows'),
+            value: formatNumber(data.ReadRows),
+        });
+    }
+    if (data.UserSID) {
+        items.push({
+            label: columnsI18n('user'),
+            value: data.UserSID,
+        });
+    }
+    if (data.ApplicationName) {
+        items.push({
+            label: columnsI18n('application'),
+            value: data.ApplicationName,
+        });
+    }
+    if (data.QueryStartAt) {
+        items.push({
+            label: columnsI18n('start-time'),
+            value: formatDateTime(new Date(data.QueryStartAt).getTime()),
+        });
+    }
+    return items;
+}
 //# sourceMappingURL=utils.js.map

package/dist/containers/Tenant/Diagnostics/TopQueries/utils.js.map

@@ -1 +1 @@
-{"version":3,"file":"utils.js","sourceRoot":"","sources":["../../../../../src/containers/Tenant/Diagnostics/TopQueries/utils.ts"],"names":[],"mappings":"AAEA,OAAO,EAAC,oBAAoB,EAAC,MAAM,uBAAuB,CAAC;AAE3D,MAAM,CAAC,MAAM,0BAA0B,GAAa;IAChD,GAAG,oBAAoB;IACvB,gBAAgB,EAAE,IAAI;IACtB,YAAY,EAAE,IAAI;CACrB,CAAC"}
+{"version":3,"file":"utils.js","sourceRoot":"","sources":["../../../../../src/containers/Tenant/Diagnostics/TopQueries/utils.ts"],"names":[],"mappings":"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"}