chore(BarsIcon): Updat all uses of Bars icons to use RhUiMenuBarsIcon instead by tlabaj · Pull Request #12377 · patternfly/patternfly-react · GitHub

What: towards #12244

Summary

Replaces BarsIcon with RhUiMenuBarsIcon (rh-ui-menu-bars-icon) in components, documentation, and the integration demo app so the menu/bars icon uses the Red Hat UI asset.

Changes

Update imports from bars-icon to rh-ui-menu-bars-icon.
Replace BarsIcon with RhUiMenuBarsIcon in affected examples and demos.

Scope

react-core: MenuWithActions, MenuWithFavorites, ActionsMenuDemo, and shared doc imports in related .md files (Page, Masthead, Nav, CustomMenus, NotificationDrawer, RTL, Wizard, and related demos).
react-table: Table.md shared imports.
react-integration: MenuDemo.tsx.

Summary by CodeRabbit

Documentation
- Updated examples and demo docs across the library to use the new menu‑bars icon for consistent visuals and demos.
Chores
- Replaced legacy menu‑bars icon references in numerous examples and demos to align icon usage across components.

Closes #12397

Note

Reviews paused

It looks like this branch is under active development. To avoid overwhelming you with review comments due to an influx of new commits, CodeRabbit has automatically paused this review. You can configure this behavior by changing the reviews.auto_review.auto_pause_after_reviewed_commits setting.

Use the following commands to manage reviews:

@coderabbitai resume to resume automatic reviews.
@coderabbitai review to trigger a single review.

Use the checkboxes below for quick actions:

▶️ Resume reviews
🔍 Trigger review

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info ⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro

Run ID: f622bdcc-8377-416f-ba55-a7e61430ab2c

📥 Commits

Reviewing files that changed from the base of the PR and between ac6b113 and 52b349d.

📒 Files selected for processing (15)

packages/react-core/src/components/Masthead/examples/Masthead.md
packages/react-core/src/components/Menu/examples/Menu.md
packages/react-core/src/components/Menu/examples/MenuWithActions.tsx
packages/react-core/src/components/Menu/examples/MenuWithFavorites.tsx
packages/react-core/src/components/Page/examples/Page.md
packages/react-core/src/demos/CustomMenus/CustomMenus.md
packages/react-core/src/demos/CustomMenus/examples/ActionsMenuDemo.tsx
packages/react-core/src/demos/Masthead.md
packages/react-core/src/demos/Nav.md
packages/react-core/src/demos/NotificationDrawer/NotificationDrawer.md
packages/react-core/src/demos/Page.md
packages/react-core/src/demos/RTL/RTL.md
packages/react-core/src/demos/Wizard/WizardDemo.md
packages/react-integration/demo-app-ts/src/components/demos/MenuDemo/MenuDemo.tsx
packages/react-table/src/demos/Table.md

✅ Files skipped from review due to trivial changes (11)

packages/react-core/src/components/Masthead/examples/Masthead.md
packages/react-core/src/demos/CustomMenus/CustomMenus.md
packages/react-core/src/components/Menu/examples/MenuWithActions.tsx
packages/react-core/src/demos/NotificationDrawer/NotificationDrawer.md
packages/react-core/src/components/Page/examples/Page.md
packages/react-table/src/demos/Table.md
packages/react-core/src/demos/RTL/RTL.md
packages/react-core/src/components/Menu/examples/Menu.md
packages/react-core/src/demos/Page.md
packages/react-core/src/demos/CustomMenus/examples/ActionsMenuDemo.tsx
packages/react-core/src/demos/Masthead.md

🚧 Files skipped from review as they are similar to previous changes (4)

packages/react-core/src/demos/Nav.md
packages/react-core/src/demos/Wizard/WizardDemo.md
packages/react-integration/demo-app-ts/src/components/demos/MenuDemo/MenuDemo.tsx
packages/react-core/src/components/Menu/examples/MenuWithFavorites.tsx

Walkthrough

Replaces imports and JSX usages of BarsIcon with RhUiMenuBarsIcon across example, demo, markdown, and integration files. No API, runtime behavior, or exported/public entity changes.

Changes

Icon replacement: BarsIcon → RhUiMenuBarsIcon

