Skip to content

Commit dc9675c

Browse files
artemmufazalovartemmufazalov
committed
fix: temp
1 parent 6b9c785 commit dc9675c

File tree

8 files changed

+153
-95
lines changed

8 files changed

+153
-95
lines changed

‎src/components/InfoViewer/InfoViewer2.scss

Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
@import '../../styles/mixins.scss';
2+
3+
.ydb-info-viewer2 {
4+
@include flex-container();
5+
6+
&__title {
7+
@include info-viewer-title();
8+
}
9+
10+
& &__properties-list {
11+
max-width: calc(100% - 40px);
12+
}
13+
14+
& &__item + &__item {
15+
margin-block-start: var(--g-spacing-3);
16+
}
17+
}

‎src/components/InfoViewer/InfoViewer2.tsx

Lines changed: 67 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,67 @@
1+
import React from 'react';
2+
3+
import type {DefinitionListProps} from '@gravity-ui/components';
4+
import {DefinitionList} from '@gravity-ui/components';
5+
6+
import {cn} from '../../utils/cn';
7+
8+
import i18n from './i18n';
9+
10+
import './InfoViewer2.scss';
11+
12+
const b = cn('ydb-info-viewer2');
13+
14+
interface InfoViewer2Props extends DefinitionListProps {
15+
title?: React.ReactNode;
16+
17+
displayNoData?: boolean;
18+
nullIfEmpty?: boolean;
19+
}
20+
21+
/** DefinitionList with predefined styles */
22+
export function InfoViewer2({
23+
title,
24+
displayNoData,
25+
nullIfEmpty,
26+
items,
27+
nameMaxWidth = 240,
28+
copyPosition = 'outside',
29+
className,
30+
itemClassName,
31+
...restProps
32+
}: InfoViewer2Props) {
33+
const renderTitle = () => {
34+
if (title) {
35+
return <div className={b('title')}>{title}</div>;
36+
}
37+
return null;
38+
};
39+
40+
const renderContent = () => {
41+
if (items.length) {
42+
return (
43+
<DefinitionList
44+
items={items}
45+
nameMaxWidth={nameMaxWidth}
46+
copyPosition={copyPosition}
47+
className={b('properties-list', className)}
48+
itemClassName={b('item', itemClassName)}
49+
{...restProps}
50+
/>
51+
);
52+
}
53+
54+
return displayNoData ? i18n('no-data') : null;
55+
};
56+
57+
if (!items.length && nullIfEmpty) {
58+
return null;
59+
}
60+
61+
return (
62+
<div className={b(null)}>
63+
{renderTitle()}
64+
{renderContent()}
65+
</div>
66+
);
67+
}

‎src/components/InfoViewer/index.ts

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
import {InfoViewer} from './InfoViewer';
2+
import {InfoViewer2} from './InfoViewer2';
23

3-
export {InfoViewer};
4+
export {InfoViewer, InfoViewer2};
45
export * from './utils';
56
export type {InfoViewerItem} from './InfoViewer';

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

Lines changed: 46 additions & 47 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,8 @@
1+
import type {DefinitionListItem} from '@gravity-ui/components';
12
import {Flex, Text} from '@gravity-ui/uikit';
23

34
import {AsyncReplicationState} from '../../../../../components/AsyncReplicationState';
4-
import {InfoViewer} from '../../../../../components/InfoViewer';
5+
import {InfoViewer2} from '../../../../../components/InfoViewer';
56
import type {TEvDescribeSchemeResult} from '../../../../../types/api/schema';
67
import {getEntityName} from '../../../utils';
78
import {AsyncReplicationPaths} from '../AsyncReplicationPaths';
@@ -25,55 +26,53 @@ export function AsyncReplicationInfo({data}: AsyncReplicationProps) {
2526
);
2627
}
2728

