Skip to content

Commit 1d26b81

Browse files
artemmufazalovartemmufazalov
authored
refactor: split storage columns files, update types (#1317)
1 parent 964122f commit 1d26b81

File tree

23 files changed

+278
-139
lines changed

23 files changed

+278
-139
lines changed

‎src/containers/PDiskPage/PDiskGroups/PDiskGroups.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,7 @@ import {
99
import {storageApi} from '../../../store/reducers/storage/storage';
1010
import {DEFAULT_TABLE_SETTINGS} from '../../../utils/constants';
1111
import {useAutoRefreshInterval} from '../../../utils/hooks';
12-
import {STORAGE_GROUPS_COLUMNS_WIDTH_LS_KEY} from '../../Storage/StorageGroups/columns/getStorageGroupsColumns';
12+
import {STORAGE_GROUPS_COLUMNS_WIDTH_LS_KEY} from '../../Storage/StorageGroups/columns/constants';
1313
import {useGetDiskStorageColumns} from '../../Storage/StorageGroups/columns/hooks';
1414

1515
import {preparePDiskStorageResponse} from './utils';

‎src/containers/Storage/PaginatedStorage.tsx‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -13,6 +13,8 @@ import {StorageControls} from './StorageControls/StorageControls';
1313
import {PaginatedStorageGroups} from './StorageGroups/PaginatedStorageGroups';
1414
import {PaginatedStorageNodes} from './StorageNodes/PaginatedStorageNodes';
1515

16+
import './Storage.scss';
17+
1618
interface PaginatedStorageProps {
1719
database?: string;
1820
nodeId?: string;

‎src/containers/Storage/StorageGroups/PaginatedStorageGroups.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,7 @@ import {VISIBLE_ENTITIES} from '../../../store/reducers/storage/constants';
1111
import type {VisibleEntities} from '../../../store/reducers/storage/types';
1212

1313
import {StorageGroupsEmptyDataMessage} from './StorageGroupsEmptyDataMessage';
14-
import {STORAGE_GROUPS_COLUMNS_WIDTH_LS_KEY} from './columns/getStorageGroupsColumns';
14+
import {STORAGE_GROUPS_COLUMNS_WIDTH_LS_KEY} from './columns/constants';
1515
import {useGetStorageGroupsColumns} from './columns/hooks';
1616
import {useGroupsGetter} from './getGroups';
1717
import i18n from './i18n';

‎src/containers/Storage/StorageGroups/StorageGroups.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@ import type {PreparedStorageGroup, VisibleEntities} from '../../../store/reducer
66
import type {HandleSort} from '../../../utils/hooks/useTableSort';
77

88
import {StorageGroupsEmptyDataMessage} from './StorageGroupsEmptyDataMessage';
9-
import {STORAGE_GROUPS_COLUMNS_WIDTH_LS_KEY} from './columns/getStorageGroupsColumns';
9+
import {STORAGE_GROUPS_COLUMNS_WIDTH_LS_KEY} from './columns/constants';
1010
import {useGetStorageGroupsColumns} from './columns/hooks';
1111
import i18n from './i18n';
1212

‎src/containers/Storage/StorageGroups/columns/getStorageGroupsColumns.tsx‎ renamed to ‎src/containers/Storage/StorageGroups/columns/columns.tsx‎

Lines changed: 31 additions & 47 deletions
Original file line numberDiff line numberDiff line change
@@ -21,33 +21,16 @@ import {Disks} from '../../Disks/Disks';
2121
import {getDegradedSeverity, getUsageSeverityForStorageGroup} from '../../utils';
2222
import i18n from '../i18n';
2323

24+
import {STORAGE_GROUPS_COLUMNS_IDS, STORAGE_GROUPS_COLUMNS_TITLES} from './constants';
2425
import type {StorageColumnsGetter, StorageGroupsColumn} from './types';
2526

2627
import './StorageGroupsColumns.scss';
2728

2829
const b = cn('ydb-storage-groups-columns');
2930

30-
export const STORAGE_GROUPS_COLUMNS_WIDTH_LS_KEY = 'storageGroupsColumnsWidth';
31-
32-
export const GROUPS_COLUMNS_IDS = {
33-
PoolName: 'PoolName',
34-
MediaType: 'MediaType',
35-
Erasure: 'Erasure',
36-
GroupId: 'GroupId',
37-
Used: 'Used',
38-
Limit: 'Limit',
39-
Usage: 'Usage',
40-
DiskSpace: 'DiskSpace',
41-
Read: 'Read',
42-
Write: 'Write',
43-
VDisks: 'VDisks',
44-
Disks: 'Disks',
45-
Degraded: 'Degraded',
46-
} as const;
47-
4831
const poolNameColumn: StorageGroupsColumn = {
49-
name: GROUPS_COLUMNS_IDS.PoolName,
50-
header: 'Pool Name',
32+
name: STORAGE_GROUPS_COLUMNS_IDS.PoolName,
33+
header: STORAGE_GROUPS_COLUMNS_TITLES.PoolName,
5134
width: 250,
5235
render: ({row}) => {
5336
const splitted = row.PoolName?.split('/');
@@ -68,8 +51,8 @@ const poolNameColumn: StorageGroupsColumn = {
6851
};
6952

7053
const typeColumn: StorageGroupsColumn = {
71-
name: GROUPS_COLUMNS_IDS.MediaType,
72-
header: 'Type',
54+
name: STORAGE_GROUPS_COLUMNS_IDS.MediaType,
55+
header: STORAGE_GROUPS_COLUMNS_TITLES.MediaType,
7356
width: 100,
7457
resizeMinWidth: 100,
7558
align: DataTable.LEFT,
@@ -94,17 +77,17 @@ const typeColumn: StorageGroupsColumn = {
9477
};
9578

9679
const erasureColumn: StorageGroupsColumn = {
97-
name: GROUPS_COLUMNS_IDS.Erasure,
98-
header: 'Erasure',
80+
name: STORAGE_GROUPS_COLUMNS_IDS.Erasure,
81+
header: STORAGE_GROUPS_COLUMNS_TITLES.Erasure,
9982
width: 100,
10083
sortAccessor: (row) => row.ErasureSpecies,
10184
render: ({row}) => (row.ErasureSpecies ? row.ErasureSpecies : '-'),
10285
align: DataTable.LEFT,
10386
};
10487

10588
const degradedColumn: StorageGroupsColumn = {
106-
name: GROUPS_COLUMNS_IDS.Degraded,
107-
header: 'Degraded',
89+
name: STORAGE_GROUPS_COLUMNS_IDS.Degraded,
90+
header: STORAGE_GROUPS_COLUMNS_TITLES.Degraded,
10891
width: 110,
10992
resizeMinWidth: 110,
11093
render: ({row}) =>
@@ -118,8 +101,8 @@ const degradedColumn: StorageGroupsColumn = {
118101
};
119102

120103
const usageColumn: StorageGroupsColumn = {
121-
name: GROUPS_COLUMNS_IDS.Usage,
122-
header: 'Usage',
104+
name: STORAGE_GROUPS_COLUMNS_IDS.Usage,
105+
header: STORAGE_GROUPS_COLUMNS_TITLES.Usage,
123106
width: 75,
124107
resizeMinWidth: 75,
125108
render: ({row}) => {
@@ -137,8 +120,8 @@ const usageColumn: StorageGroupsColumn = {
137120
};
138121

139122
const groupIdColumn: StorageGroupsColumn = {
140-
name: GROUPS_COLUMNS_IDS.GroupId,
141-
header: 'Group ID',
123+
name: STORAGE_GROUPS_COLUMNS_IDS.GroupId,
124+
header: STORAGE_GROUPS_COLUMNS_TITLES.GroupId,
142125
width: 130,
143126
render: ({row}) => {
144127
return row.GroupId ? (
@@ -154,8 +137,8 @@ const groupIdColumn: StorageGroupsColumn = {
154137
};
155138

156139
const usedColumn: StorageGroupsColumn = {
157-
name: GROUPS_COLUMNS_IDS.Used,
158-
header: 'Used',
140+
name: STORAGE_GROUPS_COLUMNS_IDS.Used,
141+
header: STORAGE_GROUPS_COLUMNS_TITLES.Used,
159142
width: 100,
160143
render: ({row}) => {
161144
return bytesToGB(row.Used, true);
@@ -164,8 +147,8 @@ const usedColumn: StorageGroupsColumn = {
164147
};
165148

166149
const limitColumn: StorageGroupsColumn = {
167-
name: GROUPS_COLUMNS_IDS.Limit,
168-
header: 'Limit',
150+
name: STORAGE_GROUPS_COLUMNS_IDS.Limit,
151+
header: STORAGE_GROUPS_COLUMNS_TITLES.Limit,
169152
width: 100,
170153
render: ({row}) => {
171154
return bytesToGB(row.Limit);
@@ -174,8 +157,8 @@ const limitColumn: StorageGroupsColumn = {
174157
};
175158

176159
const usedSpaceFlagColumn: StorageGroupsColumn = {
177-
name: GROUPS_COLUMNS_IDS.DiskSpace,
178-
header: 'Space',
160+
name: STORAGE_GROUPS_COLUMNS_IDS.DiskSpace,
161+
header: STORAGE_GROUPS_COLUMNS_TITLES.DiskSpace,
179162
width: 110,
180163
render: ({row}) => {
181164
return <EntityStatus status={row.DiskSpace} />;
@@ -184,8 +167,8 @@ const usedSpaceFlagColumn: StorageGroupsColumn = {
184167
};
185168

186169
const readColumn: StorageGroupsColumn = {
187-
name: GROUPS_COLUMNS_IDS.Read,
188-
header: 'Read',
170+
name: STORAGE_GROUPS_COLUMNS_IDS.Read,
171+
header: STORAGE_GROUPS_COLUMNS_TITLES.Read,
189172
width: 100,
190173
render: ({row}) => {
191174
return row.Read ? bytesToSpeed(row.Read) : '-';
@@ -194,8 +177,8 @@ const readColumn: StorageGroupsColumn = {
194177
};
195178

196179
const writeColumn: StorageGroupsColumn = {
197-
name: GROUPS_COLUMNS_IDS.Write,
198-
header: 'Write',
180+
name: STORAGE_GROUPS_COLUMNS_IDS.Write,
181+
header: STORAGE_GROUPS_COLUMNS_TITLES.Write,
199182
width: 100,
200183
render: ({row}) => {
201184
return row.Write ? bytesToSpeed(row.Write) : '-';
@@ -204,9 +187,9 @@ const writeColumn: StorageGroupsColumn = {
204187
};
205188

206189
const getVDisksColumn = (nodes?: NodesMap): StorageGroupsColumn => ({
207-
name: GROUPS_COLUMNS_IDS.VDisks,
190+
name: STORAGE_GROUPS_COLUMNS_IDS.VDisks,
191+
header: STORAGE_GROUPS_COLUMNS_TITLES.VDisks,
208192
className: b('vdisks-column'),
209-
header: 'VDisks',
210193
render: ({row}) => (
211194
<div className={b('vdisks-wrapper')}>
212195
{row.VDisks?.map((vDisk) => {
@@ -228,9 +211,9 @@ const getVDisksColumn = (nodes?: NodesMap): StorageGroupsColumn => ({
228211
});
229212

230213
const getDisksColumn = (nodes?: NodesMap): StorageGroupsColumn => ({
231-
name: GROUPS_COLUMNS_IDS.Disks,
214+
name: STORAGE_GROUPS_COLUMNS_IDS.VDisksPDisks,
215+
header: STORAGE_GROUPS_COLUMNS_TITLES.VDisksPDisks,
232216
className: b('disks-column'),
233-
header: 'Disks',
234217
render: ({row}) => {
235218
return <Disks vDisks={row.VDisks} nodes={nodes} />;
236219
},
@@ -301,16 +284,17 @@ const filterStorageGroupsColumns = (
301284
visibleEntities?: VisibleEntities,
302285
) => {
303286
if (visibleEntities === VISIBLE_ENTITIES.space) {
304-
return columns.filter((col) => col.name !== GROUPS_COLUMNS_IDS.Degraded);
287+
return columns.filter((col) => col.name !== STORAGE_GROUPS_COLUMNS_IDS.Degraded);
305288
}
306289

307290
if (visibleEntities === VISIBLE_ENTITIES.missing) {
308-
return columns.filter((col) => col.name !== GROUPS_COLUMNS_IDS.DiskSpace);
291+
return columns.filter((col) => col.name !== STORAGE_GROUPS_COLUMNS_IDS.DiskSpace);
309292
}
310293

311294
return columns.filter((col) => {
312295
return (
313-
col.name !== GROUPS_COLUMNS_IDS.Degraded && col.name !== GROUPS_COLUMNS_IDS.DiskSpace
296+
col.name !== STORAGE_GROUPS_COLUMNS_IDS.Degraded &&
297+
col.name !== STORAGE_GROUPS_COLUMNS_IDS.DiskSpace
314298
);
315299
});
316300
};

‎src/containers/Storage/StorageGroups/columns/constants.ts‎

Lines changed: 67 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,67 @@
1+
import type {ValueOf} from '../../../../types/common';
2+
3+
import i18n from './i18n';
4+
5+
export const STORAGE_GROUPS_COLUMNS_WIDTH_LS_KEY = 'storageGroupsColumnsWidth';
6+
7+
export const STORAGE_GROUPS_COLUMNS_IDS = {
8+
PoolName: 'PoolName',
9+
MediaType: 'MediaType',
10+
Erasure: 'Erasure',
11+
GroupId: 'GroupId',
12+
Used: 'Used',
13+
Limit: 'Limit',
14+
Usage: 'Usage',
15+
DiskSpace: 'DiskSpace',
16+
Read: 'Read',
17+
Write: 'Write',
18+
VDisks: 'VDisks',
19+
VDisksPDisks: 'VDisksPDisks',
20+
Degraded: 'Degraded',
21+
} as const;
22+
23+
type StorageGroupsColumnId = ValueOf<typeof STORAGE_GROUPS_COLUMNS_IDS>;
24+
25+
// This code is running when module is initialized and correct language may not be set yet
26+
// get functions guarantee that i18n fields will be inited on render with current render language
27+
export const STORAGE_GROUPS_COLUMNS_TITLES = {
28+
get PoolName() {
29+
return i18n('pool-name');
30+
},
31+
get MediaType() {
32+
return i18n('type');
33+
},
34+
get Erasure() {
35+
return i18n('erasure');
36+
},
37+
get GroupId() {
38+
return i18n('group-id');
39+
},
40+
get Used() {
41+
return i18n('used');
42+
},
43+
get Limit() {
44+
return i18n('limit');
45+
},
46+
get Usage() {
47+
return i18n('usage');
48+
},
49+
get DiskSpace() {
50+
return i18n('space');
51+
},
52+
get Read() {
53+
return i18n('read');
54+
},
55+
get Write() {
56+
return i18n('write');
57+
},
58+
get VDisks() {
59+
return i18n('vdisks');
60+
},
61+
get VDisksPDisks() {
62+
return i18n('vdisks-pdisks');
63+
},
64+
get Degraded() {
65+
return i18n('degraded');
66+
},
67+
} as const satisfies Record<StorageGroupsColumnId, string>;

‎src/containers/Storage/StorageGroups/columns/hooks.ts‎

Lines changed: 2 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -5,10 +5,7 @@ import type {VisibleEntities} from '../../../../store/reducers/storage/types';
55
import {USE_ADVANCED_STORAGE_KEY} from '../../../../utils/constants';
66
import {useSetting, useTypedSelector} from '../../../../utils/hooks';
77

8-
import {
9-
getDiskPageStorageColumns,
10-
getPreparedStorageGroupsColumns,
11-
} from './getStorageGroupsColumns';
8+
import {getDiskPageStorageColumns, getPreparedStorageGroupsColumns} from './columns';
129
import type {StorageColumnsGetter} from './types';
1310

1411
const useGetStorageColumns = (
@@ -23,7 +20,7 @@ const useGetStorageColumns = (
2320
}, [columnsGetter, nodes, useAdvancedStorage, visibleEntities]);
2421
};
2522

26-
export const useGetStorageGroupsColumns = (visibleEntities: VisibleEntities) => {
23+
export const useGetStorageGroupsColumns = (visibleEntities?: VisibleEntities) => {
2724
return useGetStorageColumns(getPreparedStorageGroupsColumns, visibleEntities);
2825
};
2926

‎src/containers/Storage/StorageGroups/columns/i18n/en.json‎

Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
{
2+
"pool-name": "Pool Name",
3+
"type": "Type",
4+
"erasure": "Erasure",
5+
"degraded": "Degraded",
6+
"usage": "Usage",
7+
"group-id": "Group ID",
8+
"used": "Used",
9+
"limit": "Limit",
10+
"space": "Space",
11+
"read": "Read",
12+
"write": "Write",
13+
"vdisks": "VDisks",
14+
"vdisks-pdisks": "VDisks with PDisks"
15+
}

‎src/containers/Storage/StorageGroups/columns/i18n/index.ts‎

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
import {registerKeysets} from '../../../../../utils/i18n';
2+
3+
import en from './en.json';
4+
5+
const COMPONENT = 'ydb-storage-groups-columns';
6+
7+
export default registerKeysets(COMPONENT, {en});

‎src/containers/Storage/StorageNodes/PaginatedStorageNodes.tsx‎

Lines changed: 5 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -8,14 +8,14 @@ import type {AdditionalNodesProps} from '../../../types/additionalProps';
88
import {NodesUptimeFilterValues} from '../../../utils/nodes';
99

1010
import {StorageNodesEmptyDataMessage} from './StorageNodesEmptyDataMessage';
11+
import {STORAGE_NODES_COLUMNS_WIDTH_LS_KEY} from './columns/constants';
12+
import {useGetStorageNodesColumns} from './columns/hooks';
1113
import {getStorageNodes} from './getNodes';
12-
import {
13-
STORAGE_NODES_COLUMNS_WIDTH_LS_KEY,
14-
getPreparedStorageNodesColumns,
15-
} from './getStorageNodesColumns';
1614
import i18n from './i18n';
1715
import {getRowUnavailableClassName} from './shared';
1816

17+
import './StorageNodes.scss';
18+
1919
interface PaginatedStorageNodesProps {
2020
searchValue: string;
2121
visibleEntities: VisibleEntities;
@@ -45,9 +45,7 @@ export const PaginatedStorageNodes = ({
4545
return {searchValue, visibleEntities, nodesUptimeFilter, database};
4646
}, [searchValue, visibleEntities, nodesUptimeFilter, database]);
4747

48-
const columns = React.useMemo(() => {
49-
return getPreparedStorageNodesColumns(additionalNodesProps, visibleEntities, database);
50-
}, [additionalNodesProps, visibleEntities, database]);
48+
const columns = useGetStorageNodesColumns({additionalNodesProps, visibleEntities, database});
5149

5250
const renderEmptyDataMessage = () => {
5351
if (

0 commit comments

Comments
 (0)