Skip to content

Commit 7e7b3e3

Browse files
artemmufazalovartemmufazalov
authored
fix: pass database to capabilities query (#1551)
1 parent 7811347 commit 7e7b3e3

File tree

26 files changed

+145
-89
lines changed

26 files changed

+145
-89
lines changed

‎src/components/NodeHostWrapper/NodeHostWrapper.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -37,7 +37,7 @@ export const NodeHostWrapper = ({node, getNodeRef, database}: NodeHostWrapperPro
3737

3838
const nodePath = isNodeAvailable
3939
? getDefaultNodePath(node.NodeId, {
40-
tenantName: database ?? node.TenantName,
40+
database: database ?? node.TenantName,
4141
})
4242
: undefined;
4343

‎src/components/Tablet/Tablet.tsx

+4-4
Original file line numberDiff line numberDiff line change
@@ -13,14 +13,14 @@ const b = cn('tablet');
1313

1414
interface TabletProps {
1515
tablet?: TTabletStateInfo;
16-
tenantName?: string;
16+
database?: string;
1717
}
1818

19-
export const Tablet = ({tablet = {}, tenantName}: TabletProps) => {
20-
const {TabletId: id, NodeId, Type} = tablet;
19+
export const Tablet = ({tablet = {}, database}: TabletProps) => {
20+
const {TabletId: id} = tablet;
2121
const status = tablet.Overall?.toLowerCase();
2222

23-
const tabletPath = id && getTabletPagePath(id, {nodeId: NodeId, tenantName, type: Type});
23+
const tabletPath = id && getTabletPagePath(id, {database});
2424

2525
return (
2626
<ContentWithPopup

‎src/components/TabletNameWrapper/TabletNameWrapper.tsx

+1-3
Original file line numberDiff line numberDiff line change
@@ -18,9 +18,7 @@ interface TabletNameWrapperProps {
1818
export function TabletNameWrapper({tabletId, database}: TabletNameWrapperProps) {
1919
const isUserAllowedToMakeChanges = useTypedSelector(selectIsUserAllowedToMakeChanges);
2020

21-
const tabletPath = getTabletPagePath(tabletId, {
22-
tenantName: database,
23-
});
21+
const tabletPath = getTabletPagePath(tabletId, {database});
2422

2523
return (
2624
<CellWithPopover

‎src/components/TabletsStatistic/TabletsStatistic.tsx

+5-23
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,6 @@
11
import {Link} from 'react-router-dom';
22

3-
import {TABLETS} from '../../containers/Node/NodePages';
4-
import routes, {createHref} from '../../routes';
3+
import {TABLETS, getDefaultNodePath} from '../../containers/Node/NodePages';
54
import type {TTabletStateInfo} from '../../types/api/tablet';
65
import {cn} from '../../utils/cn';
76
import {getTabletLabel} from '../../utils/constants';
@@ -26,35 +25,18 @@ const prepareTablets = (tablets: TTabletStateInfo[]) => {
2625

2726
interface TabletsStatisticProps {
2827
tablets: TTabletStateInfo[];
29-
tenantName: string | undefined;
28+
database: string | undefined;
3029
nodeId: string | number;
31-
backend?: string;
3230
}
3331

34-
export const TabletsStatistic = ({
35-
tablets = [],
36-
tenantName,
37-
nodeId,
38-
backend,
39-
}: TabletsStatisticProps) => {
32+
export const TabletsStatistic = ({tablets = [], database, nodeId}: TabletsStatisticProps) => {
4033
const renderTabletInfo = (item: ReturnType<typeof prepareTablets>[number], index: number) => {
41-
const tabletsPath = createHref(
42-
routes.node,
43-
{id: nodeId, activeTab: TABLETS},
44-
{
45-
tenantName,
46-
backend,
47-
},
48-
);
34+
const tabletsPath = getDefaultNodePath(nodeId, {database}, TABLETS);
4935

5036
const label = `${item.label}: ${item.count}`;
5137
const className = b('tablet', {state: item.state?.toLowerCase()});
5238

53-
return backend ? (
54-
<a href={tabletsPath} key={index} className={className}>
55-
{label}
56-
</a>
57-
) : (
39+
return (
5840
<Link to={tabletsPath} key={index} className={className}>
5941
{label}
6042
</Link>

‎src/components/TenantNameWrapper/TenantNameWrapper.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -66,7 +66,7 @@ export function TenantNameWrapper({tenant, additionalTenantsProps}: TenantNameWr
6666
status={tenant.Overall}
6767
hasClipboardButton
6868
path={getTenantPath({
69-
name: tenant.Name,
69+
database: tenant.Name,
7070
backend,
7171
})}
7272
/>

‎src/components/nodesColumns/columns.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -230,7 +230,7 @@ export function getTabletsColumn<
230230
render: ({row}) => {
231231
return row.Tablets ? (
232232
<TabletsStatistic
233-
tenantName={database ?? row.TenantName}
233+
database={database ?? row.TenantName}
234234
nodeId={row.NodeId}
235235
tablets={row.Tablets}
236236
/>

‎src/containers/App/Content.tsx

+2-2
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,7 @@ import type {SlotComponent} from '../../components/slots/types';
1212
import routes from '../../routes';
1313
import type {RootState} from '../../store';
1414
import {authenticationApi} from '../../store/reducers/authentication/authentication';
15-
import {capabilitiesApi} from '../../store/reducers/capabilities/capabilities';
15+
import {useCapabilitiesQuery} from '../../store/reducers/capabilities/hooks';
1616
import {nodesListApi} from '../../store/reducers/nodesList';
1717
import {cn} from '../../utils/cn';
1818
import {lazyComponent} from '../../utils/lazyComponent';
@@ -200,7 +200,7 @@ function GetNodesList() {
200200
}
201201

202202
function GetCapabilities() {
203-
capabilitiesApi.useGetClusterCapabilitiesQuery(undefined);
203+
useCapabilitiesQuery();
204204
return null;
205205
}
206206

‎src/containers/Header/breadcrumbs.tsx

+2-2
Original file line numberDiff line numberDiff line change
@@ -67,7 +67,7 @@ const getTenantBreadcrumbs: GetBreadcrumbs<TenantBreadcrumbsOptions> = (options,
6767
const breadcrumbs = getClusterBreadcrumbs(options, query);
6868

6969
const text = tenantName ? prepareTenantName(tenantName) : headerKeyset('breadcrumbs.tenant');
70-
const link = tenantName ? getTenantPath({...query, name: tenantName}) : undefined;
70+
const link = tenantName ? getTenantPath({...query, database: tenantName}) : undefined;
7171

7272
const lastItem = {text, link, icon: <DatabaseIcon />};
7373
breadcrumbs.push(lastItem);
@@ -92,7 +92,7 @@ const getNodeBreadcrumbs: GetBreadcrumbs<NodeBreadcrumbsOptions> = (options, que
9292
const lastItem = {
9393
text,
9494
link: nodeId
95-
? getDefaultNodePath(nodeId, {tenantName, ...query}, nodeActiveTab)
95+
? getDefaultNodePath(nodeId, {database: tenantName, ...query}, nodeActiveTab)
9696
: undefined,
9797
icon: getNodeIcon(nodeRole),
9898
};

‎src/containers/Node/Node.tsx

+21-6
Original file line numberDiff line numberDiff line change
@@ -2,14 +2,15 @@ import React from 'react';
22

33
import {Tabs} from '@gravity-ui/uikit';
44
import {Helmet} from 'react-helmet-async';
5-
import {Link, useLocation, useRouteMatch} from 'react-router-dom';
5+
import {Link, useRouteMatch} from 'react-router-dom';
6+
import {useQueryParams} from 'use-query-params';
67

78
import {AutoRefreshControl} from '../../components/AutoRefreshControl/AutoRefreshControl';
89
import {BasicNodeViewer} from '../../components/BasicNodeViewer';
910
import {ResponseError} from '../../components/Errors/ResponseError';
1011
import {FullNodeViewer} from '../../components/FullNodeViewer/FullNodeViewer';
1112
import {Loader} from '../../components/Loader';
12-
import routes, {createHref, parseQuery} from '../../routes';
13+
import routes from '../../routes';
1314
import {
1415
useCapabilitiesLoaded,
1516
useDiskPagesAvailable,
@@ -22,7 +23,16 @@ import {useAutoRefreshInterval, useTypedDispatch} from '../../utils/hooks';
2223
import {StorageWrapper} from '../Storage/StorageWrapper';
2324
import {Tablets} from '../Tablets';
2425

25-
import {NODE_PAGES, OVERVIEW, STORAGE, STRUCTURE, TABLETS} from './NodePages';
26+
import type {NodeTab} from './NodePages';
27+
import {
28+
NODE_PAGES,
29+
OVERVIEW,
30+
STORAGE,
31+
STRUCTURE,
32+
TABLETS,
33+
getDefaultNodePath,
34+
nodePageQueryParams,
35+
} from './NodePages';
2636
import NodeStructure from './NodeStructure/NodeStructure';
2737

2838
import './Node.scss';
@@ -40,13 +50,12 @@ export function Node(props: NodeProps) {
4050
const container = React.useRef<HTMLDivElement>(null);
4151

4252
const dispatch = useTypedDispatch();
43-
const location = useLocation();
4453

4554
const match =
4655
useRouteMatch<{id: string; activeTab: string}>(routes.node) ?? Object.create(null);
4756

4857
const {id: nodeId, activeTab} = match.params;
49-
const {tenantName: tenantNameFromQuery} = parseQuery(location);
58+
const [{database: tenantNameFromQuery}] = useQueryParams(nodePageQueryParams);
5059

5160
const [autoRefreshInterval] = useAutoRefreshInterval();
5261
const {currentData, isFetching, error} = nodeApi.useGetNodeInfoQuery(
@@ -109,7 +118,13 @@ export function Node(props: NodeProps) {
109118
activeTab={activeTabVerified.id}
110119
wrapTo={({id}, tabNode) => (
111120
<Link
112-
to={createHref(routes.node, {id: nodeId, activeTab: id}, {tenantName})}
121+
to={getDefaultNodePath(
122+
nodeId,
123+
{
124+
database: tenantName,
125+
},
126+
id as NodeTab,
127+
)}
113128
key={id}
114129
className={b('tab')}
115130
>

‎src/containers/Node/NodePages.ts

+10-2
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,6 @@
1-
import type {Query} from '../../routes';
1+
import {StringParam} from 'use-query-params';
2+
3+
import type {QueryParamsTypeFromQueryObject} from '../../routes';
24
import routes, {createHref} from '../../routes';
35

46
export const STORAGE = 'storage';
@@ -27,9 +29,15 @@ export const NODE_PAGES = [
2729
},
2830
];
2931

32+
export const nodePageQueryParams = {
33+
database: StringParam,
34+
};
35+
36+
type NodePageQuery = QueryParamsTypeFromQueryObject<typeof nodePageQueryParams>;
37+
3038
export function getDefaultNodePath(
3139
nodeId: string | number,
32-
query: Query = {},
40+
query: NodePageQuery = {},
3341
activeTab: NodeTab = OVERVIEW,
3442
) {
3543
return createHref(

‎src/containers/Tablet/Tablet.tsx

+5-11
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@ import {Flex, Tabs} from '@gravity-ui/uikit';
44
import {skipToken} from '@reduxjs/toolkit/query';
55
import {Helmet} from 'react-helmet-async';
66
import {useParams} from 'react-router-dom';
7-
import {StringParam, useQueryParams} from 'use-query-params';
7+
import {useQueryParams} from 'use-query-params';
88
import {z} from 'zod';
99

1010
import {EmptyStateWrapper} from '../../components/EmptyState';
@@ -13,7 +13,7 @@ import {ResponseError} from '../../components/Errors/ResponseError';
1313
import {InternalLink} from '../../components/InternalLink';
1414
import {LoaderWrapper} from '../../components/LoaderWrapper/LoaderWrapper';
1515
import {PageMetaWithAutorefresh} from '../../components/PageMeta/PageMeta';
16-
import {getTabletPagePath} from '../../routes';
16+
import {getTabletPagePath, tabletPageQueryParams} from '../../routes';
1717
import {selectIsUserAllowedToMakeChanges} from '../../store/reducers/authentication/authentication';
1818
import {setHeaderBreadcrumbs} from '../../store/reducers/header/header';
1919
import {tabletApi} from '../../store/reducers/tablet';
@@ -58,19 +58,13 @@ const TABLET_PAGE_TABS = [
5858

5959
const tabletTabSchema = z.nativeEnum(TABLET_TABS_IDS).catch(TABLET_TABS_IDS.history);
6060

61-
const tabletQueryParams = {
62-
tenantName: StringParam,
63-
clusterName: StringParam,
64-
activeTab: StringParam,
65-
};
66-
6761
export function Tablet() {
6862
const dispatch = useTypedDispatch();
6963

7064
const {id} = useParams<{id: string}>();
7165

72-
const [{tenantName: queryDatabase, clusterName: queryClusterName}] =
73-
useQueryParams(tabletQueryParams);
66+
const [{database: queryDatabase, clusterName: queryClusterName}] =
67+
useQueryParams(tabletPageQueryParams);
7468

7569
const [autoRefreshInterval] = useAutoRefreshInterval();
7670
const {currentData, isFetching, error} = tabletApi.useGetTabletQuery(
@@ -168,7 +162,7 @@ function TabletTabs({
168162
hiveId?: string;
169163
history: ITabletPreparedHistoryItem[];
170164
}) {
171-
const [{activeTab, ...restParams}, setParams] = useQueryParams(tabletQueryParams);
165+
const [{activeTab, ...restParams}, setParams] = useQueryParams(tabletPageQueryParams);
172166
const isUserAllowedToMakeChanges = useTypedSelector(selectIsUserAllowedToMakeChanges);
173167

174168
const noAdvancedInfo = !isUserAllowedToMakeChanges || !hasHive(hiveId);

‎src/containers/Tenant/Diagnostics/Consumers/columns/columns.tsx

+2-3
Original file line numberDiff line numberDiff line change
@@ -4,12 +4,11 @@ import qs from 'qs';
44

55
import {InternalLink} from '../../../../../components/InternalLink';
66
import {SpeedMultiMeter} from '../../../../../components/SpeedMultiMeter';
7-
import routes, {createHref} from '../../../../../routes';
87
import {TENANT_DIAGNOSTICS_TABS_IDS} from '../../../../../store/reducers/tenant/constants';
98
import type {IPreparedConsumerData} from '../../../../../types/store/topic';
109
import {cn} from '../../../../../utils/cn';
1110
import {formatMsToUptime} from '../../../../../utils/dataFormatters/dataFormatters';
12-
import {TenantTabsGroups} from '../../../TenantPages';
11+
import {TenantTabsGroups, getTenantPath} from '../../../TenantPages';
1312
import {ReadLagsHeader} from '../Headers';
1413
import {
1514
CONSUMERS_COLUMNS_IDS,
@@ -40,7 +39,7 @@ export const columns: Column<IPreparedConsumerData>[] = [
4039

4140
return (
4241
<InternalLink
43-
to={createHref(routes.tenant, undefined, {
42+
to={getTenantPath({
4443
...queryParams,
4544
[TenantTabsGroups.diagnosticsTab]: TENANT_DIAGNOSTICS_TABS_IDS.partitions,
4645
selectedConsumer: row.name,

‎src/containers/Tenant/Diagnostics/Diagnostics.tsx

+3-4
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,6 @@ import {Link} from 'react-router-dom';
66
import {StringParam, useQueryParams} from 'use-query-params';
77

88
import {AutoRefreshControl} from '../../../components/AutoRefreshControl/AutoRefreshControl';
9-
import routes, {createHref} from '../../../routes';
109
import {useFeatureFlagsAvailable} from '../../../store/reducers/capabilities/hooks';
1110
import {TENANT_DIAGNOSTICS_TABS_IDS} from '../../../store/reducers/tenant/constants';
1211
import {setDiagnosticsTab} from '../../../store/reducers/tenant/tenant';
@@ -20,7 +19,7 @@ import {Operations} from '../../Operations';
2019
import {StorageWrapper} from '../../Storage/StorageWrapper';
2120
import {Tablets} from '../../Tablets';
2221
import {SchemaViewer} from '../Schema/SchemaViewer/SchemaViewer';
23-
import {TenantTabsGroups} from '../TenantPages';
22+
import {TenantTabsGroups, getTenantPath} from '../TenantPages';
2423
import {isDatabaseEntityType} from '../utils/schema';
2524

2625
import {Configs} from './Configs/Configs';
@@ -55,7 +54,7 @@ function Diagnostics(props: DiagnosticsProps) {
5554
);
5655

5756
const [queryParams] = useQueryParams({
58-
name: StringParam,
57+
database: StringParam,
5958
schema: StringParam,
6059
backend: StringParam,
6160
clusterName: StringParam,
@@ -155,7 +154,7 @@ function Diagnostics(props: DiagnosticsProps) {
155154
items={pages}
156155
activeTab={activeTab?.id}
157156
wrapTo={({id}, node) => {
158-
const path = createHref(routes.tenant, undefined, {
157+
const path = getTenantPath({
159158
...queryParams,
160159
[TenantTabsGroups.diagnosticsTab]: id,
161160
});

‎src/containers/Tenant/ObjectSummary/ObjectSummary.tsx

+4-5
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,7 @@ import {AsyncReplicationState} from '../../../components/AsyncReplicationState';
1111
import {toFormattedSize} from '../../../components/FormattedBytes/utils';
1212
import {LinkWithIcon} from '../../../components/LinkWithIcon/LinkWithIcon';
1313
import SplitPane from '../../../components/SplitPane';
14-
import routes, {createExternalUILink, createHref} from '../../../routes';
14+
import {createExternalUILink} from '../../../routes';
1515
import {overviewApi} from '../../../store/reducers/overview/overview';
1616
import {TENANT_SUMMARY_TABS_IDS} from '../../../store/reducers/tenant/constants';
1717
import {setSummaryTab} from '../../../store/reducers/tenant/tenant';
@@ -29,7 +29,7 @@ import {useAutoRefreshInterval, useTypedDispatch, useTypedSelector} from '../../
2929
import {Acl} from '../Acl/Acl';
3030
import {EntityTitle} from '../EntityTitle/EntityTitle';
3131
import {SchemaViewer} from '../Schema/SchemaViewer/SchemaViewer';
32-
import {TENANT_INFO_TABS, TENANT_SCHEMA_TAB, TenantTabsGroups} from '../TenantPages';
32+
import {TENANT_INFO_TABS, TENANT_SCHEMA_TAB, TenantTabsGroups, getTenantPath} from '../TenantPages';
3333
import {getSummaryControls} from '../utils/controls';
3434
import {
3535
PaneVisibilityActionTypes,
@@ -128,13 +128,12 @@ export function ObjectSummary({
128128
items={tabsItems}
129129
activeTab={summaryTab}
130130
wrapTo={({id}, node) => {
131-
const path = createHref(routes.tenant, undefined, {
131+
const tabPath = getTenantPath({
132132
...queryParams,
133-
name: tenantName,
134133
[TenantTabsGroups.summaryTab]: id,
135134
});
136135
return (
137-
<Link to={path} key={id} className={b('tab')}>
136+
<Link to={tabPath} key={id} className={b('tab')}>
138137
{node}
139138
</Link>
140139
);

‎src/containers/Tenant/Tenant.tsx

+15-1
Original file line numberDiff line numberDiff line change
@@ -48,7 +48,21 @@ export function Tenant(props: TenantProps) {
4848
getTenantSummaryState,
4949
);
5050

51-
const [{name: tenantName, schema}] = useQueryParams({name: StringParam, schema: StringParam});
51+
// TODO: name is used together with database to keep old links valid
52+
// Remove it after some time - 1-2 weeks
53+
const [{database, name, schema}, setQuery] = useQueryParams({
54+
database: StringParam,
55+
name: StringParam,
56+
schema: StringParam,
57+
});
58+
59+
React.useEffect(() => {
60+
if (name && !database) {
61+
setQuery({database: name, name: undefined}, 'replaceIn');
62+
}
63+
}, [database, name, setQuery]);
64+
65+
const tenantName = database ?? name;
5266

5367
if (!tenantName) {
5468
throw new Error('Tenant name is not defined');

0 commit comments

Comments
 (0)