ydb-embedded-ui 4.3.0 → 4.4.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (76) hide show
  1. package/CHANGELOG.md +17 -0
  2. package/dist/containers/App/Content.js +2 -8
  3. package/dist/containers/AsideNavigation/AsideNavigation.tsx +1 -1
  4. package/dist/containers/Cluster/Cluster.scss +4 -0
  5. package/dist/containers/Cluster/Cluster.tsx +14 -8
  6. package/dist/{components → containers}/ClusterInfo/ClusterInfo.scss +39 -0
  7. package/dist/containers/ClusterInfo/ClusterInfo.tsx +207 -0
  8. package/dist/containers/ClusterInfo/utils.ts +13 -0
  9. package/dist/containers/Header/Header.tsx +9 -16
  10. package/dist/containers/Nodes/Nodes.tsx +4 -6
  11. package/dist/containers/Storage/DiskStateProgressBar/DiskStateProgressBar.tsx +2 -3
  12. package/dist/containers/Tenant/Diagnostics/Partitions/Headers/Headers.tsx +4 -4
  13. package/dist/containers/Tenant/Diagnostics/Partitions/Partitions.scss +4 -0
  14. package/dist/containers/Tenant/Diagnostics/Partitions/Partitions.tsx +2 -2
  15. package/dist/containers/Tenant/Diagnostics/Partitions/PartitionsControls/PartitionsControls.tsx +20 -26
  16. package/dist/containers/Tenant/Diagnostics/Partitions/i18n/en.json +1 -1
  17. package/dist/containers/Tenant/Diagnostics/Partitions/i18n/ru.json +1 -1
  18. package/dist/containers/UserSettings/Setting.tsx +82 -0
  19. package/dist/containers/UserSettings/UserSettings.tsx +61 -99
  20. package/dist/containers/Versions/GroupedNodesTree/GroupedNodesTree.scss +59 -0
  21. package/dist/containers/Versions/GroupedNodesTree/GroupedNodesTree.tsx +98 -0
  22. package/dist/containers/Versions/NodesTable/NodesTable.tsx +150 -0
  23. package/dist/containers/Versions/NodesTreeTitle/NodesTreeTitle.scss +55 -0
  24. package/dist/containers/Versions/NodesTreeTitle/NodesTreeTitle.tsx +62 -0
  25. package/dist/containers/Versions/Versions.scss +32 -0
  26. package/dist/containers/Versions/Versions.tsx +121 -0
  27. package/dist/containers/Versions/groupNodes.ts +124 -0
  28. package/dist/containers/Versions/types.ts +16 -0
  29. package/dist/routes.ts +0 -6
  30. package/dist/services/api.ts +3 -0
  31. package/dist/store/reducers/cluster/cluster.ts +4 -0
  32. package/dist/store/reducers/cluster/types.ts +3 -2
  33. package/dist/store/reducers/clusterNodes/clusterNodes.tsx +64 -0
  34. package/dist/store/reducers/clusterNodes/types.ts +22 -0
  35. package/dist/store/reducers/index.ts +2 -8
  36. package/dist/store/reducers/partitions/partitions.ts +2 -2
  37. package/dist/store/reducers/partitions/types.ts +1 -1
  38. package/dist/types/additionalProps.ts +5 -0
  39. package/dist/types/versions.ts +9 -0
  40. package/dist/utils/constants.ts +0 -11
  41. package/dist/utils/hooks/useSetting.ts +5 -3
  42. package/dist/utils/versions/getVersionsColors.ts +98 -0
  43. package/dist/utils/versions/index.ts +3 -0
  44. package/dist/utils/versions/parseNodesToVersionsValues.ts +28 -0
  45. package/dist/utils/versions/parseVersion.ts +23 -0
  46. package/package.json +1 -1
  47. package/dist/components/ClusterInfo/ClusterInfo.tsx +0 -239
  48. package/dist/components/FullGroupViewer/FullGroupViewer.js +0 -147
  49. package/dist/components/FullGroupViewer/FullGroupViewer.scss +0 -35
  50. package/dist/components/GroupTreeViewer/GroupTreeViewer.js +0 -87
  51. package/dist/components/GroupTreeViewer/GroupTreeViewer.scss +0 -16
  52. package/dist/components/GroupViewer/GroupViewer.js +0 -100
  53. package/dist/components/GroupViewer/GroupViewer.scss +0 -45
  54. package/dist/components/PDiskViewer/PDiskViewer.js +0 -79
  55. package/dist/components/PDiskViewer/PDiskViewer.scss +0 -46
  56. package/dist/components/TabletsViewer/TabletsViewer.js +0 -44
  57. package/dist/components/TabletsViewer/TabletsViewer.scss +0 -40
  58. package/dist/components/VerticalBars/VerticalBars.scss +0 -15
  59. package/dist/components/VerticalBars/VerticalBars.tsx +0 -38
  60. package/dist/components/VerticalBars/index.ts +0 -1
  61. package/dist/containers/Group/Group.js +0 -97
  62. package/dist/containers/Group/Group.scss +0 -6
  63. package/dist/containers/Header/Host/Host.js +0 -66
  64. package/dist/containers/Header/Host/Host.scss +0 -50
  65. package/dist/containers/Pdisk/Pdisk.js +0 -156
  66. package/dist/containers/Pdisk/Pdisk.scss +0 -42
  67. package/dist/containers/Pool/Pool.js +0 -170
  68. package/dist/containers/Pool/Pool.scss +0 -35
  69. package/dist/containers/Vdisk/Vdisk.js +0 -158
  70. package/dist/containers/Vdisk/Vdisk.scss +0 -42
  71. package/dist/containers/VdiskPdiskNode/VdiskPdiskNode.js +0 -526
  72. package/dist/containers/VdiskPdiskNode/VdiskPdiskNode.scss +0 -60
  73. package/dist/store/reducers/group.js +0 -49
  74. package/dist/store/reducers/pdisk.js +0 -51
  75. package/dist/store/reducers/pool.js +0 -42
  76. package/dist/store/reducers/vdisk.js +0 -49
