Skip to content

Commit c89b733

Browse files
RaubzeugRaubzeug
authored
fix: relative path usage fixes (#2843)
1 parent aa861e2 commit c89b733

File tree

18 files changed

+161
-67
lines changed

18 files changed

+161
-67
lines changed

‎src/components/ConnectToDB/ConnectToDBDialog.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -62,7 +62,7 @@ function ConnectToDBDialog({
6262
tenantApi.useGetTenantInfoQuery(params);
6363
const endpoint = endpointFromProps ?? tenantData?.ControlPlane?.endpoint;
6464

65-
const snippet = getSnippetCode(activeTab, {database, endpoint});
65+
const snippet = getSnippetCode(activeTab, {database: tenantData?.Name, endpoint});
6666
const docsLink = getDocsLink(activeTab);
6767

6868
return (

‎src/components/ShardsTable/columns.tsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -18,9 +18,9 @@ export const getPathColumn: GetShardsColumn = ({schemaPath = ''}) => {
1818
name: TOP_SHARDS_COLUMNS_IDS.Path,
1919
header: TOP_SHARDS_COLUMNS_TITLES.Path,
2020
render: ({row}) => {
21-
// row.RelativePath - relative schema path
21+
// row.RelativePath - relative schema path without start slash
2222
return (
23-
<LinkToSchemaObject path={schemaPath + row.RelativePath}>
23+
<LinkToSchemaObject path={`${schemaPath}/${row.RelativePath}`}>
2424
{row.RelativePath}
2525
</LinkToSchemaObject>
2626
);

‎src/containers/Header/Header.tsx‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -56,6 +56,7 @@ function Header() {
5656
const {title: clusterTitle} = useClusterBaseInfo();
5757

5858
const database = useDatabaseFromQuery();
59+
5960
const clusterName = useClusterNameFromQuery();
6061

6162
const location = useLocation();

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

Lines changed: 25 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -50,7 +50,7 @@ interface DiagnosticsProps {
5050
const b = cn('kv-tenant-diagnostics');
5151

5252
function Diagnostics(props: DiagnosticsProps) {
53-
const {path, database, type, subType} = useCurrentSchema();
53+
const {path, database, type, subType, databaseFullPath} = useCurrentSchema();
5454
const containerRef = React.useRef<HTMLDivElement>(null);
5555
const dispatch = useTypedDispatch();
5656
const {diagnosticsTab = TENANT_DIAGNOSTICS_TABS_IDS.overview} = useTypedSelector(
@@ -59,8 +59,6 @@ function Diagnostics(props: DiagnosticsProps) {
5959

6060
const getDiagnosticsPageLink = useDiagnosticsPageLinkGetter();
6161

62-
const tenantName = isDatabaseEntityType(type) ? path : database;
63-
6462
const {controlPlane, databaseType} = useTenantBaseInfo(isDatabaseEntityType(type) ? path : '');
6563

6664
const hasFeatureFlags = useFeatureFlagsAvailable();
@@ -93,27 +91,33 @@ function Diagnostics(props: DiagnosticsProps) {
9391
return (
9492
<DetailedOverview
9593
type={type}
96-
tenantName={tenantName}
94+
tenantName={database}
9795
path={path}
9896
additionalTenantProps={props.additionalTenantProps}
9997
additionalNodesProps={props.additionalNodesProps}
10098
/>
10199
);
102100
}
103101
case TENANT_DIAGNOSTICS_TABS_IDS.schema: {
104-
return <SchemaViewer path={path} tenantName={tenantName} type={type} extended />;
102+
return <SchemaViewer path={path} tenantName={database} type={type} extended />;
105103
}
106104
case TENANT_DIAGNOSTICS_TABS_IDS.topQueries: {
107-
return <TopQueries tenantName={tenantName} />;
105+
return <TopQueries tenantName={database} />;
108106
}
109107
case TENANT_DIAGNOSTICS_TABS_IDS.topShards: {
110-
return <TopShards tenantName={tenantName} path={path} />;
108+
return (
109+
<TopShards
110+
tenantName={database}
111+
path={path}
112+
databaseFullPath={databaseFullPath}
113+
/>
114+
);
111115
}
112116
case TENANT_DIAGNOSTICS_TABS_IDS.nodes: {
113117
return (
114118
<Nodes
115119
path={path}
116-
database={tenantName}
120+
database={database}
117121
additionalNodesProps={props.additionalNodesProps}
118122
scrollContainerRef={containerRef}
119123
/>
@@ -124,56 +128,56 @@ function Diagnostics(props: DiagnosticsProps) {
124128
}
125129
case TENANT_DIAGNOSTICS_TABS_IDS.tablets: {
126130
return (
127-
<Tablets scrollContainerRef={containerRef} path={path} database={tenantName} />
131+
<Tablets scrollContainerRef={containerRef} path={path} database={database} />
128132
);
129133
}
130134
case TENANT_DIAGNOSTICS_TABS_IDS.storage: {
131-
return <PaginatedStorage database={tenantName} scrollContainerRef={containerRef} />;
135+
return <PaginatedStorage database={database} scrollContainerRef={containerRef} />;
132136
}
133137
case TENANT_DIAGNOSTICS_TABS_IDS.network: {
134138
return (
135139
<NetworkWrapper
136140
path={path}
137-
database={tenantName}
141+
database={database}
138142
additionalNodesProps={props.additionalNodesProps}
139143
scrollContainerRef={containerRef}
140144
/>
141145
);
142146
}
143147
case TENANT_DIAGNOSTICS_TABS_IDS.describe: {
144-
return <Describe path={path} database={tenantName} />;
148+
return <Describe path={path} database={database} />;
145149
}
146150
case TENANT_DIAGNOSTICS_TABS_IDS.hotKeys: {
147-
return <HotKeys path={path} database={tenantName} />;
151+
return <HotKeys path={path} database={database} />;
148152
}
149153
case TENANT_DIAGNOSTICS_TABS_IDS.graph: {
150-
return <Heatmap path={path} database={tenantName} />;
154+
return <Heatmap path={path} database={database} />;
151155
}
152156
case TENANT_DIAGNOSTICS_TABS_IDS.consumers: {
153-
return <Consumers path={path} database={tenantName} type={type} />;
157+
return <Consumers path={path} database={database} type={type} />;
154158
}
155159
case TENANT_DIAGNOSTICS_TABS_IDS.partitions: {
156-
return <Partitions path={path} database={tenantName} />;
160+
return <Partitions path={path} database={database} />;
157161
}
158162
case TENANT_DIAGNOSTICS_TABS_IDS.topicData: {
159163
return (
160164
<TopicData
161165
key={path}
162166
path={path}
163-
database={tenantName}
167+
database={database}
164168
scrollContainerRef={containerRef}
165169
/>
166170
);
167171
}
168172
case TENANT_DIAGNOSTICS_TABS_IDS.configs: {
169-
return <Configs database={tenantName} />;
173+
return <Configs database={database} />;
170174
}
171175
case TENANT_DIAGNOSTICS_TABS_IDS.operations: {
172-
return <Operations database={tenantName} scrollContainerRef={containerRef} />;
176+
return <Operations database={database} scrollContainerRef={containerRef} />;
173177
}
174178
case TENANT_DIAGNOSTICS_TABS_IDS.backups: {
175179
return uiFactory.renderBackups?.({
176-
database: tenantName,
180+
database,
177181
scrollContainerRef: containerRef,
178182
});
179183
}
@@ -208,7 +212,7 @@ function Diagnostics(props: DiagnosticsProps) {
208212

209213
useScrollPosition(
210214
containerRef,
211-
`tenant-diagnostics-${tenantName}-${activeTab?.id}`,
215+
`tenant-diagnostics-${database}-${activeTab?.id}`,
212216
activeTab?.id === TENANT_DIAGNOSTICS_TABS_IDS.overview,
213217
);
214218

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

Lines changed: 12 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -18,11 +18,17 @@ import {cpuDashboardConfig} from './cpuDashboardConfig';
1818

1919
interface TenantCpuProps {
2020
tenantName: string;
21+
databaseFullPath?: string;
2122
additionalNodesProps?: AdditionalNodesProps;
2223
databaseType?: ETenantType;
2324
}
2425

25-
export function TenantCpu({tenantName, additionalNodesProps, databaseType}: TenantCpuProps) {
26+
export function TenantCpu({
27+
tenantName,
28+
additionalNodesProps,
29+
databaseType,
30+
databaseFullPath,
31+
}: TenantCpuProps) {
2632
const dispatch = useTypedDispatch();
2733
const getDiagnosticsPageLink = useDiagnosticsPageLinkGetter();
2834

@@ -58,7 +64,11 @@ export function TenantCpu({tenantName, additionalNodesProps, databaseType}: Tena
5864
</>
5965
)}
6066
<StatsWrapper title={i18n('title_top-shards')} allEntitiesLink={topShardsLink}>
61-
<TopShards tenantName={tenantName} path={tenantName} />
67+
<TopShards
68+
tenantName={tenantName}
69+
path={tenantName}
70+
databaseFullPath={databaseFullPath}
71+
/>
6272
</StatsWrapper>
6373
<StatsWrapper
6474
title={i18n('title_top-queries')}

‎src/containers/Tenant/Diagnostics/TenantOverview/TenantCpu/TopShards.tsx‎

Lines changed: 10 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -10,15 +10,23 @@ const columnsIds: TopShardsColumnId[] = ['TabletId', 'Path', 'CPUCores'];
1010
interface TopShardsProps {
1111
tenantName: string;
1212
path: string;
13+
databaseFullPath?: string;
1314
}
1415

15-
export const TopShards = ({tenantName, path}: TopShardsProps) => {
16+
export const TopShards = ({tenantName, path, databaseFullPath = tenantName}: TopShardsProps) => {
1617
const ShardsTable = useComponent('ShardsTable');
1718

1819
const [autoRefreshInterval] = useAutoRefreshInterval();
1920

21+
let normalizedPath = path;
22+
if (tenantName !== databaseFullPath) {
23+
//tenantName may be database full path or database id. If it is database id, we must remove it from object's path and add database full path instead
24+
const shrinkedPath = path.startsWith(tenantName) ? path.slice(tenantName.length) : path;
25+
normalizedPath = databaseFullPath + shrinkedPath;
26+
}
27+
2028
const {currentData, isFetching, error} = topShardsApi.useGetTopShardsQuery(
21-
{database: tenantName, path},
29+
{database: tenantName, path: normalizedPath, databaseFullPath},
2230
{pollingInterval: autoRefreshInterval},
2331
);
2432

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

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -143,6 +143,7 @@ export function TenantOverview({
143143
tenantName={tenantName}
144144
additionalNodesProps={additionalNodesProps}
145145
databaseType={Type}
146+
databaseFullPath={Name}
146147
/>
147148
);
148149
}

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

Lines changed: 12 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -42,9 +42,10 @@ function fillDateRangeFor(value: ShardsWorkloadFilters) {
4242
interface TopShardsProps {
4343
tenantName: string;
4444
path: string;
45+
databaseFullPath: string;
4546
}
4647

47-
export const TopShards = ({tenantName, path}: TopShardsProps) => {
48+
export const TopShards = ({tenantName, path, databaseFullPath}: TopShardsProps) => {
4849
const ShardsTable = useComponent('ShardsTable');
4950

5051
const dispatch = useTypedDispatch();
@@ -71,16 +72,25 @@ export const TopShards = ({tenantName, path}: TopShardsProps) => {
7172

7273
const {tableSort, handleTableSort, backendSort} = useTopShardSort();
7374

75+
let normalizedPath = path;
76+
77+
if (tenantName !== databaseFullPath) {
78+
//tenantName may be database full path or database id. If it is database id, we must remove it from object's path and add database full path instead
79+
const shrinkedPath = path.startsWith(tenantName) ? path.slice(tenantName.length) : path;
80+
normalizedPath = databaseFullPath + shrinkedPath;
81+
}
82+
7483
const {
7584
currentData: result,
7685
isFetching,
7786
error,
7887
} = shardApi.useSendShardQueryQuery(
7988
{
8089
database: tenantName,
81-
path: path,
90+
path: normalizedPath,
8291
sortOrder: backendSort,
8392
filters,
93+
databaseFullPath,
8494
},
8595
{pollingInterval: autoRefreshInterval},
8696
);

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

Lines changed: 13 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,6 @@ import {
1111
} from '@gravity-ui/uikit';
1212
import qs from 'qs';
1313
import {useLocation} from 'react-router-dom';
14-
import {StringParam, useQueryParam} from 'use-query-params';
1514

1615
import {AsyncReplicationState} from '../../../components/AsyncReplicationState';
1716
import {toFormattedSize} from '../../../components/FormattedBytes/utils';
@@ -37,6 +36,7 @@ import {EntityTitle} from '../EntityTitle/EntityTitle';
3736
import {SchemaViewer} from '../Schema/SchemaViewer/SchemaViewer';
3837
import {useCurrentSchema} from '../TenantContext';
3938
import {TENANT_INFO_TABS, TENANT_SCHEMA_TAB, TenantTabsGroups, getTenantPath} from '../TenantPages';
39+
import {useTenantQueryParams} from '../useTenantQueryParams';
4040
import {getSummaryControls} from '../utils/controls';
4141
import {
4242
PaneVisibilityActionTypes,
@@ -76,9 +76,10 @@ export function ObjectSummary({
7676
onExpandSummary,
7777
isCollapsed,
7878
}: ObjectSummaryProps) {
79-
const {path, database: tenantName, type, subType} = useCurrentSchema();
79+
const {path, database, type, subType, databaseFullPath} = useCurrentSchema();
80+
8081
const dispatch = useTypedDispatch();
81-
const [, setCurrentPath] = useQueryParam('schema', StringParam);
82+
const {handleSchemaChange} = useTenantQueryParams();
8283
const [commonInfoVisibilityState, dispatchCommonInfoVisibilityState] = React.useReducer(
8384
paneVisibilityToggleReducerCreator(DEFAULT_IS_TENANT_COMMON_INFO_COLLAPSED),
8485
undefined,
@@ -97,7 +98,7 @@ export function ObjectSummary({
9798

9899
const {currentData: currentObjectData} = overviewApi.useGetOverviewQuery({
99100
path,
100-
database: tenantName,
101+
database,
101102
});
102103
const currentSchemaData = currentObjectData?.PathDescription?.Self;
103104

@@ -366,7 +367,7 @@ export function ObjectSummary({
366367
const renderTabContent = () => {
367368
switch (summaryTab) {
368369
case TENANT_SUMMARY_TABS_IDS.schema: {
369-
return <SchemaViewer type={type} path={path} tenantName={tenantName} />;
370+
return <SchemaViewer type={type} path={path} tenantName={database} />;
370371
}
371372
default: {
372373
return renderObjectOverview();
@@ -385,7 +386,7 @@ export function ObjectSummary({
385386
dispatchCommonInfoVisibilityState(PaneVisibilityActionTypes.clear);
386387
};
387388

388-
const relativePath = transformPath(path, tenantName);
389+
const relativePath = transformPath(path, database, databaseFullPath);
389390

390391
const renderCommonInfoControls = () => {
391392
const showPreview = isTableType(type) && !isIndexTableType(subType);
@@ -394,7 +395,7 @@ export function ObjectSummary({
394395
{showPreview &&
395396
getSummaryControls(
396397
dispatch,
397-
{setActivePath: setCurrentPath},
398+
{setActivePath: handleSchemaChange},
398399
'm',
399400
)(path, 'preview')}
400401
<ClipboardButton
@@ -447,7 +448,11 @@ export function ObjectSummary({
447448
minSize={[200, 52]}
448449
collapsedSizes={[100, 0]}
449450
>
450-
<ObjectTree tenantName={tenantName} path={path} />
451+
<ObjectTree
452+
tenantName={database}
453+
path={path}
454+
databaseFullPath={databaseFullPath}
455+
/>
451456
<div className={b('info')}>
452457
<div className={b('sticky-top')}>
453458
<div className={b('info-header')}>

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

Lines changed: 6 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,14 @@
1-
import {StringParam, useQueryParam} from 'use-query-params';
2-
31
import {Loader} from '../../../components/Loader';
42
import {useGetSchemaQuery} from '../../../store/reducers/schema/schema';
3+
import {useTenantQueryParams} from '../useTenantQueryParams';
54

65
import {SchemaTree} from './SchemaTree/SchemaTree';
76
import i18n from './i18n';
87
import {b} from './shared';
98

109
interface ObjectTreeProps {
1110
tenantName: string;
11+
databaseFullPath: string;
1212
path?: string;
1313
}
1414

@@ -20,14 +20,14 @@ function prepareSchemaRootName(name: string | undefined, fallback: string): stri
2020
return fallback.startsWith('/') ? fallback : `/${fallback}`;
2121
}
2222

23-
export function ObjectTree({tenantName, path}: ObjectTreeProps) {
23+
export function ObjectTree({tenantName, path, databaseFullPath}: ObjectTreeProps) {
2424
const {data: tenantData = {}, isLoading} = useGetSchemaQuery({
2525
path: tenantName,
2626
database: tenantName,
2727
});
2828
const pathData = tenantData?.PathDescription?.Self;
2929

30-
const [, setCurrentPath] = useQueryParam('schema', StringParam);
30+
const {handleSchemaChange} = useTenantQueryParams();
3131

3232
if (!pathData && isLoading) {
3333
// If Loader isn't wrapped with div, SplitPane doesn't calculate panes height correctly
@@ -44,13 +44,14 @@ export function ObjectTree({tenantName, path}: ObjectTreeProps) {
4444
<div className={b('tree')}>
4545
{pathData ? (
4646
<SchemaTree
47+
databaseFullPath={databaseFullPath}
4748
rootPath={tenantName}
4849
// for the root pathData.Name contains the same string as tenantName,
4950
// ensure it has the leading slash
5051
rootName={prepareSchemaRootName(pathData.Name, tenantName)}
5152
rootType={pathData.PathType}
5253
currentPath={path}
53-
onActivePathUpdate={setCurrentPath}
54+
onActivePathUpdate={handleSchemaChange}
5455
/>
5556
) : null}
5657
</div>

0 commit comments

Comments
 (0)