Layer / File(s)	Summary
Imports updated packages/react-core/.../.md, packages/react-core/.../.tsx, packages/react-integration/.../MenuDemo.tsx, packages/react-table/src/demos/Table.md	Replaced imports from @patternfly/react-icons/.../bars-icon with @patternfly/react-icons/.../rh-ui-menu-bars-icon and the identifier RhUiMenuBarsIcon (range_055500bb90ed, range_5bf3c23de12f, range_4717d4f89486, range_dafafb141326, range_68d0b3f89bff, range_f148ba372e9e, range_fcd839d6634b, range_bd418b1910d0, range_4ad532a5ceff, range_7070d58bbd0b, range_3758b8641d74, range_75eeaf8c460c, range_8cc0137b1515, range_7b3b316ddbbe, range_c9f1769ed4f4).
Component usage updates packages/react-core/src/components/Menu/examples/*, packages/react-core/src/demos/CustomMenus/examples/ActionsMenuDemo.tsx, packages/react-integration/demo-app-ts/src/components/demos/MenuDemo/MenuDemo.tsx	JSX previously rendering <BarsIcon /> now renders <RhUiMenuBarsIcon /> (e.g., MenuItemAction, menu action props) (range_5faffa2918e4, range_82f67bb00c39, range_50570eaa1e0c, range_7e4c929a0a79, range_331d21d54b73).

Sequence Diagram(s)

(omitted — edits are import/usage replacements without multi-component control flow)

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~10 minutes

Possibly related issues

Replace legacy navigation, action, and status icons with RH brand icons #12402 — similar objective: swap BarsIcon imports to RhUiMenuBarsIcon across examples/demos.
Replace legacy layout, brand, and miscellaneous icons with RH brand icons #12401 — related effort to replace legacy BarsIcon usages with RH-branded rh-ui icons.

Suggested reviewers

phcox
nicolethoen
kmcfaul

🚥 Pre-merge checks | ✅ 5 ✅ Passed checks (5 passed)

Check name	Status	Explanation
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.
Title check	✅ Passed	The title references the main change (updating BarsIcon to RhUiMenuBarsIcon) but contains a typo ('Updat' instead of 'Update') and is somewhat generic with 'all uses'.
Linked Issues check	✅ Passed	All BarsIcon imports have been replaced with RhUiMenuBarsIcon across components and documentation as required by issue #12397. The changes address all acceptance criteria for replacing imports.
Out of Scope Changes check	✅ Passed	All changes are scoped to replacing BarsIcon with RhUiMenuBarsIcon in imports and usage, with no unrelated modifications introduced to the codebase.
Docstring Coverage	✅ Passed	No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.

✏️ Tip: You can configure your own custom pre-merge checks in the settings.

✨ Finishing Touches 🧪 Generate unit tests (beta)

Create PR with unit tests

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

Comment @coderabbitai help to get the list of available commands and usage tips.

🧹 Nitpick comments (1)

packages/react-core/src/demos/NotificationDrawer/NotificationDrawer.md (1)
10-10: Change line 10 to use dist/esm for consistency with other imports in this file.

All other icon imports in NotificationDrawer.md use dist/esm; line 10's dist/js import creates unnecessary inconsistency.
🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed.

In `@packages/react-core/src/demos/NotificationDrawer/NotificationDrawer.md` at
line 10, Update the import for RhUiMenuBarsIcon to match the other icon imports
by changing the module path from
'@patternfly/react-icons/dist/js/icons/rh-ui-menu-bars-icon' to the esm build,
i.e. import RhUiMenuBarsIcon from
'@patternfly/react-icons/dist/esm/icons/rh-ui-menu-bars-icon'; this keeps the
NotificationDrawer.md imports consistent with the rest of the file.

🤖 Prompt for all review comments with AI agents

Verify each finding against the current code and only fix it if needed.

Nitpick comments:
In `@packages/react-core/src/demos/NotificationDrawer/NotificationDrawer.md`:
- Line 10: Update the import for RhUiMenuBarsIcon to match the other icon
imports by changing the module path from
'@patternfly/react-icons/dist/js/icons/rh-ui-menu-bars-icon' to the esm build,
i.e. import RhUiMenuBarsIcon from
'@patternfly/react-icons/dist/esm/icons/rh-ui-menu-bars-icon'; this keeps the
NotificationDrawer.md imports consistent with the rest of the file.

ℹ️ Review info ⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro

Run ID: 32b2fb26-83c4-46db-8e06-f6152a9e50f3

📥 Commits

Reviewing files that changed from the base of the PR and between 69b6225 and 0252229.

📒 Files selected for processing (15)

packages/react-core/src/components/Masthead/examples/Masthead.md
packages/react-core/src/components/Menu/examples/Menu.md
packages/react-core/src/components/Menu/examples/MenuWithActions.tsx
packages/react-core/src/components/Menu/examples/MenuWithFavorites.tsx
packages/react-core/src/components/Page/examples/Page.md
packages/react-core/src/demos/CustomMenus/CustomMenus.md
packages/react-core/src/demos/CustomMenus/examples/ActionsMenuDemo.tsx
packages/react-core/src/demos/Masthead.md
packages/react-core/src/demos/Nav.md
packages/react-core/src/demos/NotificationDrawer/NotificationDrawer.md
packages/react-core/src/demos/Page.md
packages/react-core/src/demos/RTL/RTL.md
packages/react-core/src/demos/Wizard/WizardDemo.md
packages/react-integration/demo-app-ts/src/components/demos/MenuDemo/MenuDemo.tsx
packages/react-table/src/demos/Table.md

Preview: https://pf-react-pr-12377.surge.sh

A11y report: https://pf-react-pr-12377-a11y.surge.sh

… instead

Your changes have been released in:

@patternfly/react-code-editor@6.6.0-prerelease.3
@patternfly/react-core@6.6.0-prerelease.2
@patternfly/react-docs@7.6.0-prerelease.3
@patternfly/react-drag-drop@6.6.0-prerelease.2
@patternfly/react-integration@6.5.0-prerelease.20
demo-app-ts@6.5.0-prerelease.112
@patternfly/react-table@6.6.0-prerelease.2
@patternfly/react-templates@6.6.0-prerelease.2

Thanks for your contribution! 🎉

tlabaj requested review from a team, lboehling, phcox, thatblindgeye and wise-king-sullyman and removed request for a team April 24, 2026 18:41

tlabaj added the Needs design review label Apr 24, 2026

coderabbitai Bot reviewed Apr 24, 2026

View reviewed changes

thatblindgeye approved these changes Apr 24, 2026

View reviewed changes

tlabaj linked an issue Apr 24, 2026 that may be closed by this pull request

Update icons to RH brand icons [react] — completed migrations #12244

Closed

nicolethoen mentioned this pull request Apr 30, 2026

Replace BarsIcon with RhUiMenuBarsIcon #12397

Closed

3 tasks

nicolethoen linked an issue Apr 30, 2026 that may be closed by this pull request

Replace BarsIcon with RhUiMenuBarsIcon #12397

Closed

3 tasks

nicolethoen removed a link to an issue Apr 30, 2026

Update icons to RH brand icons [react] — completed migrations #12244

Closed

tlabaj force-pushed the bars_icon branch 2 times, most recently from 597742b to 344396b Compare May 5, 2026 19:28

wise-king-sullyman approved these changes May 5, 2026

View reviewed changes

tlabaj added 2 commits May 18, 2026 13:04

chore(BarsIcon): Updat all uses of Bars icons to use RhUiMenuBarsIcon…

44554cb

… instead

fix rebase issue

52b349d

thatblindgeye force-pushed the bars_icon branch from ac6b113 to 52b349d Compare May 18, 2026 17:08

kmcfaul approved these changes Jun 10, 2026

View reviewed changes

kmcfaul merged commit 6aa4cc6 into patternfly:main Jun 10, 2026
14 checks passed

This was referenced Jun 16, 2026

Replace legacy editor, calendar, and people icons with RH brand icons #12400

Closed

Replace legacy layout, brand, and miscellaneous icons with RH brand icons #12401

Closed

coderabbitai Bot mentioned this pull request Jun 29, 2026

Replace legacy infrastructure and file icons with RH brand icons #12399

Closed

26 tasks

mirekdlugosz mentioned this pull request Aug 5, 2026

build: update various dependencies quipucords/quipucords-ui#1000

Merged

chore(BarsIcon): Updat all uses of Bars icons to use RhUiMenuBarsIcon instead by tlabaj · Pull Request #12377 · patternfly/patternfly-react · GitHub

Uh oh!

chore(BarsIcon): Updat all uses of Bars icons to use RhUiMenuBarsIcon instead - #12377

chore(BarsIcon): Updat all uses of Bars icons to use RhUiMenuBarsIcon instead#12377
kmcfaul merged 2 commits into
patternfly:mainfrom
tlabaj:bars_icon

tlabaj commented Apr 24, 2026 •
edited by coderabbitai Bot
Loading

Uh oh!

Uh oh!

coderabbitai Bot commented Apr 24, 2026 •
edited
Loading

Uh oh!

Uh oh!

coderabbitai Bot left a comment

Uh oh!

patternfly-build commented Apr 24, 2026 •
edited
Loading

Uh oh!

Uh oh!

Uh oh!

patternfly-build commented Jun 10, 2026

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

5 participants

chore(BarsIcon): Updat all uses of Bars icons to use RhUiMenuBarsIcon instead by tlabaj · Pull Request #12377 · patternfly/patternfly-react · GitHub

Uh oh!

chore(BarsIcon): Updat all uses of Bars icons to use RhUiMenuBarsIcon instead - #12377

chore(BarsIcon): Updat all uses of Bars icons to use RhUiMenuBarsIcon instead#12377kmcfaul merged 2 commits intopatternfly:mainpatternfly/patternfly-react:mainfrom tlabaj:bars_icontlabaj/patternfly-react:bars_iconCopy head branch name to clipboard

Conversation

tlabaj commented Apr 24, 2026 • edited by coderabbitai Bot Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Summary

Changes

Scope

Summary by CodeRabbit

Uh oh!

coderabbitai Bot commented Apr 24, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Reviews paused

Walkthrough

Changes

Sequence Diagram(s)

Estimated code review effort

Possibly related issues

Suggested reviewers

Uh oh!

coderabbitai Bot left a comment

Choose a reason for hiding this comment

Uh oh!

patternfly-build commented Apr 24, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

Uh oh!

patternfly-build commented Jun 10, 2026

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

5 participants

chore(BarsIcon): Updat all uses of Bars icons to use RhUiMenuBarsIcon instead#12377
kmcfaul merged 2 commits into
patternfly:mainfrom
tlabaj:bars_icon

tlabaj commented Apr 24, 2026 •
edited by coderabbitai Bot
Loading

coderabbitai Bot commented Apr 24, 2026 •
edited
Loading

patternfly-build commented Apr 24, 2026 •
edited
Loading