29+
const replicationItems = prepareReplicationItems(data);
30+
2831
return (
2932
<Flex direction="column" gap="4">
30-
<InfoViewer
31-
title={entityName}
32-
info={[
33-
{
34-
label: i18n('state.label'),
35-
value: (
36-
<AsyncReplicationState
37-
state={data.PathDescription?.ReplicationDescription?.State}
38-
/>
39-
),
40-
},
41-
{
42-
label: i18n('srcConnection.endpoint.label'),
43-
value: (
44-
<Text variant="code-inline-2">
45-
{
46-
data.PathDescription?.ReplicationDescription?.Config
47-
?.SrcConnectionParams?.Endpoint
48-
}
49-
</Text>
50-
),
51-
},
52-
{
53-
label: i18n('srcConnection.database.label'),
54-
value: (
55-
<Text variant="code-inline-2">
56-
{
57-
data.PathDescription?.ReplicationDescription?.Config
58-
?.SrcConnectionParams?.Database
59-
}
60-
</Text>
61-
),
62-
},
63-
{
64-
label: i18n('credentials.label'),
65-
value: (
66-
<Credentials
67-
connection={
68-
data.PathDescription?.ReplicationDescription?.Config
69-
?.SrcConnectionParams
70-
}
71-
/>
72-
),
73-
},
74-
]}
75-
/>
33+
<InfoViewer2 title={entityName} items={replicationItems} />
7634
<AsyncReplicationPaths config={data.PathDescription?.ReplicationDescription?.Config} />
7735
</Flex>
7836
);
7937
}
38+
39+
function prepareReplicationItems(data?: TEvDescribeSchemeResult) {
40+
const replicationDescription = data?.PathDescription?.ReplicationDescription || {};
41+
const state = replicationDescription.State;
42+
const srcConnectionParams = replicationDescription.Config?.SrcConnectionParams || {};
43+
const {Endpoint, Database} = srcConnectionParams;
44+
45+
const info: DefinitionListItem[] = [];
46+
47+
if (state) {
48+
info.push({
49+
name: i18n('state.label'),
50+
content: <AsyncReplicationState state={state} />,
51+
});
52+
}
53+
54+
if (Endpoint) {
55+
info.push({
56+
name: i18n('srcConnection.endpoint.label'),
57+
copyText: Endpoint,
58+
content: <Text variant="code-inline-2">{Endpoint}</Text>,
59+
});
60+
}
61+
62+
if (Database) {
63+
info.push({
64+
name: i18n('srcConnection.database.label'),
65+
copyText: Database,
66+
content: <Text variant="code-inline-2">{Database}</Text>,
67+
});
68+
}
69+
70+
if (srcConnectionParams) {
71+
info.push({
72+
name: i18n('credentials.label'),
73+
content: <Credentials connection={srcConnectionParams} />,
74+
});
75+
}
76+
77+
return info;
78+
}

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

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import React from 'react';
22

