Skip to content

feat(NavExpandable): allow option to pass an icon#12444

Open
logonoff wants to merge 1 commit into
patternfly:mainfrom
logonoff:12443-navexpandable
Open

feat(NavExpandable): allow option to pass an icon#12444
logonoff wants to merge 1 commit into
patternfly:mainfrom
logonoff:12443-navexpandable

Conversation

@logonoff
Copy link
Copy Markdown
Member

@logonoff logonoff commented Jun 4, 2026 •
edited by coderabbitai Bot
Loading

What: Closes #12443

image

Summary by CodeRabbit

  • New Features

    • Expandable navigation items now support an optional icon prop that displays before the title.

  • Tests

    • Added tests for icon rendering behavior in expandable navigation components.

  • Documentation

    • Updated navigation component examples to demonstrate icon usage in expandable sections.

@coderabbitai
Copy link
Copy Markdown

coderabbitai Bot commented Jun 4, 2026 •
edited
Loading

Review Change Stack

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: 410fb558-8676-4c8b-999c-39cf136d1df2

📥 Commits

Reviewing files that changed from the base of the PR and between 4ca2e04 and 73701d2.

📒 Files selected for processing (4)
  • packages/react-core/src/components/Nav/NavExpandable.tsx
  • packages/react-core/src/components/Nav/__tests__/NavExpandable.test.tsx
  • packages/react-core/src/components/Nav/examples/Nav.md
  • packages/react-core/src/components/Nav/examples/NavIcons.tsx

Walkthrough

The PR adds icon support to the NavExpandable component by introducing an optional icon prop that renders before the title. The component implementation, tests validating icon presence and absence, and documentation examples using FolderOpenIcon are updated together.

Changes

NavExpandable Icon Support

Layer / File(s) Summary
Icon prop and rendering
packages/react-core/src/components/Nav/NavExpandable.tsx		 NavExpandableProps adds icon?: React.ReactNode, render() destructures the prop, and the button conditionally renders the icon wrapped in styles.navLinkIcon before the title.
Icon rendering tests
packages/react-core/src/components/Nav/__tests__/NavExpandable.test.tsx		 Two new tests verify the icon element is present and wrapped by .pf-v6-c-nav__link-icon when provided, and absent when not provided.
Documentation and examples
packages/react-core/src/components/Nav/examples/Nav.md, packages/react-core/src/components/Nav/examples/NavIcons.tsx		 Nav.md imports FolderOpenIcon and updates the Drilldown section heading; NavIcons.tsx imports NavExpandable and demonstrates an expandable nav item with icon and nested subnav links.

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~12 minutes

Possibly related issues

  • Issue #12443: Requests icon support for NavExpandable, which is directly addressed by this PR's icon prop implementation and rendering.

Suggested reviewers

  • mcoker
  • edonehoo
  • nicolethoen
🚥 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 pull request title accurately describes the main change: adding an optional icon prop to the NavExpandable component.
Docstring Coverage ✅ Passed No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.
Linked Issues check ✅ Passed Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check ✅ Passed Check skipped because no linked issues were found for this pull request.

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

✨ Finishing Touches
🧪 Generate unit tests (beta)
  • Create PR with unit tests

Warning

Tools execution failed with the following error:

Failed to run tools: 13 INTERNAL: Received RST_STREAM with code 2 (Internal server error)

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.

@patternfly-build
Copy link
Copy Markdown
Collaborator

patternfly-build commented Jun 4, 2026 •
edited
Loading

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

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

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Reviewers

No reviews

Assignees

No one assigned

Labels

None yet

Projects

None yet

Milestone

No milestone

Development

Successfully merging this pull request may close these issues.

NavExpandable - Supprt icon prop like NavItem

2 participants

@logonoff @patternfly-build