Skip to content

Commit f79829a

Browse files
kkdraskkdras
committed
fix(storage): clarify state label data and degraded fallback
1 parent a7e0dd1 commit f79829a

3 files changed

Lines changed: 122 additions & 8 deletions

File tree

‎src/components/DiskStatus/DiskStatus.tsx‎

Lines changed: 6 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -28,6 +28,11 @@ export interface DiskStatusLabelData {
2828
dangerHeavy?: boolean;
2929
}
3030

31+
export type TitledDiskStatusLabelData = Omit<DiskStatusLabelData, 'title' | 'value'> & {
32+
title: string;
33+
value?: string;
34+
};
35+
3136
export function DiskStatusLabel({
3237
value,
3338
theme = 'normal',
@@ -37,7 +42,7 @@ export function DiskStatusLabel({
3742
dangerHeavy,
3843
size = 's',
3944
className,
40-
}: DiskStatusLabelData & Pick<LabelProps, 'size' | 'className'>) {
45+
}: (DiskStatusLabelData | TitledDiskStatusLabelData) & Pick<LabelProps, 'size' | 'className'>) {
4146
const label = (
4247
<Label
4348
size={size}

‎src/containers/Storage/utils/__test__/getStorageGroupStateLabel.test.ts‎

Lines changed: 108 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,108 @@
1+
import {getStorageGroupStateLabel} from '../getStorageGroupStateLabel';
2+
3+
describe('getStorageGroupStateLabel', () => {
4+
test.each([
5+
{state: 'ok', title: 'Ok', value: undefined, theme: 'success', dangerHeavy: false},
6+
{
7+
state: 'replicating',
8+
title: 'Replicating',
9+
value: undefined,
10+
theme: 'info',
11+
dangerHeavy: false,
12+
},
13+
{
14+
state: 'starting',
15+
title: 'Starting',
16+
value: undefined,
17+
theme: 'warning',
18+
dangerHeavy: false,
19+
},
20+
{state: 'dead', title: 'Dead', value: undefined, theme: 'danger', dangerHeavy: true},
21+
{
22+
state: 'replicating:3',
23+
title: 'Replicating',
24+
value: '3',
25+
theme: 'info',
26+
dangerHeavy: false,
27+
},
28+
{state: 'starting:2', title: 'Starting', value: '2', theme: 'warning', dangerHeavy: false},
29+
{state: 'degraded:1', title: 'Degraded', value: '1', theme: 'warning', dangerHeavy: false},
30+
{state: 'degraded:2', title: 'Degraded', value: '2', theme: 'danger', dangerHeavy: false},
31+
{state: 'dead:3', title: 'Dead', value: '3', theme: 'danger', dangerHeavy: true},
32+
{
33+
state: 'replicating:1(2)',
34+
title: 'Replicating',
35+
value: '1 (2)',
36+
theme: 'info',
37+
dangerHeavy: false,
38+
},
39+
{
40+
state: 'starting:1(3)',
41+
title: 'Starting',
42+
value: '1 (3)',
43+
theme: 'warning',
44+
dangerHeavy: false,
45+
},
46+
{
47+
state: 'degraded:1(3)',
48+
title: 'Degraded',
49+
value: '1 (3)',
50+
theme: 'warning',
51+
dangerHeavy: false,
52+
},
53+
{
54+
state: 'degraded:2(3,1)',
55+
title: 'Degraded',
56+
value: '2 (3,1)',
57+
theme: 'danger',
58+
dangerHeavy: false,
59+
},
60+
{
61+
state: 'dead:3(3,1,1)',
62+
title: 'Dead',
63+
value: '3 (3,1,1)',
64+
theme: 'danger',
65+
dangerHeavy: true,
66+
},
67+
])('formats $state with its expected appearance', ({state, ...expected}) => {
68+
expect(getStorageGroupStateLabel(state)).toEqual(expected);
69+
});
70+
71+
test.each([
72+
{state: 'degraded', title: 'Degraded', value: undefined},
73+
{state: 'degraded:0', title: 'Degraded', value: '0'},
74+
{state: 'degraded:3', title: 'Degraded', value: '3'},
75+
{state: 'degraded:10', title: 'Degraded', value: '10'},
76+
{state: 'degraded:20', title: 'Degraded', value: '20'},
77+
{state: 'degraded:3(3,1,1)', title: 'Degraded', value: '3 (3,1,1)'},
78+
{state: 'degraded:unknown', title: 'Degraded', value: 'unknown'},
79+
])('keeps $state visibly degraded when the count is unsupported', ({state, ...expected}) => {
80+
expect(getStorageGroupStateLabel(state)).toEqual({
81+
...expected,
82+
theme: 'warning',
83+
dangerHeavy: false,
84+
});
85+
});
86+
87+
test.each([undefined, null, '', ' \n\t '])('returns no label for %p', (state) => {
88+
expect(getStorageGroupStateLabel(state)).toBeUndefined();
89+
});
90+
91+
test('normalizes surrounding whitespace and spacing before the details', () => {
92+
expect(getStorageGroupStateLabel(' degraded: 2 (3, 1) ')).toEqual({
93+
title: 'Degraded',
94+
value: '2 (3, 1)',
95+
theme: 'danger',
96+
dangerHeavy: false,
97+
});
98+
});
99+
100+
test('preserves an unknown status and its details with a neutral appearance', () => {
101+
expect(getStorageGroupStateLabel('future-state:7(2,1)')).toEqual({
102+
title: 'Future-state',
103+
value: '7 (2,1)',
104+
theme: 'normal',
105+
dangerHeavy: false,
106+
});
107+
});
108+
});

‎src/containers/Storage/utils/getStorageGroupStateLabel.ts‎

Lines changed: 8 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import type {DiskStatusLabelData} from '../../../components/DiskStatus/DiskStatus';
1+
import type {TitledDiskStatusLabelData} from '../../../components/DiskStatus/DiskStatus';
22
import {
33
DATA_SEVERITY,
44
NUMERIC_SEVERITY_TO_LABEL_VIEW,
@@ -10,10 +10,13 @@ const stateSeverities = new Map<string, DisplaySeverity>([
1010
['ok', DATA_SEVERITY.GREEN],
1111
['replicating', DATA_SEVERITY.BLUE],
1212
['starting', DATA_SEVERITY.YELLOW],
13+
['degraded', DATA_SEVERITY.YELLOW],
1314
['dead', SOLID_RED_SEVERITY],
1415
]);
1516

16-
export function getStorageGroupStateLabel(state?: string | null): DiskStatusLabelData | undefined {
17+
export function getStorageGroupStateLabel(
18+
state?: string | null,
19+
): TitledDiskStatusLabelData | undefined {
1720
const normalizedState = state?.trim();
1821

1922
if (!normalizedState) {
@@ -28,9 +31,7 @@ export function getStorageGroupStateLabel(state?: string | null): DiskStatusLabe
2831
if (status === 'degraded') {
2932
const count = value?.split('(', 1)[0].trim();
3033

31-
if (count === '1') {
32-
severity = DATA_SEVERITY.YELLOW;
33-
} else if (count === '2') {
34+
if (count === '2') {
3435
severity = DATA_SEVERITY.RED;
3536
}
3637
}
@@ -40,8 +41,8 @@ export function getStorageGroupStateLabel(state?: string | null): DiskStatusLabe
4041
const formattedValue = value?.replace(/\s*\(/g, ' (');
4142

4243
return {
43-
title: formattedValue ? title : undefined,
44-
value: formattedValue ?? title,
44+
title,
45+
value: formattedValue,
4546
theme: labelView.theme,
4647
dangerHeavy: Boolean(labelView.dangerHeavy),
4748
};

0 commit comments

Comments
 (0)