ydb-embedded-ui 4.9.0 → 4.10.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.
- package/CHANGELOG.md +12 -0
- package/dist/components/BasicNodeViewer/BasicNodeViewer.tsx +7 -4
- package/dist/components/EntityStatus/EntityStatus.js +3 -1
- package/dist/components/FormattedBytes/FormattedBytes.tsx +10 -0
- package/dist/components/FormattedBytes/utils.tsx +13 -0
- package/dist/components/FullNodeViewer/FullNodeViewer.tsx +73 -0
- package/dist/components/InfoViewer/formatters/table.ts +6 -5
- package/dist/components/ProblemFilter/ProblemFilter.tsx +2 -2
- package/dist/components/SpeedMultiMeter/SpeedMultiMeter.tsx +4 -4
- package/dist/components/TruncatedQuery/{TruncatedQuery.js → TruncatedQuery.tsx} +10 -8
- package/dist/containers/AsideNavigation/AsideNavigation.tsx +6 -6
- package/dist/containers/Cluster/Cluster.tsx +10 -6
- package/dist/containers/Node/Node.tsx +3 -3
- package/dist/containers/Nodes/Nodes.tsx +2 -2
- package/dist/containers/Storage/PDisk/PDisk.tsx +2 -7
- package/dist/containers/Storage/Storage.tsx +240 -0
- package/dist/containers/Storage/StorageGroups/StorageGroups.tsx +45 -40
- package/dist/containers/Storage/StorageNodes/StorageNodes.tsx +12 -16
- package/dist/containers/Storage/UsageFilter/UsageFilter.scss +1 -0
- package/dist/containers/Storage/UsageFilter/UsageFilter.tsx +17 -17
- package/dist/containers/Tenant/Diagnostics/Diagnostics.tsx +3 -3
- package/dist/containers/Tenant/Diagnostics/TenantOverview/TenantOverview.js +7 -4
- package/dist/containers/Tenant/Diagnostics/TenantOverview/TenantOverview.scss +0 -15
- package/dist/containers/Tenant/Diagnostics/TopQueries/TopQueries.tsx +10 -3
- package/dist/containers/Tenant/{Preview → Query/Preview}/Preview.scss +1 -1
- package/dist/containers/Tenant/Query/Preview/Preview.tsx +121 -0
- package/dist/containers/Tenant/Query/QueriesHistory/QueriesHistory.tsx +1 -1
- package/dist/containers/Tenant/Query/QueryEditor/QueryEditor.js +6 -8
- package/dist/containers/Tenant/Query/SavedQueries/SavedQueries.tsx +1 -1
- package/dist/containers/Tenant/Query/i18n/en.json +8 -1
- package/dist/containers/Tenant/Query/i18n/ru.json +8 -1
- package/dist/containers/Tenants/Tenants.tsx +269 -0
- package/dist/services/api.ts +8 -3
- package/dist/store/reducers/nodes/nodes.ts +4 -4
- package/dist/store/reducers/partitions/types.ts +3 -3
- package/dist/store/reducers/settings/settings.ts +4 -2
- package/dist/store/reducers/settings/types.ts +3 -1
- package/dist/store/reducers/storage/selectors.ts +279 -0
- package/dist/store/reducers/storage/storage.ts +191 -0
- package/dist/store/reducers/storage/types.ts +80 -0
- package/dist/store/reducers/tenants/selectors.ts +46 -0
- package/dist/store/reducers/tenants/tenants.ts +21 -14
- package/dist/store/reducers/tenants/types.ts +20 -5
- package/dist/store/reducers/tenants/utils.ts +68 -0
- package/dist/types/additionalProps.ts +8 -0
- package/dist/types/api/storage.ts +1 -1
- package/dist/types/store/topic.ts +3 -3
- package/dist/utils/bytesParsers/__test__/formatBytes.test.ts +38 -0
- package/dist/utils/bytesParsers/convertBytesObjectToSpeed.ts +2 -2
- package/dist/utils/bytesParsers/formatBytes.ts +132 -0
- package/dist/utils/bytesParsers/i18n/en.json +1 -0
- package/dist/utils/bytesParsers/i18n/ru.json +1 -0
- package/dist/utils/bytesParsers/index.ts +1 -1
- package/dist/utils/index.js +5 -10
- package/dist/utils/numeral.ts +8 -0
- package/package.json +1 -1
- package/dist/components/FullNodeViewer/FullNodeViewer.js +0 -89
- package/dist/containers/Node/NodeOverview/NodeOverview.scss +0 -0
- package/dist/containers/Node/NodeOverview/NodeOverview.tsx +0 -21
- package/dist/containers/Storage/Storage.js +0 -350
- package/dist/containers/Tenant/Preview/Preview.js +0 -168
- package/dist/containers/Tenants/Tenants.js +0 -363
- package/dist/store/reducers/storage/storage.js +0 -404
- package/dist/utils/bytesParsers/formatBytesCustom.ts +0 -57
@@ -0,0 +1,68 @@
|
|
1
|
+
import type {TTenant} from '../../../types/api/tenant';
|
2
|
+
import {isNumeric} from '../../../utils/utils';
|
3
|
+
|
4
|
+
const getControlPlaneValue = (tenant: TTenant) => {
|
5
|
+
const parts = tenant.Name.split('/');
|
6
|
+
const defaultValue = parts.length ? parts[parts.length - 1] : '—';
|
7
|
+
const controlPlaneName = tenant.ControlPlane?.name;
|
8
|
+
|
9
|
+
return controlPlaneName ?? defaultValue;
|
10
|
+
};
|
11
|
+
|
12
|
+
const getTenantBackend = (tenant: TTenant) => {
|
13
|
+
const node = tenant.Nodes ? tenant.Nodes[0] : {};
|
14
|
+
const address =
|
15
|
+
node.Host && node.Endpoints
|
16
|
+
? node.Endpoints.find((endpoint) => endpoint.Name === 'http-mon')?.Address
|
17
|
+
: undefined;
|
18
|
+
return node.Host ? `${node.Host}${address ? address : ''}` : undefined;
|
19
|
+
};
|
20
|
+
|
21
|
+
const calculateTenantMetrics = (tenant: TTenant) => {
|
22
|
+
const {CoresUsed, MemoryUsed, StorageAllocatedSize, Metrics = {}} = tenant;
|
23
|
+
|
24
|
+
const cpuFromCores = isNumeric(CoresUsed) ? Number(CoresUsed) * 1_000_000 : undefined;
|
25
|
+
const cpuFromMetrics = isNumeric(Metrics.CPU) ? Number(Metrics.CPU) : undefined;
|
26
|
+
|
27
|
+
const cpu = cpuFromCores ?? cpuFromMetrics ?? 0;
|
28
|
+
|
29
|
+
const rawMemory = MemoryUsed ?? Metrics.Memory;
|
30
|
+
const rawStorage = StorageAllocatedSize ?? Metrics.Storage;
|
31
|
+
|
32
|
+
const memory = isNumeric(rawMemory) ? Number(rawMemory) : 0;
|
33
|
+
const storage = isNumeric(rawStorage) ? Number(rawStorage) : 0;
|
34
|
+
|
35
|
+
return {cpu, memory, storage};
|
36
|
+
};
|
37
|
+
|
38
|
+
const calculateTenantEntities = (tenant: TTenant) => {
|
39
|
+
const {StorageGroups, NodeIds} = tenant;
|
40
|
+
|
41
|
+
const nodesCount = NodeIds?.length ?? 0;
|
42
|
+
const groupsCount = isNumeric(StorageGroups) ? Number(StorageGroups) : 0;
|
43
|
+
|
44
|
+
return {nodesCount, groupsCount};
|
45
|
+
};
|
46
|
+
|
47
|
+
export const prepareTenants = (tenants: TTenant[], useNodeAsBackend: boolean) => {
|
48
|
+
return tenants.map((tenant) => {
|
49
|
+
const backend = useNodeAsBackend ? getTenantBackend(tenant) : undefined;
|
50
|
+
const sharedTenantName = tenants.find((item) => item.Id === tenant.ResourceId)?.Name;
|
51
|
+
const controlPlaneName = getControlPlaneValue(tenant);
|
52
|
+
const {cpu, memory, storage} = calculateTenantMetrics(tenant);
|
53
|
+
const {nodesCount, groupsCount} = calculateTenantEntities(tenant);
|
54
|
+
|
55
|
+
return {
|
56
|
+
...tenant,
|
57
|
+
|
58
|
+
backend,
|
59
|
+
sharedTenantName,
|
60
|
+
controlPlaneName,
|
61
|
+
cpu,
|
62
|
+
memory,
|
63
|
+
storage,
|
64
|
+
nodesCount,
|
65
|
+
groupsCount,
|
66
|
+
};
|
67
|
+
});
|
68
|
+
};
|
@@ -1,4 +1,7 @@
|
|
1
|
+
import type {ReactNode} from 'react';
|
2
|
+
|
1
3
|
import type {InfoViewerItem} from '../components/InfoViewer';
|
4
|
+
import type {ETenantType} from './api/tenant';
|
2
5
|
import type {VersionToColorMap} from './versions';
|
3
6
|
|
4
7
|
export interface AdditionalVersionsProps {
|
@@ -14,3 +17,8 @@ export interface AdditionalClusterProps {
|
|
14
17
|
info?: InfoViewerItem[];
|
15
18
|
links?: ClusterLink[];
|
16
19
|
}
|
20
|
+
|
21
|
+
export interface AdditionalTenantsProps {
|
22
|
+
prepareTenantBackend?: (backend: string | undefined) => string | undefined;
|
23
|
+
getMonitoringLink?: (name: string, type: ETenantType) => ReactNode;
|
24
|
+
}
|
@@ -1,12 +1,12 @@
|
|
1
1
|
import {FETCH_TOPIC, cleanTopicData, setDataWasNotLoaded} from '../../store/reducers/topic';
|
2
2
|
import type {ApiRequestAction} from '../../store/utils';
|
3
|
-
import type {
|
3
|
+
import type {ProcessSpeedStats} from '../../utils/bytesParsers';
|
4
4
|
import type {IResponseError} from '../api/error';
|
5
5
|
import type {DescribeTopicResult} from '../api/topic';
|
6
6
|
|
7
7
|
export interface IPreparedConsumerData {
|
8
8
|
name: string | undefined;
|
9
|
-
readSpeed:
|
9
|
+
readSpeed: ProcessSpeedStats;
|
10
10
|
|
11
11
|
writeLag: number;
|
12
12
|
readLag: number;
|
@@ -19,7 +19,7 @@ export interface IPreparedTopicStats {
|
|
19
19
|
partitionsWriteLag: number;
|
20
20
|
partitionsIdleTime: number;
|
21
21
|
|
22
|
-
writeSpeed:
|
22
|
+
writeSpeed: ProcessSpeedStats;
|
23
23
|
}
|
24
24
|
|
25
25
|
export interface ITopicState {
|
@@ -0,0 +1,38 @@
|
|
1
|
+
import {formatBytes} from '../formatBytes';
|
2
|
+
|
3
|
+
describe('formatBytes', () => {
|
4
|
+
it('should work with only value', () => {
|
5
|
+
expect(formatBytes({value: 100})).toBe('100 B');
|
6
|
+
expect(formatBytes({value: 100_000})).toBe('100 KB');
|
7
|
+
expect(formatBytes({value: 100_000_000})).toBe('100 MB');
|
8
|
+
expect(formatBytes({value: 100_000_000_000})).toBe('100 GB');
|
9
|
+
expect(formatBytes({value: 100_000_000_000_000})).toBe('100 TB');
|
10
|
+
});
|
11
|
+
it('should convert to size', () => {
|
12
|
+
expect(formatBytes({value: 100_000, size: 'b'})).toBe('100,000 B');
|
13
|
+
expect(formatBytes({value: 100_000_000_000_000, size: 'gb'})).toBe('100,000 GB');
|
14
|
+
});
|
15
|
+
it('should convert without labels', () => {
|
16
|
+
expect(formatBytes({value: 100_000, size: 'b', withSizeLabel: false})).toBe('100,000');
|
17
|
+
expect(formatBytes({value: 100_000_000_000_000, size: 'gb', withSizeLabel: false})).toBe(
|
18
|
+
'100,000',
|
19
|
+
);
|
20
|
+
});
|
21
|
+
it('should convert to speed', () => {
|
22
|
+
expect(formatBytes({value: 100_000, withSpeedLabel: true})).toBe('100 KB/s');
|
23
|
+
expect(formatBytes({value: 100_000, size: 'b', withSpeedLabel: true})).toBe('100,000 B/s');
|
24
|
+
});
|
25
|
+
it('should return fixed amount of significant digits', () => {
|
26
|
+
expect(formatBytes({value: 99_000, significantDigits: 2})).toEqual('99,000 B');
|
27
|
+
expect(formatBytes({value: 100_000, significantDigits: 2})).toEqual('100 KB');
|
28
|
+
expect(formatBytes({value: 99_000_000_000_000, significantDigits: 2})).toEqual('99,000 GB');
|
29
|
+
expect(formatBytes({value: 100_000_000_000_000, significantDigits: 2})).toEqual('100 TB');
|
30
|
+
});
|
31
|
+
it('shoudl return empty string on invalid data', () => {
|
32
|
+
expect(formatBytes({value: undefined})).toEqual('');
|
33
|
+
expect(formatBytes({value: null})).toEqual('');
|
34
|
+
expect(formatBytes({value: ''})).toEqual('');
|
35
|
+
expect(formatBytes({value: 'false'})).toEqual('');
|
36
|
+
expect(formatBytes({value: '123qwe'})).toEqual('');
|
37
|
+
});
|
38
|
+
});
|
@@ -2,7 +2,7 @@ import type {MultipleWindowsStat} from '../../types/api/consumer';
|
|
2
2
|
|
3
3
|
import {DAY_IN_SECONDS, HOUR_IN_SECONDS, MINUTE_IN_SECONDS} from '../constants';
|
4
4
|
|
5
|
-
export interface
|
5
|
+
export interface ProcessSpeedStats {
|
6
6
|
perMinute: number;
|
7
7
|
perHour: number;
|
8
8
|
perDay: number;
|
@@ -14,7 +14,7 @@ export interface IProcessSpeedStats {
|
|
14
14
|
*/
|
15
15
|
export const convertBytesObjectToSpeed = (
|
16
16
|
data: MultipleWindowsStat | undefined,
|
17
|
-
):
|
17
|
+
): ProcessSpeedStats => {
|
18
18
|
return {
|
19
19
|
perMinute:
|
20
20
|
data && data.per_minute ? Math.round(Number(data.per_minute) / MINUTE_IN_SECONDS) : 0,
|
@@ -0,0 +1,132 @@
|
|
1
|
+
import {formatNumber} from '..';
|
2
|
+
import {GIGABYTE, KILOBYTE, MEGABYTE, TERABYTE} from '../constants';
|
3
|
+
import {isNumeric} from '../utils';
|
4
|
+
|
5
|
+
import i18n from './i18n';
|
6
|
+
|
7
|
+
const sizes = {
|
8
|
+
b: {
|
9
|
+
value: 1,
|
10
|
+
label: i18n('b'),
|
11
|
+
},
|
12
|
+
kb: {
|
13
|
+
value: KILOBYTE,
|
14
|
+
label: i18n('kb'),
|
15
|
+
},
|
16
|
+
mb: {
|
17
|
+
value: MEGABYTE,
|
18
|
+
label: i18n('mb'),
|
19
|
+
},
|
20
|
+
gb: {
|
21
|
+
value: GIGABYTE,
|
22
|
+
label: i18n('gb'),
|
23
|
+
},
|
24
|
+
tb: {
|
25
|
+
value: TERABYTE,
|
26
|
+
label: i18n('tb'),
|
27
|
+
},
|
28
|
+
};
|
29
|
+
|
30
|
+
export type BytesSizes = keyof typeof sizes;
|
31
|
+
|
32
|
+
/**
|
33
|
+
* This function is needed to keep more than 3 digits of the same size.
|
34
|
+
*
|
35
|
+
* @param significantDigits - number of digits above 3
|
36
|
+
* @returns size to format value to get required number of digits
|
37
|
+
*
|
38
|
+
* By default value converted to the next size when it's above 1000,
|
39
|
+
* so we have 900mb and 1gb. To extend it additional significantDigits could be set
|
40
|
+
*
|
41
|
+
* significantDigits value added above default 3
|
42
|
+
*
|
43
|
+
* significantDigits = 1 - 9 000 mb and 10 gb
|
44
|
+
*
|
45
|
+
* significantDigits = 2 - 90 000 mb and 100 gb
|
46
|
+
*
|
47
|
+
* significantDigits = 3 - 900 000 mb and 1000 gb
|
48
|
+
*/
|
49
|
+
const getSizeWithSignificantDigits = (value: number, significantDigits: number) => {
|
50
|
+
const multiplier = 10 ** significantDigits;
|
51
|
+
|
52
|
+
const tbLevel = sizes.tb.value * multiplier;
|
53
|
+
const gbLevel = sizes.gb.value * multiplier;
|
54
|
+
const mbLevel = sizes.mb.value * multiplier;
|
55
|
+
const kbLevel = sizes.kb.value * multiplier;
|
56
|
+
|
57
|
+
let size: BytesSizes = 'b';
|
58
|
+
|
59
|
+
if (value >= kbLevel) {
|
60
|
+
size = 'kb';
|
61
|
+
}
|
62
|
+
if (value >= mbLevel) {
|
63
|
+
size = 'mb';
|
64
|
+
}
|
65
|
+
if (value >= gbLevel) {
|
66
|
+
size = 'gb';
|
67
|
+
}
|
68
|
+
if (value >= tbLevel) {
|
69
|
+
size = 'tb';
|
70
|
+
}
|
71
|
+
|
72
|
+
return size;
|
73
|
+
};
|
74
|
+
|
75
|
+
interface FormatToSizeArgs {
|
76
|
+
value: number;
|
77
|
+
size?: BytesSizes;
|
78
|
+
precision?: number;
|
79
|
+
}
|
80
|
+
|
81
|
+
const formatToSize = ({value, size = 'mb', precision = 0}: FormatToSizeArgs) => {
|
82
|
+
const result = (Number(value) / sizes[size].value).toFixed(precision);
|
83
|
+
|
84
|
+
return formatNumber(result);
|
85
|
+
};
|
86
|
+
|
87
|
+
const addSizeLabel = (result: string, size: BytesSizes) => {
|
88
|
+
return result + ` ${sizes[size].label}`;
|
89
|
+
};
|
90
|
+
|
91
|
+
const addSpeedLabel = (result: string, size: BytesSizes) => {
|
92
|
+
return addSizeLabel(result, size) + i18n('perSecond');
|
93
|
+
};
|
94
|
+
|
95
|
+
export type FormatBytesArgs = Omit<FormatToSizeArgs, 'value'> & {
|
96
|
+
value: number | string | undefined | null;
|
97
|
+
withSpeedLabel?: boolean;
|
98
|
+
withSizeLabel?: boolean;
|
99
|
+
significantDigits?: number;
|
100
|
+
};
|
101
|
+
|
102
|
+
/**
|
103
|
+
* @param significantDigits - number of digits above 3
|
104
|
+
*/
|
105
|
+
export const formatBytes = ({
|
106
|
+
value,
|
107
|
+
size,
|
108
|
+
withSpeedLabel = false,
|
109
|
+
withSizeLabel = true,
|
110
|
+
significantDigits = 0,
|
111
|
+
...params
|
112
|
+
}: FormatBytesArgs) => {
|
113
|
+
if (!isNumeric(value)) {
|
114
|
+
return '';
|
115
|
+
}
|
116
|
+
|
117
|
+
const numValue = Number(value);
|
118
|
+
|
119
|
+
const sizeToConvert = size ?? getSizeWithSignificantDigits(numValue, significantDigits);
|
120
|
+
|
121
|
+
const result = formatToSize({value: numValue, size: sizeToConvert, ...params});
|
122
|
+
|
123
|
+
if (withSpeedLabel) {
|
124
|
+
return addSpeedLabel(result, sizeToConvert);
|
125
|
+
}
|
126
|
+
|
127
|
+
if (withSizeLabel) {
|
128
|
+
return addSizeLabel(result, sizeToConvert);
|
129
|
+
}
|
130
|
+
|
131
|
+
return result;
|
132
|
+
};
|
@@ -1,2 +1,2 @@
|
|
1
|
-
export * from './
|
1
|
+
export * from './formatBytes';
|
2
2
|
export * from './convertBytesObjectToSpeed';
|
package/dist/utils/index.js
CHANGED
@@ -1,13 +1,8 @@
|
|
1
|
-
import numeral from 'numeral';
|
2
|
-
import locales from 'numeral/locales'; // eslint-disable-line no-unused-vars
|
3
|
-
|
4
1
|
import {dateTimeParse} from '@gravity-ui/date-utils';
|
5
2
|
|
6
|
-
import {i18n} from './i18n';
|
7
3
|
import {MEGABYTE, TERABYTE, GIGABYTE, DAY_IN_SECONDS} from './constants';
|
8
4
|
import {isNumeric} from './utils';
|
9
|
-
|
10
|
-
numeral.locale(i18n.lang);
|
5
|
+
import {configuredNumeral} from './numeral';
|
11
6
|
|
12
7
|
// Here you can't control displayed size and precision
|
13
8
|
// If you need more custom format, use formatBytesCustom instead
|
@@ -17,7 +12,7 @@ export const formatBytes = (bytes) => {
|
|
17
12
|
}
|
18
13
|
|
19
14
|
// by agreement, display byte values in decimal scale
|
20
|
-
return
|
15
|
+
return configuredNumeral(bytes).format('0 b');
|
21
16
|
};
|
22
17
|
|
23
18
|
export const formatBps = (bytes) => {
|
@@ -45,7 +40,7 @@ export const formatUptime = (seconds) => {
|
|
45
40
|
const days = Math.floor(seconds / DAY_IN_SECONDS);
|
46
41
|
const remain = seconds % DAY_IN_SECONDS;
|
47
42
|
|
48
|
-
const uptime = [days && `${days}d`,
|
43
|
+
const uptime = [days && `${days}d`, configuredNumeral(remain).format('00:00:00')]
|
49
44
|
.filter(Boolean)
|
50
45
|
.join(' ');
|
51
46
|
|
@@ -76,7 +71,7 @@ export const formatNumber = (number) => {
|
|
76
71
|
return '';
|
77
72
|
}
|
78
73
|
|
79
|
-
return
|
74
|
+
return configuredNumeral(number).format();
|
80
75
|
};
|
81
76
|
|
82
77
|
export const formatCPU = (value) => {
|
@@ -84,7 +79,7 @@ export const formatCPU = (value) => {
|
|
84
79
|
return '';
|
85
80
|
}
|
86
81
|
|
87
|
-
return
|
82
|
+
return configuredNumeral(value / 1000000).format('0.00');
|
88
83
|
};
|
89
84
|
|
90
85
|
export const formatDateTime = (value) => {
|
package/package.json
CHANGED
@@ -1,89 +0,0 @@
|
|
1
|
-
import React from 'react';
|
2
|
-
import cn from 'bem-cn-lite';
|
3
|
-
import PropTypes from 'prop-types';
|
4
|
-
|
5
|
-
import InfoViewer from '../InfoViewer/InfoViewer';
|
6
|
-
import ProgressViewer from '../ProgressViewer/ProgressViewer';
|
7
|
-
import {PoolUsage} from '../PoolUsage/PoolUsage';
|
8
|
-
|
9
|
-
import {LOAD_AVERAGE_TIME_INTERVALS} from '../../utils/constants';
|
10
|
-
import {calcUptime} from '../../utils';
|
11
|
-
|
12
|
-
import './FullNodeViewer.scss';
|
13
|
-
|
14
|
-
const b = cn('full-node-viewer');
|
15
|
-
|
16
|
-
class FullNodeViewer extends React.Component {
|
17
|
-
static propTypes = {
|
18
|
-
className: PropTypes.string,
|
19
|
-
node: PropTypes.object.isRequired,
|
20
|
-
backend: PropTypes.string,
|
21
|
-
singleClusterMode: PropTypes.bool,
|
22
|
-
};
|
23
|
-
|
24
|
-
static defaultProps = {
|
25
|
-
className: '',
|
26
|
-
};
|
27
|
-
|
28
|
-
render() {
|
29
|
-
const {node, className} = this.props;
|
30
|
-
|
31
|
-
const endpointsInfo = node.Endpoints?.map(({Name, Address}) => ({
|
32
|
-
label: Name,
|
33
|
-
value: Address,
|
34
|
-
}));
|
35
|
-
|
36
|
-
const commonInfo = [
|
37
|
-
{label: 'Version', value: node.Version},
|
38
|
-
{label: 'Uptime', value: calcUptime(node.StartTime)},
|
39
|
-
{label: 'DC', value: node.DataCenterDescription},
|
40
|
-
{label: 'Rack', value: node.Rack},
|
41
|
-
];
|
42
|
-
|
43
|
-
const averageInfo = node.LoadAverage.map((load, loadIndex) => ({
|
44
|
-
label: LOAD_AVERAGE_TIME_INTERVALS[`${loadIndex}`],
|
45
|
-
value: <ProgressViewer value={load} percents={true} colorizeProgress={true} />,
|
46
|
-
}));
|
47
|
-
|
48
|
-
return (
|
49
|
-
<div className={`${b()} ${className}`}>
|
50
|
-
{node ? (
|
51
|
-
<div className={b('common-info')}>
|
52
|
-
<div>
|
53
|
-
<div className={b('section-title')}>Pools</div>
|
54
|
-
<div className={b('section', {pools: true})}>
|
55
|
-
{node.PoolStats.map((pool, poolIndex) => (
|
56
|
-
<PoolUsage key={poolIndex} data={pool} />
|
57
|
-
))}
|
58
|
-
</div>
|
59
|
-
</div>
|
60
|
-
|
61
|
-
{endpointsInfo && endpointsInfo.length && (
|
62
|
-
<InfoViewer
|
63
|
-
title="Endpoints"
|
64
|
-
className={b('section')}
|
65
|
-
info={endpointsInfo}
|
66
|
-
/>
|
67
|
-
)}
|
68
|
-
|
69
|
-
<InfoViewer
|
70
|
-
title="Common info"
|
71
|
-
className={b('section')}
|
72
|
-
info={commonInfo}
|
73
|
-
/>
|
74
|
-
|
75
|
-
<InfoViewer
|
76
|
-
title="Load average"
|
77
|
-
className={b('section', {average: true})}
|
78
|
-
info={averageInfo}
|
79
|
-
/>
|
80
|
-
</div>
|
81
|
-
) : (
|
82
|
-
<div className="error">no data</div>
|
83
|
-
)}
|
84
|
-
</div>
|
85
|
-
);
|
86
|
-
}
|
87
|
-
}
|
88
|
-
|
89
|
-
export default FullNodeViewer;
|
File without changes
|
@@ -1,21 +0,0 @@
|
|
1
|
-
|
2
|
-
//@ts-ignore
|
3
|
-
import FullNodeViewer from '../../../components/FullNodeViewer/FullNodeViewer';
|
4
|
-
import {backend} from '../../../store';
|
5
|
-
|
6
|
-
interface NodeOverviewProps {
|
7
|
-
node: any;
|
8
|
-
className?: string;
|
9
|
-
}
|
10
|
-
|
11
|
-
function NodeOverview({node, className}: NodeOverviewProps) {
|
12
|
-
return (
|
13
|
-
<FullNodeViewer
|
14
|
-
node={node}
|
15
|
-
backend={backend}
|
16
|
-
className={className}
|
17
|
-
/>
|
18
|
-
);
|
19
|
-
}
|
20
|
-
|
21
|
-
export default NodeOverview;
|