Skip to content

Commit 327f75a

Browse files
rebeccaalpertrebeccaalpert
committed
fix(Messages): Update icons
Replace with RH UI icons.
1 parent 9083c19 commit 327f75a

11 files changed

Lines changed: 41 additions & 68 deletions

File tree

‎packages/module/patternfly-docs/content/extensions/chatbot/examples/Messages/MessageWithCustomResponseActions.tsx‎

Lines changed: 3 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,7 @@
11
import { FunctionComponent } from 'react';
22

33
import Message from '@patternfly/chatbot/dist/dynamic/Message';
4-
import InfoCircleIcon from '@patternfly/react-icons/dist/esm/icons/info-circle-icon';
5-
import RedoIcon from '@patternfly/react-icons/dist/esm/icons/redo-icon';
4+
import { RhMicronsInformationFillIcon, RhUiRedoIcon } from '@patternfly/react-icons';
65

76
export const CustomActionExample: FunctionComponent = () => (
87
<Message
@@ -18,14 +17,14 @@ export const CustomActionExample: FunctionComponent = () => (
1817
onClick: () => console.log('Clicked regenerate'),
1918
tooltipContent: 'Regenerate',
2019
clickedTooltipContent: 'Regenerated',
21-
icon: <RedoIcon />
20+
icon: <RhUiRedoIcon />
2221
},
2322
info: {
2423
ariaLabel: 'Info',
2524
// eslint-disable-next-line no-console
2625
onClick: () => console.log('Clicked info'),
2726
tooltipContent: 'Info',
28-
icon: <InfoCircleIcon />
27+
icon: <RhMicronsInformationFillIcon />
2928
}
3029
}}
3130
/>