@@ -1,526 +0,0 @@
1
- import React from 'react';
2
- import PropTypes from 'prop-types';
3
- import cn from 'bem-cn-lite';
4
- import {connect} from 'react-redux';
5
- import _ from 'lodash';
6
-
7
- import {Link} from 'react-router-dom';
8
- import {Loader} from '@gravity-ui/uikit';
9
-
10
- import InfoViewer from '../../components/InfoViewer/InfoViewer';
11
- import EntityStatus from '../../components/EntityStatus/EntityStatus';
12
- import ProgressViewer from '../../components/ProgressViewer/ProgressViewer';
13
- import PoolsGraph from '../../components/PoolsGraph/PoolsGraph';
14
- import {AutoFetcher} from '../../utils/autofetcher';
15
-
16
- import {getVdiskInfo, clearStore as clearStoreVDisk} from '../../store/reducers/vdisk';
17
- import {getPdiskInfo, clearStore as clearStorePDisk} from '../../store/reducers/pdisk';
18
- import {hideTooltip, showTooltip} from '../../store/reducers/tooltip';
19
- import {getNodeInfo} from '../../store/reducers/node';
20
- import {calcUptime, stringifyVdiskId, formatStorageValuesToGb} from '../../utils';
21
- import routes, {createHref} from '../../routes';
22
- import {bytesToSpeed, bytesToGB} from '../../utils/utils';
23
- import {getDefaultNodePath} from '../Node/NodePages';
24
-
25
- import './VdiskPdiskNode.scss';
26
-
27
- const b = cn('vdisk-pdisk-node');
28
-
29
- function valueIsDefined(value) {
30
- return value !== null && value !== undefined;
31
- }
32
-
33
- export function Vdisk({
34
- AllocatedSize,
35
- DiskSpace,
36
- FrontQueues,
37
- Guid,
38
- Replicated,
39
- VDiskState,
40
- VDiskId,
41
- VDiskSlotId,
42
- Kind,
43
- SatisfactionRank,
44
- AvailableSize,
45
- HasUnreadableBlobs,
46
- IncarnationGuid,
47
- InstanceGuid,
48
- StoragePoolName,
49
- ReadThroughput,
50
- WriteThroughput,
51
- }) {
52
- const vdiskInfo = [];
53
-
54
- if (valueIsDefined(VDiskSlotId)) {
55
- vdiskInfo.push({label: 'VDisk Slot Id', value: VDiskSlotId});
56
- }
57
- if (valueIsDefined(Guid)) {
58
- vdiskInfo.push({label: 'GUID', value: Guid});
59
- }
60
- if (valueIsDefined(Kind)) {
61
- vdiskInfo.push({label: 'Kind', value: Kind});
62
- }
63
- if (valueIsDefined(VDiskState)) {
64
- vdiskInfo.push({
65
- label: 'VDisk State',
66
- value: VDiskState,
67
- });
68
- }
69
- if (valueIsDefined(DiskSpace)) {
70
- vdiskInfo.push({
71
- label: 'Disk Space',
72
- value: <EntityStatus status={DiskSpace} />,
73
- });
74
- }
75
- if (valueIsDefined(SatisfactionRank?.FreshRank.Flag)) {
76
- vdiskInfo.push({
77
- label: 'Fresh Rank Satisfaction',
78
- value: <EntityStatus status={SatisfactionRank.FreshRank.Flag} />,
79
- });
80
- }
81
- if (valueIsDefined(SatisfactionRank?.LevelRank.Flag)) {
82
- vdiskInfo.push({
83
- label: 'Level Rank Satisfaction',
84
- value: <EntityStatus status={SatisfactionRank.LevelRank.Flag} />,
85
- });
86
- }
87
- vdiskInfo.push({label: 'Replicated', value: Replicated ? 'Yes' : 'No'});
88
- vdiskInfo.push({label: 'Allocated Size', value: bytesToGB(AllocatedSize)});
89
- vdiskInfo.push({label: 'Available Size', value: bytesToGB(AvailableSize)});
90
- if (Number(AllocatedSize) >= 0 && Number(AvailableSize) >= 0) {
91
- vdiskInfo.push({
92
- label: 'Size',
93
- value: (
94
- <ProgressViewer
95
- value={AllocatedSize}
96
- capacity={Number(AllocatedSize) + Number(AvailableSize)}
97
- formatValues={formatStorageValuesToGb}
98
- colorizeProgress={true}
99
- className={b('size')}
100
- />
101
- ),
102
- });
103
- }
104
-
105
- vdiskInfo.push({
106
- label: 'Has Unreadable Blobs',
107
- value: HasUnreadableBlobs ? 'Yes' : 'No',
108
- });
109
- if (valueIsDefined(IncarnationGuid)) {
110
- vdiskInfo.push({label: 'Incarnation GUID', value: IncarnationGuid});
111
- }
112
- if (valueIsDefined(InstanceGuid)) {
113
- vdiskInfo.push({label: 'Instance GUID', value: InstanceGuid});
114
- }
115
- if (valueIsDefined(FrontQueues)) {
116
- vdiskInfo.push({
117
- label: 'Front Queues',
118
- value: <EntityStatus status={FrontQueues} />,
119
- });
120
- }
121
- if (valueIsDefined(StoragePoolName)) {
122
- vdiskInfo.push({label: 'Storage Pool Name', value: StoragePoolName});
123
- }
124
- vdiskInfo.push({
125
- label: 'Read Throughput',
126
- value: bytesToSpeed(ReadThroughput),
127
- });
128
- vdiskInfo.push({
129
- label: 'Write Throughput',
130
- value: bytesToSpeed(WriteThroughput),
131
- });
132
-
133
- return (
134
- <React.Fragment>
135
- <div className={b('row')}>
136
- <span className={b('title')}>VDisk </span>
137
- <EntityStatus
138
- status={VDiskState === 'OK' ? 'green' : 'red'}
139
- name={stringifyVdiskId(VDiskId)}
140
- />
141
- </div>
142
-
143
- <div className={b('column')}>
144
- <InfoViewer className={b('section')} info={vdiskInfo} />
145
- </div>
146
- </React.Fragment>
147
- );
148
- }
149
-
150
- class VdiskPdiskNode extends React.Component {
151
- // если не завести три функции, то отрисуется только один лоадер, а мне надо чтобы отрисовывался в каждой колонке
152
- renderLoader = () => {
153
- return (
154
- <div className={b('loader')}>
155
- <Loader size="l" />
156
- </div>
157
- );
158
- };
159
-
160
- static propTypes = {
161
- className: PropTypes.string,
162
- loading: PropTypes.bool,
163
- wasLoaded: PropTypes.bool,
164
- error: PropTypes.bool,
165
- getVdiskInfo: PropTypes.func,
166
- clearStore: PropTypes.func,
167
- vdisks: PropTypes.array,
168
- location: PropTypes.object,
169
- };
170
-
171
- static defaultProps = {
172
- className: '',
173
- };
174
-
175
- componentDidMount() {
176
- const params = new URLSearchParams(this.props.location.search);
177
- const nodeId = params.get('nodeId');
178
- const pdiskId = params.get('pdiskId');
179
- const vdiskId = params.get('vdiskId');
180
-
181
- this.props.getVdiskInfo({vdiskId, pdiskId, nodeId});
182
- this.vDiskAutofetcher = new AutoFetcher();
183
- this.vDiskAutofetcher.fetch(() => this.props.getVdiskInfo({vdiskId, pdiskId, nodeId}));
184
-
185
- if (nodeId && pdiskId) {
186
- this.props.getPdiskInfo(nodeId, pdiskId);
187
- this.pDiskAutofetcher = new AutoFetcher();
188
- this.pDiskAutofetcher.fetch(() => this.props.getPdiskInfo(nodeId, pdiskId));
189
- }
190
- if (nodeId) {
191
- this.props.getNodeInfo(nodeId);
192
- this.nodeAutofetcher = new AutoFetcher();
193
- this.nodeAutofetcher.fetch(() => this.props.getNodeInfo(nodeId));
194
- }
195
- }
196
-
197
- componentWillUnmount() {
198
- this.props.clearStoreVDisk();
199
- this.props.clearStorePDisk();
200
- this.vDiskAutofetcher.stop();
201
- this.pDiskAutofetcher.stop();
202
- this.nodeAutofetcher.stop();
203
- }
204
-
205
- renderVdisks = () => {
206
- return _.map(this.props.vdisks, (v) => {
207
- if (_.isEmpty(v)) {
208
- return <div>No information about VDisk</div>;
209
- }
210
- return <Vdisk {...v} />;
211
- });
212
- };
213
-
214
- renderPDisk = () => {
215
- if (_.isEmpty(this.props.pdisk)) {
216
- return <div>No information about PDisk</div>;
217
- }
218
- const {
219
- TotalSize,
220
- AvailableSize,
221
- Device,
222
- Guid,
223
- NodeId,
224
- PDiskId,
225
- Path,
226
- Realtime,
227
- State,
228
- Category,
229
- SerialNumber,
230
- } = this.props.pdisk;
231
-
232
- const pdiskInfo = [
233
- {
234
- label: 'PDisk Id',
235
- value: (
236
- <Link
237
- className={b('link')}
238
- to={createHref(routes.pdisk, {id: PDiskId}, {node_id: NodeId})}
239
- >
240
- {PDiskId}
241
- </Link>
242
- ),
243
- },
244
- ];
245
- if (valueIsDefined(Path)) {
246
- pdiskInfo.push({label: 'Path', value: Path});
247
- }
248
- if (valueIsDefined(Guid)) {
249
- pdiskInfo.push({label: 'GUID', value: Guid});
250
- }
251
- if (valueIsDefined(Category)) {
252
- pdiskInfo.push({label: 'Category', value: Category});
253
- }
254
- pdiskInfo.push({
255
- label: 'Allocated Size',
256
- value: bytesToGB(TotalSize - AvailableSize),
257
- });
258
- pdiskInfo.push({
259
- label: 'Available Size',
260
- value: bytesToGB(AvailableSize),
261
- });
262
- if (Number(TotalSize) >= 0 && Number(AvailableSize) >= 0) {
263
- pdiskInfo.push({
264
- label: 'Size',
265
- value: (
266
- <ProgressViewer
267
- value={TotalSize - AvailableSize}
268
- capacity={TotalSize}
269
- formatValues={formatStorageValuesToGb}
270
- colorizeProgress={true}
271
- className={b('size')}
272
- />
273
- ),
274
- });
275
- }
276
- if (valueIsDefined(State)) {
277
- pdiskInfo.push({label: 'State', value: State});
278
- }
279
- if (valueIsDefined(Device)) {
280
- pdiskInfo.push({
281
- label: 'Device',
282
- value: <EntityStatus status={Device} />,
283
- });
284
- }
285
- if (valueIsDefined(Realtime)) {
286
- pdiskInfo.push({
287
- label: 'Realtime',
288
- value: <EntityStatus status={Realtime} />,
289
- });
290
- }
291
- if (valueIsDefined(SerialNumber)) {
292
- pdiskInfo.push({label: 'SerialNumber', value: SerialNumber});
293
- }
294
-
295
- return (
296
- <React.Fragment>
297
- <div className={b('row')}>
298
- <span className={b('title')}>PDisk </span>
299
- <EntityStatus status={Device} name={`${NodeId}-${PDiskId}`} />
300
- </div>
301
-
302
- <div className={b('column')}>
303
- <InfoViewer className={b('section')} info={pdiskInfo} />
304
- </div>
305
- </React.Fragment>
306
- );
307
- };
308
-
309
- renderNode = () => {
310
- if (_.isEmpty(this.props.node)) {
311
- return <div>No information about Node</div>;
312
- }
313
- const {
314
- NodeId,
315
- SystemState,
316
- StartTime,
317
- Host,
318
- DataCenterDescription,
319
- DataCenter,
320
- Rack,
321
- Version,
322
- LoadAverage,
323
- NumberOfCpus,
324
- MemoryUsed,
325
- MemoryLimit,
326
- PoolStats,
327
- } = this.props.node;
328
-
329
- const nodeInfo = [
330
- {
331
- label: 'Node Id',
332
- value: (
333
- <Link className={b('link')} to={getDefaultNodePath(NodeId)}>
334
- {NodeId}
335
- </Link>
336
- ),
337
- },
338
- ];
339
-
340
- if (valueIsDefined(Host)) {
341
- nodeInfo.push({label: 'Host', value: Host});
342
- }
343
- if (valueIsDefined(PoolStats)) {
344
- nodeInfo.push({
345
- label: 'Pool stats',
346
- value: (
347
- <PoolsGraph
348
- onMouseEnter={this.props.showTooltip}
349
- onMouseLeave={this.props.hideTooltip}
350
- pools={PoolStats}
351
- />
352
- ),
353
- });
354
- }
355
- if (!_.isEmpty(LoadAverage) && valueIsDefined(NumberOfCpus)) {
356
- nodeInfo.push({
357
- label: 'Load Average',
358
- value: (
359
- <ProgressViewer
360
- value={
361
- (LoadAverage[0] * 100) / NumberOfCpus < 100
362
- ? (LoadAverage[0] * 100) / NumberOfCpus
363
- : 100
364
- }
365
- capacity={100}
366
- percents={true}
367
- colorizeProgress={true}
368
- className={b('size')}
369
- />
370
- ),
371
- });
372
- nodeInfo.push({
373
- label: 'Load Average',
374
- value: `${LoadAverage[0]} / ${NumberOfCpus} Cpus`,
375
- });
376
- }
377
- if (valueIsDefined(StartTime)) {
378
- nodeInfo.push({label: 'Uptime', value: calcUptime(StartTime)});
379
- }
380
- if (valueIsDefined(SystemState)) {
381
- nodeInfo.push({
382
- label: 'System State',
383
- value: <EntityStatus status={SystemState} />,
384
- });
385
- }
386
- if (valueIsDefined(DataCenter)) {
387
- nodeInfo.push({label: 'DataCenter', value: DataCenter.toUpperCase()});
388
- }
389
- if (valueIsDefined(DataCenterDescription)) {
390
- nodeInfo.push({
391
- label: 'DataCenter Description',
392
- value: DataCenterDescription,
393
- });
394
- }
395
- if (valueIsDefined(Rack)) {
396
- nodeInfo.push({label: 'Rack', value: Rack});
397
- }
398
- if (valueIsDefined(Version)) {
399
- nodeInfo.push({label: 'Version', value: Version});
400
- }
401
- if (valueIsDefined(MemoryUsed)) {
402
- nodeInfo.push({label: 'Memory used', value: bytesToGB(MemoryUsed)});
403
- }
404
- if (valueIsDefined(MemoryLimit)) {
405
- nodeInfo.push({label: 'Memory limit', value: bytesToGB(MemoryLimit)});
406
- }
407
- if (valueIsDefined(MemoryLimit) && valueIsDefined(MemoryUsed)) {
408
- nodeInfo.push({
409
- label: 'Memory used',
410
- value: (
411
- <ProgressViewer
412
- value={MemoryUsed || 0}
413
- capacity={MemoryLimit || 0}
414
- formatValues={formatStorageValuesToGb}
415
- colorizeProgress={true}
416
- className={b('size')}
417
- />
418
- ),
419
- });
420
- }
421
-
422
- return (
423
- <React.Fragment>
424
- <div className={b('row')}>
425
- <span className={b('title')}>Node </span>
426
- <EntityStatus status={SystemState} name={`${NodeId}-${Host}`} />
427
- </div>
428
-
429
- <div className={b('column')}>
430
- <InfoViewer className={b('section')} info={nodeInfo} />
431
- </div>
432
- </React.Fragment>
433
- );
434
- };
435
-
436
- render() {
437
- const {
438
- loadingVDisk,
439
- wasLoadedVDisk,
440
- errorVDisk,
441
- loadingPDisk,
442
- wasLoadedPDisk,
443
- errorPDisk,
444
- loadingNode,
445
- wasLoadedNode,
446
- errorNode,
447
- } = this.props;
448
-
449
- return (
450
- <div className={b()}>
451
- <div>
452
- {(loadingVDisk && !wasLoadedVDisk && this.renderLoader()) ||
453
- (errorVDisk && errorVDisk.statusText) ||
454
- this.renderVdisks()}
455
- </div>
456
- <div>
457
- {(loadingPDisk && !wasLoadedPDisk && this.renderLoader()) ||
458
- (errorPDisk && errorPDisk.statusText) ||
459
- this.renderPDisk()}
460
- </div>
461
- <div>
462
- {(loadingNode && !wasLoadedNode && this.renderLoader()) ||
463
- (errorNode && errorNode.statusText) ||
464
- this.renderNode()}
465
- </div>
466
- </div>
467
- );
468
- }
469
- }
470
-
471
- const mapStateToProps = (state) => {
472
- const {
473
- data: vdiskData,
474
- wasLoaded: wasLoadedVDisk,
475
- loading: loadingVDisk,
476
- error: errorVDisk,
477
- } = state.vdisk;
478
- const {
479
- data: pdiskData,
480
- wasLoaded: wasLoadedPDisk,
481
- loading: loadingPDisk,
482
- error: errorPDisk,
483
- } = state.pdisk;
484
- const {
485
- data: nodeData,
486
- wasLoaded: wasLoadedNode,
487
- loading: loadingNode,
488
- error: errorNode,
489
- } = state.node;
490
-
491
- let pdisk = {};
492
- let node = {};
493
- if (pdiskData && pdiskData.PDiskStateInfo) {
494
- pdisk = pdiskData.PDiskStateInfo[0];
495
- }
496
- if (nodeData && nodeData.SystemStateInfo) {
497
- node = nodeData.SystemStateInfo[0];
498
- }
499
-
500
- return {
501
- vdisks: vdiskData?.VDiskStateInfo,
502
- wasLoadedVDisk,
503
- loadingVDisk,
504
- errorVDisk,
505
- pdisk,
506
- wasLoadedPDisk,
507
- loadingPDisk,
508
- errorPDisk,
509
- node,
510
- wasLoadedNode,
511
- loadingNode,
512
- errorNode,
513
- };
514
- };
515
-
516
- const mapDispatchToProps = {
517
- getVdiskInfo,
518
- getPdiskInfo,
519
- getNodeInfo,
520
- clearStoreVDisk,
521
- clearStorePDisk,
522
- hideTooltip,
523
- showTooltip,
524
- };
525
-
526
- export default connect(mapStateToProps, mapDispatchToProps)(VdiskPdiskNode);
@@ -1,60 +0,0 @@
1
- @import '../../styles/mixins.scss';
2
-
3
- .vdisk-pdisk-node {
4
- display: grid;
5
- grid-gap: 20px;
6
-
7
- grid-template-columns: repeat(auto-fill, minmax(450px, 1fr));
8
-
9
- padding: 20px;
10
- @include container-fluid();
11
-
12
- .info-viewer__items {
13
- grid-template-columns: max-content;
14
- }
15
-
16
- &__row {
17
- display: flex;
18
- }
19
-
20
- &__column {
21
- display: flex;
22
- flex-direction: column;
23
-
24
- margin-bottom: 15px;
25
- }
26
-
27
- &__title {
28
- margin-right: 16px;
29
-
30
- font-size: var(--yc-text-body-2-font-size);
31
- font-weight: 500;
32
- line-height: var(--yc-text-body-2-line-height);
33
- text-transform: uppercase;
34
- }
35
-
36
- &__section {
37
- padding: 15px 0;
38
-
39
- .info-viewer__label {
40
- min-width: 205px;
41
- }
42
- }
43
-
44
- &__link {
45
- text-decoration: none;
46
-
47
- color: var(--yc-color-base-special);
48
- }
49
- &__loader {
50
- display: flex;
51
- justify-content: center;
52
- align-items: center;
53
-
54
- width: 100%;
55
- margin-top: 50px;
56
- }
57
- .info-viewer__row {
58
- align-items: flex-end;
59
- }
60
- }
@@ -1,49 +0,0 @@
1
- import {createRequestActionTypes, createApiRequest} from '../utils';
2
- import '../../services/api';
3
-
4
- const FETCH_GROUP = createRequestActionTypes('GROUP', 'FETCH_GROUP');
5
-
6
- const initialState = {loading: true, wasLoaded: false, data: undefined};
7
-
8
- const group = (state = initialState, action) => {
9
- switch (action.type) {
10
- case FETCH_GROUP.REQUEST: {
11
- return {
12
- ...state,
13
- loading: true,
14
- };
15
- }
16
- case FETCH_GROUP.SUCCESS: {
17
- return {
18
- ...state,
19
- data: action.data,
20
- loading: false,
21
- wasLoaded: true,
22
- error: undefined,
23
- };
24
- }
25
- case FETCH_GROUP.FAILURE: {
26
- return {
27
- ...state,
28
- error: action.error,
29
- loading: false,
30
- };
31
- }
32
- case 'CLEAR_STORE': {
33
- return initialState;
34
- }
35
- default:
36
- return state;
37
- }
38
- };
39
-
40
- export const clearStore = () => ({type: 'CLEAR_STORE'});
41
-
42
- export const getGroupInfo = (nodeId) => {
43
- return createApiRequest({
44
- request: window.api.getGroupInfo(nodeId),
45
- actions: FETCH_GROUP,
46
- });
47
- };
48
-
49
- export default group;
@@ -1,51 +0,0 @@
1
- import {createRequestActionTypes, createApiRequest} from '../utils';
2
- import '../../services/api';
3
-
4
- const FETCH_PDISK = createRequestActionTypes('PDISK', 'FETCH_PDISK');
5
-
6
- const initialState = {loading: true, wasLoaded: false, data: undefined};
7
-
8
- const pdisk = (state = initialState, action) => {
9
- switch (action.type) {
10
- case FETCH_PDISK.REQUEST: {
11
- return {
12
- ...state,
13
- loading: true,
14
- };
15
- }
16
- case FETCH_PDISK.SUCCESS: {
17
- return {
18
- ...state,
19
- data: action.data,
20
- loading: false,
21
- wasLoaded: true,
22
- error: undefined,
23
- };
24
- }
25
- case FETCH_PDISK.FAILURE: {
26
- return {
27
- ...state,
28
- error: action.error,
29
- loading: false,
30
- };
31
- }
32
-
33
- case 'CLEAR_STORE': {
34
- return initialState;
35
- }
36
-
37
- default:
38
- return state;
39
- }
40
- };
41
-
42
- export const clearStore = () => ({type: 'CLEAR_STORE'});
43
-
44
- export const getPdiskInfo = (nodeId, pdiskId) => {
45
- return createApiRequest({
46
- request: window.api.getPdiskInfo(nodeId, pdiskId),
47
- actions: FETCH_PDISK,
48
- });
49
- };
50
-
51
- export default pdisk;