3-
import {InfoViewer} from '../../../../../components/InfoViewer';
3+
import {InfoViewer, InfoViewer2} from '../../../../../components/InfoViewer';
44
import type {EPathType, TEvDescribeSchemeResult} from '../../../../../types/api/schema';
55
import {cn} from '../../../../../utils/cn';
66
import {EntityTitle} from '../../../EntityTitle/EntityTitle';
@@ -29,11 +29,11 @@ export const TableInfo = ({data, type}: TableInfoProps) => {
2929

3030
return (
3131
<div className={b()}>
32-
<InfoViewer
33-
info={generalInfo}
32+
<InfoViewer2
33+
items={generalInfo}
3434
title={title}
3535
className={b('info-block')}
36-
renderEmptyState={() => <div className={b('title')}>{title}</div>}
36+
displayNoData={false}
3737
/>
3838
<div className={b('row')}>
3939
{tableStatsInfo ? (

‎src/containers/Tenant/Diagnostics/Overview/TableInfo/prepareTableInfo.tsx

Lines changed: 11 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -33,12 +33,12 @@ const isInStoreColumnTable = (table: TColumnTableDescription) => {
3333
const prepareTTL = (ttl: TTTLSettings | TColumnDataLifeCycle) => {
3434
// ExpireAfterSeconds could be 0
3535
if (ttl.Enabled && ttl.Enabled.ColumnName && ttl.Enabled.ExpireAfterSeconds !== undefined) {
36-
const value = i18n('value.ttl', {
36+
const content = i18n('value.ttl', {
3737
columnName: ttl.Enabled.ColumnName,
3838
expireTime: formatDurationToShortTimeFormat(ttl.Enabled.ExpireAfterSeconds * 1000, 1),
3939
});
4040

41-
return {label: i18n('label.ttl'), value};
41+
return {name: i18n('label.ttl'), content};
4242
}
4343
return undefined;
4444
};
@@ -92,18 +92,18 @@ const prepareTableGeneralInfo = (PartitionConfig: TPartitionConfig, TTLSettings?
9292
: i18n('disabled');
9393

9494
generalTableInfo.push(
95-
{label: i18n('label.partitioning-by-size'), value: partitioningBySize},
96-
{label: i18n('label.partitioning-by-load'), value: partitioningByLoad},
95+
{name: i18n('label.partitioning-by-size'), content: partitioningBySize},
96+
{name: i18n('label.partitioning-by-load'), content: partitioningByLoad},
9797
{
98-
label: i18n('label.partitions-min'),
99-
value: formatNumber(PartitioningPolicy.MinPartitionsCount || 0),
98+
name: i18n('label.partitions-min'),
99+
content: formatNumber(PartitioningPolicy.MinPartitionsCount || 0),
100100
},
101101
);
102102

103103
if (PartitioningPolicy.MaxPartitionsCount) {
104104
generalTableInfo.push({
105-
label: i18n('label.partitions-max'),
106-
value: formatNumber(PartitioningPolicy.MaxPartitionsCount),
105+
name: i18n('label.partitions-max'),
106+
content: formatNumber(PartitioningPolicy.MaxPartitionsCount),
107107
});
108108
}
109109

@@ -119,7 +119,7 @@ const prepareTableGeneralInfo = (PartitionConfig: TPartitionConfig, TTLSettings?
119119
readReplicasConfig = `ANY_AZ: ${FollowerCount}`;
120120
}
121121

122-
generalTableInfo.push({label: i18n('label.read-replicas'), value: readReplicasConfig});
122+
generalTableInfo.push({name: i18n('label.read-replicas'), content: readReplicasConfig});
123123
}
124124

125125
if (TTLSettings) {
@@ -131,8 +131,8 @@ const prepareTableGeneralInfo = (PartitionConfig: TPartitionConfig, TTLSettings?
131131

132132
if (valueIsDefined(EnableFilterByKey)) {
133133
generalTableInfo.push({
134-
label: i18n('label.bloom-filter'),
135-
value: EnableFilterByKey ? i18n('enabled') : i18n('disabled'),
134+
name: i18n('label.bloom-filter'),
135+
content: EnableFilterByKey ? i18n('enabled') : i18n('disabled'),
136136
});
137137
}
138138

‎src/containers/Tenant/Info/View/View.scss

Lines changed: 0 additions & 13 deletions
This file was deleted.

‎src/containers/Tenant/Info/View/View.tsx

Lines changed: 6 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -1,18 +1,13 @@
11
import type {DefinitionListItem} from '@gravity-ui/components';
2-
import {DefinitionList} from '@gravity-ui/components';
32
import {Text} from '@gravity-ui/uikit';
43

4+
import {InfoViewer2} from '../../../../components/InfoViewer';
55
import type {TEvDescribeSchemeResult} from '../../../../types/api/schema';
6-
import {cn} from '../../../../utils/cn';
76
import {getEntityName} from '../../utils';
87
import i18n from '../i18n';
98

10-
const b = cn('ydb-view-info');
11-
12-
import './View.scss';
13-
14-
const prepareViewItems = (data: TEvDescribeSchemeResult): DefinitionListItem[] => {
15-
const queryText = data.PathDescription?.ViewDescription?.QueryText;
9+
const prepareViewItems = (data?: TEvDescribeSchemeResult): DefinitionListItem[] => {
10+
const queryText = data?.PathDescription?.ViewDescription?.QueryText;
1611

1712
return [
1813
{
@@ -34,19 +29,11 @@ interface ViewInfoProps {
3429
export function ViewInfo({data}: ViewInfoProps) {
3530
const entityName = getEntityName(data?.PathDescription);
3631

32+
const items = prepareViewItems(data);
33+
3734
if (!data) {
3835
return <div className="error">No {entityName} data</div>;
3936
}
4037

41-
return (
42-
<div className={b(null)}>
43-
<div className={b('title')}>{entityName}</div>
44-
<DefinitionList
45-
nameMaxWidth={200}
46-
copyPosition="outside"
47-
className={b('properties-list')}
48-
items={prepareViewItems(data)}
49-
/>
50-
</div>
51-
);
38+
return <InfoViewer2 title={entityName} items={items} />;
5239
}

0 commit comments

Comments
 (0)