Skip to content

Commit e203d2a

Browse files
tlabajtlabaj
committed
update more uses of ststus color
1 parent 12e0182 commit e203d2a

9 files changed

Lines changed: 73 additions & 32 deletions

File tree

‎packages/react-core/src/components/Compass/__tests__/__snapshots__/CompassMainHeader.test.tsx.snap‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@ exports[`Matches the snapshot with both title and toolbar 1`] = `
66
class="pf-v6-c-compass__main-header"
77
>
88
<div
9-
class="pf-v6-c-compass__panel"
9+
class=""
1010
>
1111
<div
1212
class="pf-v6-c-compass__main-header-content"

‎packages/react-core/src/components/Compass/__tests__/__snapshots__/CompassPanel.test.tsx.snap‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@
33
exports[`Matches the snapshot with all modifiers 1`] = `
44
<DocumentFragment>
55
<div
6-
class="pf-v6-c-compass__panel pf-m-pill pf-m-no-border pf-m-no-padding pf-v6-m-thinking pf-m-full-height pf-m-scrollable"
6+
class="pf-v6-m-thinking"
77
>
88
<div>
99
Panel with all modifiers
@@ -15,7 +15,7 @@ exports[`Matches the snapshot with all modifiers 1`] = `
1515
exports[`Matches the snapshot with no modifiers 1`] = `
1616
<DocumentFragment>
1717
<div
18-
class="pf-v6-c-compass__panel"
18+
class=""
1919
>
2020
<div>
2121
Basic panel

‎packages/react-core/src/components/Label/__tests__/Label.test.tsx‎

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -2,9 +2,9 @@ import { render, screen } from '@testing-library/react';
22
import userEvent from '@testing-library/user-event';
33
import '@testing-library/jest-dom';
44

5-
import { Label } from '../Label';
5+
import { Label, LabelColor } from '../Label';
66

7-
const labelColors = ['blue', 'teal', 'green', 'orange', 'purple', 'red', 'grey', 'yellow'];
7+
const labelColors = Object.values(LabelColor);
88

