ydb-embedded-ui 1.0.3 → 1.1.1
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 +39 -0
- package/dist/assets/icons/question.svg +1 -0
- package/dist/components/AsideNavigation/AsideHeader.tsx +2 -1
- package/dist/components/ClusterInfo/ClusterInfo.tsx +8 -4
- package/dist/components/FullNodeViewer/FullNodeViewer.scss +4 -9
- package/dist/components/InfoViewer/InfoViewer.scss +3 -2
- package/dist/components/InternalLink/InternalLink.js +8 -0
- package/dist/components/Loader/Loader.scss +5 -0
- package/dist/components/Loader/Loader.tsx +16 -0
- package/dist/components/PDiskViewer/PDiskViewer.js +3 -4
- package/dist/containers/App/App.scss +4 -0
- package/dist/containers/App/Content.js +0 -2
- package/dist/containers/AppIcons/AppIcons.js +4 -0
- package/dist/containers/Authentication/Authentication.tsx +2 -2
- package/dist/containers/Cluster/Cluster.tsx +1 -1
- package/dist/containers/Header/Header.tsx +6 -1
- package/dist/containers/Heatmap/Heatmap.js +0 -1
- package/dist/containers/Node/Node.scss +12 -1
- package/dist/containers/Node/Node.tsx +174 -0
- package/dist/containers/Node/NodeOverview/NodeOverview.scss +0 -0
- package/dist/containers/Node/NodeOverview/NodeOverview.tsx +23 -0
- package/dist/containers/Node/NodePages.js +16 -0
- package/dist/containers/Node/NodeStructure/NodeStructure.scss +151 -0
- package/dist/containers/Node/NodeStructure/NodeStructure.tsx +155 -0
- package/dist/containers/Node/NodeStructure/Pdisk.tsx +299 -0
- package/dist/containers/Node/NodeStructure/Vdisk.tsx +153 -0
- package/dist/containers/Pdisk/Pdisk.js +2 -5
- package/dist/containers/Storage/DiskStateProgressBar/DiskStateProgressBar.scss +10 -3
- package/dist/containers/Storage/DiskStateProgressBar/DiskStateProgressBar.tsx +20 -15
- package/dist/containers/Storage/Pdisk/Pdisk.scss +1 -0
- package/dist/containers/Storage/Pdisk/Pdisk.tsx +7 -5
- package/dist/containers/Storage/Storage.js +12 -9
- package/dist/containers/Storage/StorageGroups/StorageGroups.scss +2 -1
- package/dist/containers/Storage/StorageGroups/StorageGroups.tsx +2 -2
- package/dist/containers/Storage/StorageNodes/StorageNodes.scss +3 -2
- package/dist/containers/Storage/StorageNodes/StorageNodes.tsx +2 -2
- package/dist/containers/Storage/Vdisk/Vdisk.js +7 -6
- package/dist/containers/Storage/Vdisk/Vdisk.scss +1 -0
- package/dist/containers/Tablet/Tablet.js +2 -7
- package/dist/containers/Tablets/Tablets.js +4 -12
- package/dist/containers/Tenant/Acl/Acl.js +0 -3
- package/dist/containers/Tenant/Diagnostics/Compute/Compute.js +1 -3
- package/dist/containers/Tenant/Diagnostics/Network/Network.js +3 -6
- package/dist/containers/Tenant/ObjectSummary/ObjectSummary.scss +1 -0
- package/dist/containers/Tenant/ObjectSummary/ObjectSummary.tsx +1 -1
- package/dist/containers/Tenant/QueryEditor/QueryEditor.js +24 -24
- package/dist/containers/Tenant/QueryEditor/QueryEditor.scss +4 -0
- package/dist/containers/Tenant/QueryEditor/QueryExplain/QueryExplain.js +4 -1
- package/dist/containers/Tenant/QueryEditor/QueryResult/QueryResult.scss +1 -0
- package/dist/containers/Vdisk/Vdisk.js +2 -4
- package/dist/containers/VdiskPdiskNode/VdiskPdiskNode.js +4 -6
- package/dist/services/api.js +0 -1
- package/dist/store/reducers/executeQuery.js +1 -1
- package/dist/store/reducers/header.ts +1 -1
- package/dist/store/reducers/node.js +98 -3
- package/dist/store/reducers/nodes.js +0 -3
- package/dist/store/reducers/storage.js +8 -2
- package/dist/store/reducers/tablets.js +0 -3
- package/dist/utils/constants.js +0 -6
- package/dist/utils/getNodesColumns.js +2 -9
- package/dist/utils/utils.js +10 -1
- package/package.json +49 -34
- package/dist/containers/Node/Node.js +0 -184
@@ -0,0 +1,153 @@
|
|
1
|
+
import React from 'react';
|
2
|
+
import cn from 'bem-cn-lite';
|
3
|
+
|
4
|
+
import ProgressViewer from '../../../components/ProgressViewer/ProgressViewer';
|
5
|
+
import {formatStorageValuesToGb, stringifyVdiskId} from '../../../utils';
|
6
|
+
import {bytesToGB, bytesToSpeed} from '../../../utils/utils';
|
7
|
+
import EntityStatus from '../../../components/EntityStatus/EntityStatus';
|
8
|
+
import {valueIsDefined} from './NodeStructure';
|
9
|
+
import InfoViewer from '../../../components/InfoViewer/InfoViewer';
|
10
|
+
|
11
|
+
const b = cn('kv-node-structure');
|
12
|
+
|
13
|
+
interface VdiskProps {
|
14
|
+
AllocatedSize?: string;
|
15
|
+
DiskSpace?: string;
|
16
|
+
FrontQueues?: string;
|
17
|
+
Guid?: string;
|
18
|
+
Replicated?: boolean;
|
19
|
+
VDiskState?: string;
|
20
|
+
VDiskId?: {
|
21
|
+
GroupId: number;
|
22
|
+
GroupGeneration: number;
|
23
|
+
Ring: number;
|
24
|
+
Domain: number;
|
25
|
+
VDisk: number;
|
26
|
+
};
|
27
|
+
VDiskSlotId?: number;
|
28
|
+
Kind?: string;
|
29
|
+
SatisfactionRank?: {FreshRank: {Flag: string}; LevelRank: {Flag: string}};
|
30
|
+
AvailableSize?: string;
|
31
|
+
HasUnreadableBlobs?: boolean;
|
32
|
+
IncarnationGuid?: string;
|
33
|
+
InstanceGuid?: string;
|
34
|
+
StoragePoolName?: string;
|
35
|
+
ReadThroughput?: string;
|
36
|
+
WriteThroughput?: string;
|
37
|
+
}
|
38
|
+
|
39
|
+
export function Vdisk({
|
40
|
+
AllocatedSize,
|
41
|
+
DiskSpace,
|
42
|
+
FrontQueues,
|
43
|
+
Guid,
|
44
|
+
Replicated,
|
45
|
+
VDiskState,
|
46
|
+
VDiskId,
|
47
|
+
VDiskSlotId,
|
48
|
+
Kind,
|
49
|
+
SatisfactionRank,
|
50
|
+
AvailableSize,
|
51
|
+
HasUnreadableBlobs,
|
52
|
+
IncarnationGuid,
|
53
|
+
InstanceGuid,
|
54
|
+
StoragePoolName,
|
55
|
+
ReadThroughput,
|
56
|
+
WriteThroughput,
|
57
|
+
}: VdiskProps) {
|
58
|
+
const vdiskInfo = [];
|
59
|
+
|
60
|
+
if (valueIsDefined(VDiskSlotId)) {
|
61
|
+
vdiskInfo.push({label: 'VDisk Slot Id', value: VDiskSlotId});
|
62
|
+
}
|
63
|
+
if (valueIsDefined(Guid)) {
|
64
|
+
vdiskInfo.push({label: 'GUID', value: Guid});
|
65
|
+
}
|
66
|
+
if (valueIsDefined(Kind)) {
|
67
|
+
vdiskInfo.push({label: 'Kind', value: Kind});
|
68
|
+
}
|
69
|
+
if (valueIsDefined(VDiskState)) {
|
70
|
+
vdiskInfo.push({
|
71
|
+
label: 'VDisk State',
|
72
|
+
value: VDiskState,
|
73
|
+
});
|
74
|
+
}
|
75
|
+
if (valueIsDefined(DiskSpace)) {
|
76
|
+
vdiskInfo.push({
|
77
|
+
label: 'Disk Space',
|
78
|
+
value: <EntityStatus status={DiskSpace} />,
|
79
|
+
});
|
80
|
+
}
|
81
|
+
if (valueIsDefined(SatisfactionRank?.FreshRank.Flag)) {
|
82
|
+
vdiskInfo.push({
|
83
|
+
label: 'Fresh Rank Satisfaction',
|
84
|
+
value: <EntityStatus status={SatisfactionRank?.FreshRank.Flag} />,
|
85
|
+
});
|
86
|
+
}
|
87
|
+
if (valueIsDefined(SatisfactionRank?.LevelRank.Flag)) {
|
88
|
+
vdiskInfo.push({
|
89
|
+
label: 'Level Rank Satisfaction',
|
90
|
+
value: <EntityStatus status={SatisfactionRank?.LevelRank.Flag} />,
|
91
|
+
});
|
92
|
+
}
|
93
|
+
vdiskInfo.push({label: 'Replicated', value: Replicated ? 'Yes' : 'No'});
|
94
|
+
vdiskInfo.push({label: 'Allocated Size', value: bytesToGB(AllocatedSize)});
|
95
|
+
vdiskInfo.push({label: 'Available Size', value: bytesToGB(AvailableSize)});
|
96
|
+
if (Number(AllocatedSize) >= 0 && Number(AvailableSize) >= 0) {
|
97
|
+
vdiskInfo.push({
|
98
|
+
label: 'Size',
|
99
|
+
value: (
|
100
|
+
<ProgressViewer
|
101
|
+
value={AllocatedSize}
|
102
|
+
capacity={Number(AllocatedSize) + Number(AvailableSize)}
|
103
|
+
formatValues={formatStorageValuesToGb}
|
104
|
+
colorizeProgress={true}
|
105
|
+
/>
|
106
|
+
),
|
107
|
+
});
|
108
|
+
}
|
109
|
+
|
110
|
+
vdiskInfo.push({
|
111
|
+
label: 'Has Unreadable Blobs',
|
112
|
+
value: HasUnreadableBlobs ? 'Yes' : 'No',
|
113
|
+
});
|
114
|
+
if (valueIsDefined(IncarnationGuid)) {
|
115
|
+
vdiskInfo.push({label: 'Incarnation GUID', value: IncarnationGuid});
|
116
|
+
}
|
117
|
+
if (valueIsDefined(InstanceGuid)) {
|
118
|
+
vdiskInfo.push({label: 'Instance GUID', value: InstanceGuid});
|
119
|
+
}
|
120
|
+
if (valueIsDefined(FrontQueues)) {
|
121
|
+
vdiskInfo.push({
|
122
|
+
label: 'Front Queues',
|
123
|
+
value: <EntityStatus status={FrontQueues} />,
|
124
|
+
});
|
125
|
+
}
|
126
|
+
if (valueIsDefined(StoragePoolName)) {
|
127
|
+
vdiskInfo.push({label: 'Storage Pool Name', value: StoragePoolName});
|
128
|
+
}
|
129
|
+
vdiskInfo.push({
|
130
|
+
label: 'Read Throughput',
|
131
|
+
value: bytesToSpeed(ReadThroughput),
|
132
|
+
});
|
133
|
+
vdiskInfo.push({
|
134
|
+
label: 'Write Throughput',
|
135
|
+
value: bytesToSpeed(WriteThroughput),
|
136
|
+
});
|
137
|
+
|
138
|
+
return (
|
139
|
+
<React.Fragment>
|
140
|
+
<div className={b('row')}>
|
141
|
+
<span className={b('title')}>VDisk </span>
|
142
|
+
<EntityStatus
|
143
|
+
status={VDiskState === 'OK' ? 'green' : 'red'}
|
144
|
+
name={stringifyVdiskId(VDiskId)}
|
145
|
+
/>
|
146
|
+
</div>
|
147
|
+
|
148
|
+
<div className={b('column')}>
|
149
|
+
<InfoViewer className={b('section')} info={vdiskInfo} />
|
150
|
+
</div>
|
151
|
+
</React.Fragment>
|
152
|
+
);
|
153
|
+
}
|
@@ -14,7 +14,7 @@ import ProgressViewer from '../../components/ProgressViewer/ProgressViewer';
|
|
14
14
|
import {getPdiskInfo, clearStore} from '../../store/reducers/pdisk';
|
15
15
|
import {PDISK_AUTO_RELOAD_INTERVAL} from '../../utils/constants';
|
16
16
|
import {formatStorageValues, calcUptime} from '../../utils';
|
17
|
-
import
|
17
|
+
import {getDefaultNodePath} from '../Node/NodePages';
|
18
18
|
|
19
19
|
import './Pdisk.scss';
|
20
20
|
|
@@ -97,10 +97,7 @@ class Pdisk extends React.Component {
|
|
97
97
|
{
|
98
98
|
label: 'NodeId',
|
99
99
|
value: (
|
100
|
-
<Link
|
101
|
-
className={b('link')}
|
102
|
-
to={createHref(routes.node, {id: NodeId, activeTab: 'storage'})}
|
103
|
-
>
|
100
|
+
<Link className={b('link')} to={getDefaultNodePath(NodeId)}>
|
104
101
|
{NodeId}
|
105
102
|
</Link>
|
106
103
|
),
|
@@ -5,7 +5,6 @@
|
|
5
5
|
display: inline-block;
|
6
6
|
|
7
7
|
width: 100%;
|
8
|
-
max-width: 200px;
|
9
8
|
height: var(--yc-text-body2-line-height);
|
10
9
|
|
11
10
|
border: 1px solid var(--yc-color-infographics-misc-medium);
|
@@ -66,12 +65,20 @@
|
|
66
65
|
}
|
67
66
|
&__filled-title {
|
68
67
|
position: absolute;
|
69
|
-
|
70
|
-
left: 5px;
|
68
|
+
z-index: 2;
|
71
69
|
|
72
70
|
font-size: var(--yc-text-body-font-size);
|
73
71
|
line-height: inherit;
|
74
72
|
|
75
73
|
color: inherit;
|
76
74
|
}
|
75
|
+
|
76
|
+
&__link {
|
77
|
+
display: flex;
|
78
|
+
justify-content: center;
|
79
|
+
|
80
|
+
height: 100%;
|
81
|
+
|
82
|
+
color: inherit;
|
83
|
+
}
|
77
84
|
}
|
@@ -1,5 +1,5 @@
|
|
1
|
-
import React
|
2
|
-
import
|
1
|
+
import React from 'react';
|
2
|
+
import InternalLink from '../../../components/InternalLink/InternalLink';
|
3
3
|
import cn from 'bem-cn-lite';
|
4
4
|
|
5
5
|
import './DiskStateProgressBar.scss';
|
@@ -26,12 +26,19 @@ function DiskStateProgressBar({
|
|
26
26
|
severity,
|
27
27
|
href,
|
28
28
|
}: DiskStateProgressBarProps) {
|
29
|
-
const
|
30
|
-
|
31
|
-
|
32
|
-
|
33
|
-
|
29
|
+
const renderAllocatedPercent = () => {
|
30
|
+
return (
|
31
|
+
diskAllocatedPercent >= 0 && (
|
32
|
+
<React.Fragment>
|
33
|
+
<div className={b('filled')} style={{width: `${diskAllocatedPercent}%`}} />
|
34
|
+
<div className={b('filled-title')}>
|
35
|
+
{`${Math.round(diskAllocatedPercent)}%`}
|
36
|
+
</div>
|
37
|
+
</React.Fragment>
|
38
|
+
)
|
39
|
+
);
|
34
40
|
};
|
41
|
+
|
35
42
|
return (
|
36
43
|
<div
|
37
44
|
className={
|
@@ -39,15 +46,13 @@ function DiskStateProgressBar({
|
|
39
46
|
? b({[diskProgressColors[severity].toLowerCase()]: true})
|
40
47
|
: undefined
|
41
48
|
}
|
42
|
-
onClick={onDiskClick}
|
43
49
|
>
|
44
|
-
{
|
45
|
-
<
|
46
|
-
|
47
|
-
|
48
|
-
|
49
|
-
|
50
|
-
</React.Fragment>
|
50
|
+
{href ? (
|
51
|
+
<InternalLink to={href} className={b('link')}>
|
52
|
+
{renderAllocatedPercent()}
|
53
|
+
</InternalLink>
|
54
|
+
) : (
|
55
|
+
renderAllocatedPercent()
|
51
56
|
)}
|
52
57
|
</div>
|
53
58
|
);
|
@@ -11,6 +11,7 @@ import {getPDiskId} from '../../../utils';
|
|
11
11
|
import DiskStateProgressBar, {
|
12
12
|
diskProgressColors,
|
13
13
|
} from '../DiskStateProgressBar/DiskStateProgressBar';
|
14
|
+
import {STRUCTURE} from '../../Node/NodePages';
|
14
15
|
|
15
16
|
import './Pdisk.scss';
|
16
17
|
|
@@ -119,7 +120,7 @@ function Pdisk(props: PDiskProps) {
|
|
119
120
|
className={b('popup-wrapper')}
|
120
121
|
anchorRef={anchor}
|
121
122
|
open={isPopupVisible}
|
122
|
-
placement={['top']}
|
123
|
+
placement={['top', 'bottom']}
|
123
124
|
hasArrow
|
124
125
|
>
|
125
126
|
<div className={b('popup-content')}>
|
@@ -153,10 +154,11 @@ function Pdisk(props: PDiskProps) {
|
|
153
154
|
<DiskStateProgressBar
|
154
155
|
diskAllocatedPercent={pdiskAllocatedPercent}
|
155
156
|
severity={severity as keyof typeof diskProgressColors}
|
156
|
-
href={createHref(
|
157
|
-
|
158
|
-
|
159
|
-
|
157
|
+
href={createHref(
|
158
|
+
routes.node,
|
159
|
+
{id: props.NodeId, activeTab: STRUCTURE},
|
160
|
+
{pdiskId: props.PDiskId},
|
161
|
+
)}
|
160
162
|
/>
|
161
163
|
</div>
|
162
164
|
</React.Fragment>
|
@@ -18,6 +18,7 @@ import {
|
|
18
18
|
getNodesObject,
|
19
19
|
StorageTypes,
|
20
20
|
setStorageType,
|
21
|
+
VisibleEntitiesTitles,
|
21
22
|
} from '../../store/reducers/storage';
|
22
23
|
import {getNodesList} from '../../store/reducers/clusterNodes';
|
23
24
|
import StorageGroups from './StorageGroups/StorageGroups';
|
@@ -56,6 +57,7 @@ class Storage extends React.Component {
|
|
56
57
|
visibleEntities: PropTypes.string,
|
57
58
|
setHeader: PropTypes.func,
|
58
59
|
tenant: PropTypes.string,
|
60
|
+
nodeId: PropTypes.string,
|
59
61
|
};
|
60
62
|
|
61
63
|
componentDidMount() {
|
@@ -68,12 +70,7 @@ class Storage extends React.Component {
|
|
68
70
|
getNodesList,
|
69
71
|
getStorageInfo,
|
70
72
|
} = this.props;
|
71
|
-
|
72
|
-
{
|
73
|
-
text: CLUSTER_PAGES.storage.title,
|
74
|
-
link: createHref(routes.cluster, {activeTab: CLUSTER_PAGES.storage.id}),
|
75
|
-
},
|
76
|
-
]);
|
73
|
+
|
77
74
|
this.autofetcher = new AutoFetcher();
|
78
75
|
getNodesList();
|
79
76
|
if (tenant || nodeId) {
|
@@ -85,6 +82,12 @@ class Storage extends React.Component {
|
|
85
82
|
type: storageType,
|
86
83
|
});
|
87
84
|
} else {
|
85
|
+
setHeader([
|
86
|
+
{
|
87
|
+
text: CLUSTER_PAGES.storage.title,
|
88
|
+
link: createHref(routes.cluster, {activeTab: CLUSTER_PAGES.storage.id}),
|
89
|
+
},
|
90
|
+
]);
|
88
91
|
getStorageInfo({
|
89
92
|
tenant,
|
90
93
|
nodeId,
|
@@ -209,13 +212,13 @@ class Storage extends React.Component {
|
|
209
212
|
</div>
|
210
213
|
<RadioButton value={visibleEntities} onUpdate={this.onGroupVisibilityChange}>
|
211
214
|
<RadioButton.Option value={VisibleEntities.Missing}>
|
212
|
-
{VisibleEntities.Missing}
|
215
|
+
{VisibleEntitiesTitles[VisibleEntities.Missing]}
|
213
216
|
</RadioButton.Option>
|
214
217
|
<RadioButton.Option value={VisibleEntities.Space}>
|
215
|
-
{VisibleEntities.Space}
|
218
|
+
{VisibleEntitiesTitles[VisibleEntities.Space]}
|
216
219
|
</RadioButton.Option>
|
217
220
|
<RadioButton.Option value={VisibleEntities.All}>
|
218
|
-
{VisibleEntities.All}
|
221
|
+
{VisibleEntitiesTitles[VisibleEntities.All]}
|
219
222
|
</RadioButton.Option>
|
220
223
|
</RadioButton>
|
221
224
|
|
@@ -84,7 +84,7 @@ function StorageGroups({data, tableSettings, visibleEntities, nodes}: StorageGro
|
|
84
84
|
{
|
85
85
|
name: TableColumnsIds.PoolName,
|
86
86
|
header: tableColumnsNames[TableColumnsIds.PoolName],
|
87
|
-
width:
|
87
|
+
width: 250,
|
88
88
|
render: ({value}) => {
|
89
89
|
const splitted = (value as string)?.split('/');
|
90
90
|
return (
|
@@ -214,7 +214,7 @@ function StorageGroups({data, tableSettings, visibleEntities, nodes}: StorageGro
|
|
214
214
|
|
215
215
|
if (visibleEntities === VisibleEntities.Space) {
|
216
216
|
columns = allColumns.filter((col) => col.name !== TableColumnsIds.Missing);
|
217
|
-
emptyMessage = 'No
|
217
|
+
emptyMessage = 'No groups with out of space errors.';
|
218
218
|
}
|
219
219
|
|
220
220
|
if (visibleEntities === VisibleEntities.Missing) {
|
@@ -1,4 +1,4 @@
|
|
1
|
-
.global-storage-
|
1
|
+
.global-storage-nodes {
|
2
2
|
&__pdisks-wrapper {
|
3
3
|
display: flex;
|
4
4
|
overflow-x: auto;
|
@@ -15,7 +15,8 @@
|
|
15
15
|
display: inline-block;
|
16
16
|
overflow: hidden;
|
17
17
|
|
18
|
-
|
18
|
+
width: 330px;
|
19
|
+
max-width: 330px;
|
19
20
|
|
20
21
|
text-overflow: ellipsis;
|
21
22
|
}
|
@@ -34,7 +34,7 @@ const tableColumnsNames: Record<TableColumnsIdsValues, string> = {
|
|
34
34
|
Missing: 'Missing',
|
35
35
|
};
|
36
36
|
|
37
|
-
const b = cn('global-storage-
|
37
|
+
const b = cn('global-storage-nodes');
|
38
38
|
|
39
39
|
function setSortOrder(visibleEntities: keyof typeof VisibleEntities): SortOrder | undefined {
|
40
40
|
switch (visibleEntities) {
|
@@ -118,7 +118,7 @@ function StorageNodes({data, tableSettings, visibleEntities}: StorageGroupsProps
|
|
118
118
|
|
119
119
|
if (visibleEntities === VisibleEntities.Space) {
|
120
120
|
columns = allColumns.filter((col) => col.name !== TableColumnsIds.Missing);
|
121
|
-
emptyMessage = 'No nodes with space
|
121
|
+
emptyMessage = 'No nodes with out of space errors.';
|
122
122
|
}
|
123
123
|
if (visibleEntities === VisibleEntities.Missing) {
|
124
124
|
emptyMessage = 'No degraded nodes.';
|
@@ -10,6 +10,7 @@ import {stringifyVdiskId, getPDiskId} from '../../../utils';
|
|
10
10
|
import DiskStateProgressBar, {
|
11
11
|
diskProgressColors,
|
12
12
|
} from '../DiskStateProgressBar/DiskStateProgressBar';
|
13
|
+
import {STRUCTURE} from '../../Node/NodePages';
|
13
14
|
|
14
15
|
import './Vdisk.scss';
|
15
16
|
|
@@ -192,7 +193,7 @@ function Vdisk(props) {
|
|
192
193
|
className={b('popup-wrapper')}
|
193
194
|
anchorRef={anchor}
|
194
195
|
open={isPopupVisible}
|
195
|
-
placement={['top']}
|
196
|
+
placement={['top', 'bottom']}
|
196
197
|
hasArrow
|
197
198
|
>
|
198
199
|
<div className={b('popup-content')}>
|
@@ -234,11 +235,11 @@ function Vdisk(props) {
|
|
234
235
|
<DiskStateProgressBar
|
235
236
|
diskAllocatedPercent={vdiskAllocatedPercent}
|
236
237
|
severity={severity}
|
237
|
-
href={createHref(
|
238
|
-
|
239
|
-
|
240
|
-
|
241
|
-
|
238
|
+
href={createHref(
|
239
|
+
routes.node,
|
240
|
+
{id: props.NodeId, activeTab: STRUCTURE},
|
241
|
+
{pdiskId: props.PDisk?.PDiskId, vdiskId: stringifyVdiskId(props.VDiskId)},
|
242
|
+
)}
|
242
243
|
/>
|
243
244
|
</div>
|
244
245
|
</React.Fragment>
|
@@ -19,6 +19,7 @@ import {Link as ExternalLink, Button, Loader} from '@yandex-cloud/uikit';
|
|
19
19
|
import DataTable from '@yandex-cloud/react-data-table';
|
20
20
|
import CriticalActionDialog from '../../components/CriticalActionDialog/CriticalActionDialog';
|
21
21
|
import routes, {createHref} from '../../routes';
|
22
|
+
import {getDefaultNodePath} from '../Node/NodePages';
|
22
23
|
|
23
24
|
import './Tablet.scss';
|
24
25
|
|
@@ -316,13 +317,7 @@ class Tablet extends React.Component {
|
|
316
317
|
{
|
317
318
|
label: 'Node',
|
318
319
|
value: (
|
319
|
-
<Link
|
320
|
-
className={b('link')}
|
321
|
-
to={createHref(routes.node, {
|
322
|
-
id: String(tablet.NodeId),
|
323
|
-
activeTab: 'storage',
|
324
|
-
})}
|
325
|
-
>
|
320
|
+
<Link className={b('link')} to={getDefaultNodePath(String(tablet.NodeId))}>
|
326
321
|
{tablet.NodeId}
|
327
322
|
</Link>
|
328
323
|
),
|
@@ -32,9 +32,9 @@ class Tablets extends React.Component {
|
|
32
32
|
hideTooltip: PropTypes.func,
|
33
33
|
getTabletsInfo: PropTypes.func,
|
34
34
|
nodeId: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
|
35
|
-
timeoutForRequest: PropTypes.number,
|
36
35
|
path: PropTypes.string,
|
37
36
|
clearWasLoadingFlag: PropTypes.func,
|
37
|
+
className: PropTypes.string,
|
38
38
|
};
|
39
39
|
|
40
40
|
autofetcher;
|
@@ -148,10 +148,10 @@ class Tablets extends React.Component {
|
|
148
148
|
content: item,
|
149
149
|
}));
|
150
150
|
const {filteredTablets} = this.state;
|
151
|
-
const {stateFilter, typeFilter} = this.props;
|
151
|
+
const {stateFilter, typeFilter, className} = this.props;
|
152
152
|
|
153
153
|
return (
|
154
|
-
<div className={b()}>
|
154
|
+
<div className={(b(), className)}>
|
155
155
|
<div className={b('header')}>
|
156
156
|
<Select
|
157
157
|
className={b('filter-control')}
|
@@ -204,19 +204,11 @@ class Tablets extends React.Component {
|
|
204
204
|
}
|
205
205
|
|
206
206
|
const mapStateToProps = (state) => {
|
207
|
-
const {
|
208
|
-
data = {},
|
209
|
-
wasLoaded,
|
210
|
-
loading,
|
211
|
-
timeoutForRequest,
|
212
|
-
stateFilter,
|
213
|
-
typeFilter,
|
214
|
-
} = state.tablets;
|
207
|
+
const {data = {}, wasLoaded, loading, stateFilter, typeFilter} = state.tablets;
|
215
208
|
const {autorefresh} = state.schema;
|
216
209
|
const {TabletStateInfo: tablets = []} = data;
|
217
210
|
return {
|
218
211
|
tablets,
|
219
|
-
timeoutForRequest,
|
220
212
|
wasLoaded,
|
221
213
|
loading,
|
222
214
|
stateFilter,
|
@@ -26,7 +26,6 @@ class Acl extends React.Component {
|
|
26
26
|
name: 'AccessType',
|
27
27
|
header: 'Access Type',
|
28
28
|
sortable: false,
|
29
|
-
width: COLUMN_WIDTH,
|
30
29
|
},
|
31
30
|
{
|
32
31
|
name: 'AccessRights',
|
@@ -36,7 +35,6 @@ class Acl extends React.Component {
|
|
36
35
|
return <div key={index}>{item}</div>;
|
37
36
|
});
|
38
37
|
},
|
39
|
-
width: COLUMN_WIDTH,
|
40
38
|
sortable: false,
|
41
39
|
},
|
42
40
|
{
|
@@ -56,7 +54,6 @@ class Acl extends React.Component {
|
|
56
54
|
return <div key={index}>{item}</div>;
|
57
55
|
});
|
58
56
|
},
|
59
|
-
width: COLUMN_WIDTH,
|
60
57
|
sortable: false,
|
61
58
|
},
|
62
59
|
];
|
@@ -31,7 +31,6 @@ class Compute extends React.Component {
|
|
31
31
|
getNodes: PropTypes.func,
|
32
32
|
hideTooltip: PropTypes.func,
|
33
33
|
showTooltip: PropTypes.func,
|
34
|
-
timeoutForRequest: PropTypes.number,
|
35
34
|
};
|
36
35
|
|
37
36
|
autofetcher;
|
@@ -102,7 +101,7 @@ class Compute extends React.Component {
|
|
102
101
|
}
|
103
102
|
|
104
103
|
function mapStateToProps(state, ownProps) {
|
105
|
-
const {data, loading, wasLoaded, error
|
104
|
+
const {data, loading, wasLoaded, error} = state.nodes;
|
106
105
|
const {autorefresh} = state.schema;
|
107
106
|
const {search} = ownProps.location;
|
108
107
|
const queryParams = qs.parse(search, {
|
@@ -113,7 +112,6 @@ function mapStateToProps(state, ownProps) {
|
|
113
112
|
return {
|
114
113
|
nodes,
|
115
114
|
tenantName,
|
116
|
-
timeoutForRequest,
|
117
115
|
loading,
|
118
116
|
wasLoaded,
|
119
117
|
error,
|
@@ -14,11 +14,11 @@ import ProblemFilter, {problemFilterType} from '../../../../components/ProblemFi
|
|
14
14
|
import {getNetworkInfo} from '../../../../store/reducers/network';
|
15
15
|
import {hideTooltip, showTooltip} from '../../../../store/reducers/tooltip';
|
16
16
|
import {ALL, PROBLEMS} from '../../../../utils/constants';
|
17
|
-
import routes, {createHref} from '../../../../routes';
|
18
17
|
import {changeFilter} from '../../../../store/reducers/settings';
|
18
|
+
import {AutoFetcher} from '../../../../utils/autofetcher';
|
19
|
+
import {getDefaultNodePath} from '../../../Node/NodePages';
|
19
20
|
|
20
21
|
import './Network.scss';
|
21
|
-
import {AutoFetcher} from '../../../../utils/autofetcher';
|
22
22
|
|
23
23
|
const b = cn('network');
|
24
24
|
|
@@ -301,10 +301,7 @@ class Network extends React.Component {
|
|
301
301
|
Connectivity of node{' '}
|
302
302
|
<Link
|
303
303
|
className={b('link')}
|
304
|
-
to={
|
305
|
-
id: clickedNode.NodeId,
|
306
|
-
activeTab: 'storage',
|
307
|
-
})}
|
304
|
+
to={getDefaultNodePath(clickedNode.NodeId)}
|
308
305
|
>
|
309
306
|
{clickedNode.NodeId}
|
310
307
|
</Link>{' '}
|
@@ -154,7 +154,7 @@ function ObjectSummary(props: ObjectSummaryProps) {
|
|
154
154
|
|
155
155
|
const renderObjectOverview = () => {
|
156
156
|
const startTimeInMilliseconds = currentSchemaData?.CreateStep / 1000;
|
157
|
-
let createTime = '
|
157
|
+
let createTime = '';
|
158
158
|
if (startTimeInMilliseconds) {
|
159
159
|
createTime = new Date(startTimeInMilliseconds).toUTCString();
|
160
160
|
}
|