‎packages/module/patternfly-docs/content/extensions/chatbot/examples/Messages/MessageWithMarkdownToolResponse.tsx‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import { useState, FunctionComponent, MouseEvent as ReactMouseEvent } from 'react';
22
import Message from '@patternfly/chatbot/dist/dynamic/Message';
3-
import { CopyIcon, WrenchIcon } from '@patternfly/react-icons';
3+
import { RhUiBuildFillIcon, RhUiCopyFillIcon } from '@patternfly/react-icons';
44
import {
55
Button,
66
DescriptionList,
@@ -72,7 +72,7 @@ export const MessageWithToolResponseExample: FunctionComponent = () => {
7272
}}
7373
>
7474
<FlexItem>
75-
<WrenchIcon
75+
<RhUiBuildFillIcon
7676
style={{
7777
color: 'var(--pf-t--global--icon--color--brand--default'
7878
}}
@@ -102,7 +102,7 @@ export const MessageWithToolResponseExample: FunctionComponent = () => {
102102
variant="plain"
103103
aria-label="Copy tool response to clipboard"
104104
icon={
105-
<CopyIcon
105+
<RhUiCopyFillIcon
106106
style={{
107107
color: 'var(--pf-t--global--icon--color--subtle)'
108108
}}

‎packages/module/patternfly-docs/content/extensions/chatbot/examples/Messages/MessageWithQuickResponses.tsx‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import { FunctionComponent } from 'react';
22
import Message from '@patternfly/chatbot/dist/dynamic/Message';
3-
import { CopyIcon, WrenchIcon } from '@patternfly/react-icons';
3+
import { RhUiBuildFillIcon, RhUiCopyFillIcon } from '@patternfly/react-icons';
44

55
export const MessageWithQuickResponsesExample: FunctionComponent = () => (
66
<>
@@ -73,8 +73,8 @@ export const MessageWithQuickResponsesExample: FunctionComponent = () => (
7373
role="bot"
7474
content="Example with icons"
7575
quickResponses={[
76-
{ id: '1', content: 'Update your settings', onClick: () => alert('Clicked yes'), icon: <WrenchIcon /> },
77-
{ id: '2', content: 'Copy', onClick: () => alert('Clicked no'), icon: <CopyIcon /> }
76+
{ id: '1', content: 'Update your settings', onClick: () => alert('Clicked yes'), icon: <RhUiBuildFillIcon /> },
77+
{ id: '2', content: 'Copy', onClick: () => alert('Clicked no'), icon: <RhUiCopyFillIcon /> }
7878
]}
7979
/>
8080
</>

‎packages/module/patternfly-docs/content/extensions/chatbot/examples/Messages/MessageWithToolResponse.tsx‎

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import { useState, FunctionComponent, MouseEvent as ReactMouseEvent } from 'react';
22
import Message from '@patternfly/chatbot/dist/dynamic/Message';
3-
import { CopyIcon, WrenchIcon } from '@patternfly/react-icons';
3+
import { RhUiBuildFillIcon, RhUiCopyFillIcon } from '@patternfly/react-icons';
44
import {
55
Button,
66
DescriptionList,
@@ -41,7 +41,7 @@ export const MessageWithToolResponseExample: FunctionComponent = () => {
4141
<FlexItem grow={{ default: 'grow' }}>
4242
<Flex gap={{ default: 'gapXs' }}>
4343
<FlexItem>
44-
<WrenchIcon style={{ color: 'var(--pf-t--global--icon--color--brand--default' }} />
44+
<RhUiBuildFillIcon style={{ color: 'var(--pf-t--global--icon--color--brand--default' }} />
4545
</FlexItem>
4646
<FlexItem>toolName</FlexItem>
4747
</Flex>
@@ -58,7 +58,7 @@ export const MessageWithToolResponseExample: FunctionComponent = () => {
5858
<Button
5959
variant="plain"
6060
aria-label="Copy tool response to clipboard"
61-
icon={<CopyIcon style={{ color: 'var(--pf-t--global--icon--color--subtle)' }} />}
61+
icon={<RhUiCopyFillIcon style={{ color: 'var(--pf-t--global--icon--color--subtle)' }} />}
6262
></Button>
6363
</FlexItem>
6464
</Flex>
@@ -152,7 +152,7 @@ export const MessageWithToolResponseExample: FunctionComponent = () => {
152152
<FlexItem grow={{ default: 'grow' }}>
153153
<Flex gap={{ default: 'gapXs' }}>
154154
<FlexItem>
155-
<WrenchIcon style={{ color: 'var(--pf-t--global--icon--color--brand--default' }} />
155+
<RhUiBuildFillIcon style={{ color: 'var(--pf-t--global--icon--color--brand--default' }} />
156156
</FlexItem>
157157
<FlexItem>toolName</FlexItem>
158158
</Flex>
@@ -169,7 +169,7 @@ export const MessageWithToolResponseExample: FunctionComponent = () => {
169169
<Button
170170
variant="plain"
171171
aria-label="Copy tool response to clipboard"
172-
icon={<CopyIcon style={{ color: 'var(--pf-t--global--icon--color--subtle)' }} />}
172+
icon={<RhUiCopyFillIcon style={{ color: 'var(--pf-t--global--icon--color--subtle)' }} />}
173173
></Button>
174174
</FlexItem>
175175
</Flex>

‎packages/module/patternfly-docs/content/extensions/chatbot/examples/Messages/Messages.md‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -50,7 +50,7 @@ import ResponseActions, { ResponseActionsGroups } from '@patternfly/chatbot/dist
5050
import ToolResponse from '@patternfly/chatbot/dist/dynamic/ToolResponse';
5151
import { rehypeCodeBlockToggle } from '@patternfly/chatbot/dist/esm/Message/Plugins/rehypeCodeBlockToggle';
5252
import SourcesCard from '@patternfly/chatbot/dist/dynamic/SourcesCard';
53-
import { ArrowCircleDownIcon, ArrowRightIcon, CheckCircleIcon, CopyIcon, CubeIcon, CubesIcon, DownloadIcon, InfoCircleIcon, OutlinedQuestionCircleIcon, RedoIcon, RobotIcon, WrenchIcon } from '@patternfly/react-icons';
53+
import { RhUiArrowCircleDownFillIcon, RhUiArrowRightIcon, RhUiCheckCircleFillIcon, RhUiCopyFillIcon, RhUiExportIcon, RhMicronsInformationFillIcon, OutlinedQuestionCircleIcon, RhUiRedoIcon, RobotIcon, RhUiBuildFillIcon } from '@patternfly/react-icons';
5454
import patternflyAvatar from './patternfly_avatar.jpg';
5555
import AttachmentEdit from '@patternfly/chatbot/dist/dynamic/AttachmentEdit';
5656
import FileDetails from '@patternfly/chatbot/dist/dynamic/FileDetails';

‎packages/module/patternfly-docs/content/extensions/chatbot/examples/Messages/UserMessageWithExtraContent.tsx‎

Lines changed: 7 additions & 31 deletions
Original file line numberDiff line numberDiff line change
@@ -39,7 +39,7 @@ import {
3939
TabTitleText,
4040
Spinner
4141
} from '@patternfly/react-core';
42-
import { ArrowCircleDownIcon, ArrowRightIcon, CheckCircleIcon, CubeIcon, CubesIcon } from '@patternfly/react-icons';
42+
import { RhUiArrowCircleDownFillIcon, RhUiArrowRightIcon, RhUiCheckCircleFillIcon } from '@patternfly/react-icons';
4343

4444
const UserActionEndContent = () => {
4545
// eslint-disable-next-line no-console
@@ -143,7 +143,7 @@ const LiveProgressSummaryCard = () => {
143143
const status = getStageStatus(stage);
144144

145145
if (status === 'completed') {
146-
return <CheckCircleIcon color="green" aria-label="Complete" />;
146+
return <RhUiCheckCircleFillIcon color="green" aria-label="Complete" />;
147147
} else if (status === 'in-progress') {
148148
return <Spinner size="sm" aria-valuetext="In progress" />;
149149
} else {
@@ -374,7 +374,7 @@ Setting up cluster console...`;
374374
</CardBody>
375375
</CardExpandableContent>
376376
<CardFooter>
377-
<Button isBlock variant="tertiary" icon={<ArrowRightIcon />} iconPosition="end">
377+
<Button isBlock variant="tertiary" icon={<RhUiArrowRightIcon />} iconPosition="end">
378378
Open in console
379379
</Button>
380380
</CardFooter>
@@ -536,34 +536,10 @@ const VersionSelectorCard = () => {
536536
style={{ '--pf-v6-c-card--child--PaddingBlockEnd': 'var(--pf-t--global--spacer--md)' } as React.CSSProperties}
537537
>
538538
<Tabs activeKey={activeTabKey} onSelect={handleTabClick} aria-label="Architecture" role="region" isFilled>
539-
<Tab
540-
eventKey={0}
541-
title={
542-
<TabTitleText>
543-
<Flex spaceItems={{ default: 'spaceItemsXs' }}>
544-
<FlexItem>
545-
<CubeIcon />
546-
</FlexItem>
547-
<FlexItem>Single arch</FlexItem>
548-
</Flex>
549-
</TabTitleText>
550-
}
551-
>
539+
<Tab eventKey={0} title={<TabTitleText>Single arch</TabTitleText>}>
552540
{generateTabContent('x86_64 Intel/AMD only', 'Standard deployments • Most common choice')}
553541
</Tab>
554-
<Tab
555-
eventKey={1}
556-
title={
557-
<TabTitleText>
558-
<Flex spaceItems={{ default: 'spaceItemsXs' }}>
559-
<FlexItem>
560-
<CubesIcon />
561-
</FlexItem>
562-
<FlexItem>Multi arch</FlexItem>
563-
</Flex>
564-
</TabTitleText>
565-
}
566-
>
542+
<Tab eventKey={1} title={<TabTitleText>Multi arch</TabTitleText>}>
567543
{generateTabContent('Multi arch', 'Standard deployments')}
568544
</Tab>
569545
</Tabs>
@@ -584,7 +560,7 @@ const DownloadCard = () => (
584560
<Flex spaceItems={{ default: 'spaceItemsSm' }}>
585561
<FlexItem>
586562
<Icon size="lg" status="success">
587-
<CheckCircleIcon />
563+
<RhUiCheckCircleFillIcon />
588564
</Icon>
589565
</FlexItem>
590566
<FlexItem>Your discovery ISO is ready</FlexItem>
@@ -602,7 +578,7 @@ const DownloadCard = () => (
602578

603579
<Flex direction={{ default: 'column' }} spaceItems={{ default: 'spaceItemsSm' }}>
604580
<FlexItem>
605-
<Button variant={ButtonVariant.primary} icon={<ArrowCircleDownIcon />} isBlock>
581+
<Button variant={ButtonVariant.primary} icon={<RhUiArrowCircleDownFillIcon />} isBlock>
606582
Download Discovery ISO
607583
</Button>
608584
</FlexItem>

‎packages/module/patternfly-docs/content/extensions/chatbot/examples/demos/Chatbot.md‎

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -52,8 +52,7 @@ import ExpandIcon from '@patternfly/react-icons/dist/esm/icons/expand-icon';
5252
import OpenDrawerRightIcon from '@patternfly/react-icons/dist/esm/icons/open-drawer-right-icon';
5353
import OutlinedWindowRestoreIcon from '@patternfly/react-icons/dist/esm/icons/outlined-window-restore-icon';
5454
import { BarsIcon } from '@patternfly/react-icons/dist/esm/icons/bars-icon';
55-
import { CopyIcon } from '@patternfly/react-icons/dist/esm/icons/copy-icon';
56-
import { WrenchIcon } from '@patternfly/react-icons/dist/esm/icons/wrench-icon';
55+
import { RhUiBuildFillIcon, RhUiCopyFillIcon } from '@patternfly/react-icons';
5756
import {
5857
Button,
5958
DescriptionList,

‎packages/module/src/Message/CodeBlockMessage/CodeBlockMessage.tsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -18,8 +18,8 @@ import {
1818
} from '@patternfly/react-core';
1919

2020
import { CheckIcon } from '@patternfly/react-icons/dist/esm/icons/check-icon';
21-
import { CopyIcon } from '@patternfly/react-icons/dist/esm/icons/copy-icon';
2221
import { css } from '@patternfly/react-styles';
22+
import { RhUiCopyFillIcon } from '@patternfly/react-icons';
2323

2424
export interface CodeBlockMessageProps {
2525
/** Content rendered in code block */
@@ -142,7 +142,7 @@ const CodeBlockMessage = ({
142142
className="pf-chatbot__button--copy"
143143
onClick={(event) => handleCopy(event, children)}
144144
>
145-
{copied ? <CheckIcon /> : <CopyIcon />}
145+
{copied ? <CheckIcon /> : <RhUiCopyFillIcon />}
146146
</Button>
147147
<Tooltip id={tooltipID} content="Copy" position="top" triggerRef={buttonRef} />
148148
</CodeBlockAction>

‎packages/module/src/Message/QuickStarts/QuickStartTileDescription.tsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import type { FC } from 'react';
22
import { useRef } from 'react';
33
import { Button, Flex, pluralize, Popover } from '@patternfly/react-core';
4-
import InfoCircleIcon from '@patternfly/react-icons/dist/js/icons/info-circle-icon';
4+
import { RhMicronsInformationFillIcon } from '@patternfly/react-icons';
55

66
interface QuickStartTileDescriptionProps {
77
/** QuickStart description */
@@ -57,7 +57,7 @@ const QuickStartTileDescription: FC<QuickStartTileDescriptionProps> = ({
5757
}}
5858
aria-label={quickStartButtonAriaLabel}
5959
>
60-
<InfoCircleIcon />
60+
<RhMicronsInformationFillIcon />
6161
</Button>
6262
<Popover
6363
aria-label={pluralizedPrereq}

‎packages/module/src/ResponseActions/ResponseActionButton.test.tsx‎

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,23 +1,23 @@
11
import { render, screen } from '@testing-library/react';
22
import '@testing-library/jest-dom';
33
import userEvent from '@testing-library/user-event';
4-
import { DownloadIcon } from '@patternfly/react-icons';
4+
import { RhUiExportIcon } from '@patternfly/react-icons';
55
import ResponseActionButton from './ResponseActionButton';
66

77
describe('ResponseActionButton', () => {
88
it('renders aria-label correctly if not clicked', () => {
9-
render(<ResponseActionButton icon={<DownloadIcon />} ariaLabel="Download" clickedAriaLabel="Downloaded" />);
9+
render(<ResponseActionButton icon={<RhUiExportIcon />} ariaLabel="Download" clickedAriaLabel="Downloaded" />);
1010
expect(screen.getByRole('button', { name: 'Download' })).toBeTruthy();
1111
});
1212
it('renders aria-label correctly if clicked', () => {
1313
render(
14-
<ResponseActionButton icon={<DownloadIcon />} ariaLabel="Download" clickedAriaLabel="Downloaded" isClicked />
14+
<ResponseActionButton icon={<RhUiExportIcon />} ariaLabel="Download" clickedAriaLabel="Downloaded" isClicked />
1515
);
1616
expect(screen.getByRole('button', { name: 'Downloaded' })).toBeTruthy();
1717
});
1818
it('renders tooltip correctly if not clicked', async () => {
1919
render(
20-
<ResponseActionButton icon={<DownloadIcon />} tooltipContent="Download" clickedTooltipContent="Downloaded" />
20+
<ResponseActionButton icon={<RhUiExportIcon />} tooltipContent="Download" clickedTooltipContent="Downloaded" />
2121
);
2222
expect(screen.getByRole('button', { name: 'Download' })).toBeTruthy();
2323
// clicking here just triggers the tooltip; in this button, the logic is divorced from whether it is actually clicked
@@ -27,7 +27,7 @@ describe('ResponseActionButton', () => {
2727
it('renders tooltip correctly if clicked', async () => {
2828
render(
2929
<ResponseActionButton
30-
icon={<DownloadIcon />}
30+
icon={<RhUiExportIcon />}
3131
tooltipContent="Download"
3232
clickedTooltipContent="Downloaded"
3333
isClicked
@@ -39,13 +39,13 @@ describe('ResponseActionButton', () => {
3939
expect(screen.getByRole('tooltip', { name: 'Downloaded' })).toBeTruthy();
4040
});
4141
it('if clicked variant for tooltip is not supplied, it uses the default', async () => {
42-
render(<ResponseActionButton icon={<DownloadIcon />} tooltipContent="Download" isClicked />);
42+
render(<ResponseActionButton icon={<RhUiExportIcon />} tooltipContent="Download" isClicked />);
4343
// clicking here just triggers the tooltip; in this button, the logic is divorced from whether it is actually clicked
4444
await userEvent.click(screen.getByRole('button', { name: 'Download' }));
4545
expect(screen.getByRole('button', { name: 'Download' })).toBeTruthy();
4646
});
4747
it('if clicked variant for aria label is not supplied, it uses the default', async () => {
48-
render(<ResponseActionButton icon={<DownloadIcon />} ariaLabel="Download" isClicked />);
48+
render(<ResponseActionButton icon={<RhUiExportIcon />} ariaLabel="Download" isClicked />);
4949
expect(screen.getByRole('button', { name: 'Download' })).toBeTruthy();
5050
});
5151
});

0 commit comments

Comments
 (0)