99
describe('Label', () => {
1010
test('renders', () => {
@@ -51,17 +51,17 @@ describe('Label', () => {
5151
expect(asFragment()).toMatchSnapshot();
5252
});
5353

54-
labelColors.forEach((color: string) =>
54+
labelColors.forEach((color) =>
5555
test(`label with ${color} color`, () => {
56-
const { asFragment } = render(<Label color={color as any}>Something</Label>);
56+
const { asFragment } = render(<Label color={color}>Something</Label>);
5757
expect(asFragment()).toMatchSnapshot();
5858
})
5959
);
6060

61-
labelColors.forEach((color: string) =>
61+
labelColors.forEach((color) =>
6262
test(`label with ${color} color with outline variant`, () => {
6363
const { asFragment } = render(
64-
<Label color={color as any} variant="outline">
64+
<Label color={color} variant="outline">
6565
Something
6666
</Label>
6767
);

‎packages/react-core/src/components/Label/__tests__/__snapshots__/Label.test.tsx.snap‎

Lines changed: 36 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -452,6 +452,42 @@ exports[`Label label with red color with outline variant 1`] = `
452452
</DocumentFragment>
453453
`;
454454

455+
exports[`Label label with orangered color 1`] = `
456+
<DocumentFragment>
457+
<span
458+
class="pf-v6-c-label pf-m-orangered pf-m-filled"
459+
>
460+
<span
461+
class="pf-v6-c-label__content"
462+
>
463+
<span
464+
class="pf-v6-c-label__text"
465+
>
466+
Something
467+
</span>
468+
</span>
469+
</span>
470+
</DocumentFragment>
471+
`;
472+
473+
exports[`Label label with orangered color with outline variant 1`] = `
474+
<DocumentFragment>
475+
<span
476+
class="pf-v6-c-label pf-m-orangered pf-m-outline"
477+
>
478+
<span
479+
class="pf-v6-c-label__content"
480+
>
481+
<span
482+
class="pf-v6-c-label__text"
483+
>
484+
Something
485+
</span>
486+
</span>
487+
</span>
488+
</DocumentFragment>
489+
`;
490+
455491
exports[`Label label with teal color 1`] = `
456492
<DocumentFragment>
457493
<span

‎packages/react-core/src/demos/RTL/examples/PaginatedTable.tsx‎

Lines changed: 5 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -39,6 +39,7 @@ import {
3939
ToolbarItem,
4040
Truncate
4141
} from '@patternfly/react-core';
42+
import { LabelColor } from '../../../components/Label/Label';
4243

4344
import { Table, Thead, Tr, Th, Tbody, Td } from '@patternfly/react-table';
4445
import translationsEn from './examples/translations.en.json';
@@ -180,7 +181,7 @@ export const PaginatedTableAction: React.FunctionComponent = () => {
180181
case 'רץ':
181182
return (
182183
<Label
183-
color="green"
184+
color={LabelColor.green}
184185
icon={
185186
<Icon shouldMirrorRTL>
186187
<WalkingIcon />
@@ -199,22 +200,22 @@ export const PaginatedTableAction: React.FunctionComponent = () => {
199200
<HandPaperIcon />
200201
</Icon>
201202
}
202-
color="red"
203+
color={LabelColor.red}
203204
>
204205
{translation.table.rows.status.stopped}
205206
</Label>
206207
);
207208
case 'Needs maintenance':
208209
case 'זקוק לתחזוקה':
209210
return (
210-
<Label icon={<ToolsIcon />} color="blue">
211+
<Label icon={<ToolsIcon />} color={LabelColor.blue}>
211212
{translation.table.rows.status.needsMaintenance}
212213
</Label>
213214
);
214215
case 'Down':
215216
case 'מטה':
216217
return (
217-
<Label icon={<ClockIcon />} color="orange">
218+
<Label icon={<ClockIcon />} color={LabelColor.orange}>
218219
{translation.table.rows.status.down}
219220
</Label>
220221
);

‎packages/react-core/src/demos/examples/Card/CardHorizontalGrid.tsx‎

Lines changed: 9 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -19,6 +19,7 @@ import {
1919
MenuToggle,
2020
MenuToggleElement
2121
} from '@patternfly/react-core';
22+
import { LabelColor } from '../../../components/Label/Label';
2223
import RhUiInformationFillIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-information-fill-icon';
2324
import ArrowRightIcon from '@patternfly/react-icons/dist/esm/icons/arrow-right-icon';
2425
import ExternalLinkAltIcon from '@patternfly/react-icons/dist/esm/icons/external-link-alt-icon';
@@ -88,16 +89,16 @@ export const CardHorizontalGrid: React.FunctionComponent = () => {
8889
<Level hasGutter>
8990
<CardTitle id="titleId">Getting Started</CardTitle>
9091
<LabelGroup isCompact>
91-
<Label isCompact icon={<RhUiInformationFillIcon />} color="blue">
92+
<Label isCompact icon={<RhUiInformationFillIcon />} color={LabelColor.blue}>
9293
Set up your cluster
9394
</Label>
94-
<Label isCompact icon={<RhUiInformationFillIcon />} color="purple">
95+
<Label isCompact icon={<RhUiInformationFillIcon />} color={LabelColor.purple}>
9596
Guided tours
9697
</Label>
97-
<Label isCompact icon={<RhUiInformationFillIcon />} color="green">
98+
<Label isCompact icon={<RhUiInformationFillIcon />} color={LabelColor.green}>
9899
Quick starts
99100
</Label>
100-
<Label isCompact icon={<RhUiInformationFillIcon />} color="orange">
101+
<Label isCompact icon={<RhUiInformationFillIcon />} color={LabelColor.orange}>
101102
Learning resources
102103
</Label>
103104
</LabelGroup>
@@ -118,7 +119,7 @@ export const CardHorizontalGrid: React.FunctionComponent = () => {
118119
direction={{ default: 'column' }}
119120
grow={{ default: 'grow' }}
120121
>
121-
<Label icon={<RhUiInformationFillIcon />} color="blue">
122+
<Label icon={<RhUiInformationFillIcon />} color={LabelColor.blue}>
122123
Set up your cluster
123124
</Label>
124125
<p>Continue setting up your cluster to access all you cain in the Console</p>
@@ -149,7 +150,7 @@ export const CardHorizontalGrid: React.FunctionComponent = () => {
149150
direction={{ default: 'column' }}
150151
grow={{ default: 'grow' }}
151152
>
152-
<Label icon={<RhUiInformationFillIcon />} color="purple">
153+
<Label icon={<RhUiInformationFillIcon />} color={LabelColor.purple}>
153154
Guided tours
154155
</Label>
155156
<p>Tour some of the key features around the console</p>
@@ -177,7 +178,7 @@ export const CardHorizontalGrid: React.FunctionComponent = () => {
177178
direction={{ default: 'column' }}
178179
grow={{ default: 'grow' }}
179180
>
180-
<Label icon={<RhUiInformationFillIcon />} color="green">
181+
<Label icon={<RhUiInformationFillIcon />} color={LabelColor.green}>
181182
Quick starts
182183
</Label>
183184
<p>Get started with features using our step-by-step documentation</p>
@@ -208,7 +209,7 @@ export const CardHorizontalGrid: React.FunctionComponent = () => {
208209
direction={{ default: 'column' }}
209210
grow={{ default: 'grow' }}
210211
>
211-
<Label icon={<RhUiInformationFillIcon />} color="orange">
212+
<Label icon={<RhUiInformationFillIcon />} color={LabelColor.orange}>
212213
Learning resources
213214
</Label>
214215
<p>Learn about new features within the Console and get started with demo apps</p>

‎packages/react-core/src/demos/examples/Card/CardStatus.tsx‎

Lines changed: 6 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -21,6 +21,7 @@ import {
2121
Title,
2222
Icon
2323
} from '@patternfly/react-core';
24+
import { LabelStatus } from '../../../components/Label/Label';
2425
import { Table, Thead, Tbody, Tr, Th, Td, ExpandableRowContent } from '@patternfly/react-table';
2526
import RhUiCheckCircleFillIcon from '@patternfly/react-icons/dist/js/icons/rh-ui-check-circle-fill-icon';
2627
import RhUiErrorFillIcon from '@patternfly/react-icons/dist/js/icons/rh-ui-error-fill-icon';
@@ -204,11 +205,11 @@ export const CardStatus: React.FunctionComponent = () => {
204205
<FlexItem spacer={{ default: 'spacerMd' }}>
205206
<span>Notifications</span>
206207
</FlexItem>
207-
<Label status="danger">1</Label>
208-
<Label status="warning">3</Label>
209-
<Label status="success">3</Label>
210-
<Label status="danger">3</Label>
211-
<Label status="info">3</Label>
208+
<Label status={LabelStatus.danger}>1</Label>
209+
<Label status={LabelStatus.warning}>3</Label>
210+
<Label status={LabelStatus.success}>3</Label>
211+
<Label status={LabelStatus.danger}>3</Label>
212+
<Label status={LabelStatus.info}>3</Label>
212213
</Flex>
213214
);
214215

‎packages/react-core/src/demos/examples/Tabs/TabsOpen.tsx‎

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -19,6 +19,7 @@ import {
1919
Flex,
2020
FlexItem
2121
} from '@patternfly/react-core';
22+
import { LabelColor } from '../../../components/Label/Label';
2223
import RhUiCheckCircleFillIcon from '@patternfly/react-icons/dist/js/icons/rh-ui-check-circle-fill-icon';
2324
import RhUiInformationFillIcon from '@patternfly/react-icons/dist/js/icons/rh-ui-information-fill-icon';
2425
import spacing from '@patternfly/react-styles/css/utilities/Spacing/spacing';
@@ -73,7 +74,7 @@ export const TabsOpen: React.FunctionComponent = () => {
7374
<DescriptionListDescription>
7475
<Flex spaceItems={{ default: 'spaceItemsSm' }}>
7576
<FlexItem>
76-
<Label color="teal">NS</Label>
77+
<Label color={LabelColor.teal}>NS</Label>
7778
</FlexItem>
7879
<FlexItem>
7980
<a href="#">knative-serving-ingress</a>
@@ -115,7 +116,7 @@ export const TabsOpen: React.FunctionComponent = () => {
115116
<DescriptionListDescription>
116117
<Flex spaceItems={{ default: 'spaceItemsSm' }}>
117118
<FlexItem>
118-
<Label color="purple">N</Label>
119+
<Label color={LabelColor.purple}>N</Label>
119120
</FlexItem>
120121
<FlexItem>ip-10-0-233-118.us-east-2.computer.external</FlexItem>
121122
</Flex>
@@ -142,7 +143,7 @@ export const TabsOpen: React.FunctionComponent = () => {
142143
flexWrap={{ default: 'noWrap' }}
143144
>
144145
<FlexItem>
145-
<Label color="blue">N</Label>
146+
<Label color={LabelColor.blue}>N</Label>
146147
</FlexItem>
147148
<FlexItem>
148149
<Title headingLevel="h1" size="2xl">

‎packages/react-core/src/demos/examples/Tabs/TabsOpenWithSecondaryTabs.tsx‎

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -19,6 +19,7 @@ import {
1919
Flex,
2020
FlexItem
2121
} from '@patternfly/react-core';
22+
import { LabelColor } from '../../../components/Label/Label';
2223
import RhUiCheckCircleFillIcon from '@patternfly/react-icons/dist/js/icons/rh-ui-check-circle-fill-icon';
2324
import RhUiInformationFillIcon from '@patternfly/react-icons/dist/js/icons/rh-ui-information-fill-icon';
2425
import spacing from '@patternfly/react-styles/css/utilities/Spacing/spacing';
@@ -79,7 +80,7 @@ export const TabsOpenWithSecondaryTabs: React.FunctionComponent = () => {
7980
<DescriptionListDescription>
8081
<Flex spaceItems={{ default: 'spaceItemsSm' }}>
8182
<FlexItem>
82-
<Label color="teal">NS</Label>
83+
<Label color={LabelColor.teal}>NS</Label>
8384
</FlexItem>
8485
<FlexItem>
8586
<a href="#">knative-serving-ingress</a>
@@ -121,7 +122,7 @@ export const TabsOpenWithSecondaryTabs: React.FunctionComponent = () => {
121122
<DescriptionListDescription>
122123
<Flex spaceItems={{ default: 'spaceItemsSm' }}>
123124
<FlexItem>
124-
<Label color="purple">N</Label>
125+
<Label color={LabelColor.purple}>N</Label>
125126
</FlexItem>
126127
<FlexItem>ip-10-0-233-118.us-east-2.computer.external</FlexItem>
127128
</Flex>
@@ -148,7 +149,7 @@ export const TabsOpenWithSecondaryTabs: React.FunctionComponent = () => {
148149
flexWrap={{ default: 'noWrap' }}
149150
>
150151
<FlexItem>
151-
<Label color="blue">N</Label>
152+
<Label color={LabelColor.blue}>N</Label>
152153
</FlexItem>
153154
<FlexItem>
154155
<Title headingLevel="h1" size="2xl">

0 commit comments

Comments
 (0)