fix(NavItem): close managed sidebar on mobile item click

[fallmo]

What:
Close a managed Page sidebar on mobile when a nav item is clicked.

Why:
When the viewport width is below the desktop breakpoint, selecting a navigation item should automatically close the sidebar to reveal the main content area. (Ref patternfly/patternfly#8161)

Changes:

• Wire PageContext into the NavItem component.
• Call onSidebarToggle when isManagedSidebar, isMobile, and isSidebarOpen are all true.
• Improve typescript types by using context: NavContextProps instead of context: any.

Summary by CodeRabbit

• Bug Fixes

  • Navigation sidebar now closes reliably on mobile and in managed sidebar contexts when selecting items without flyouts, preventing it from remaining open unexpectedly.

• Refactor

  • Internal navigation handling and context typing improved to make selection and sidebar toggle behavior more consistent and robust.

[coderabbitai]

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: 3511d7d2-efe3-4422-8407-ee7f1977c25f

📥 Commits

Reviewing files that changed from the base of the PR and between 33f7a99 and 7c67fac.

📒 Files selected for processing (1)

• packages/react-core/src/components/Nav/NavItem.tsx

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

• packages/react-core/src/components/Nav/NavItem.tsx

---

Walkthrough

NavItem replaces any context types with NavContextProps, adds a centralized handleNavItemClick to route onSelect and conditionally call PageContext's onSidebarToggle for managed/mobile/open sidebars without flyouts, and consumes isManagedSidebar, isMobile, and onSidebarToggle from PageContext.

Changes

Cohort / File(s)	Summary
NavItem: type & click flow packages/react-core/src/components/Nav/NavItem.tsx	Replaced any with NavContextProps for renderDefaultLink and renderClonedChild. Added handleNavItemClick to centralize onSelect and, when isManagedSidebar && isMobile && isOpen && !hasFlyout, call onSidebarToggle. Updated click wiring to use the new handler and consume PageContext (isManagedSidebar, isMobile, onSidebarToggle).

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~12 minutes

🚥 Pre-merge checks | ✅ 3

✅ Passed checks (3 passed)

Check name	Status	Explanation
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.
Title check	✅ Passed	The title accurately describes the main change: adding functionality to close a managed sidebar when a navigation item is clicked on mobile.
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
• Post copyable unit tests in a comment

---

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

• X
• Mastodon
• Reddit
• LinkedIn

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

[coderabbitai]

Actionable comments posted: 2

🤖 Prompt for all review comments with AI agents

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

Inline comments:
In `@packages/react-core/src/components/Nav/NavItem.tsx`:
- Line 199: The call to context.onSelect in NavItem is unsafe because
NavContextProps.onSelect is optional; update the NavItem component to check for
existence before invoking it (e.g., if (context.onSelect)
context.onSelect(event, groupId, itemId, to, preventLinkDefault, onClick)) so
that context.onSelect is only called when defined; locate the invocation of
context.onSelect in NavItem.tsx and wrap it with a presence check or optional
chaining to avoid runtime errors.
- Around line 201-203: The sidebar auto-close is triggered for flyout parent
items because the handler calls onSidebarToggle when isManagedSidebar &&
isMobile && isSidebarOpen; update that conditional to skip calling
onSidebarToggle for flyout parents by adding a check for !hasFlyout (or
equivalent prop) so that when hasFlyout is true (Component renders as button)
the sidebar does not auto-close; adjust the conditional around onSidebarToggle
in NavItem (referencing isManagedSidebar, isMobile, isSidebarOpen, hasFlyout,
onSidebarToggle, and Component) to only call onSidebarToggle when hasFlyout is
false.

---

ℹ️ Review info

⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro

Run ID: 8a66f0e4-8469-45f3-b3a3-360ef59211bd

📥 Commits

Reviewing files that changed from the base of the PR and between ceee225 and 33f7a99.

📒 Files selected for processing (1)

• packages/react-core/src/components/Nav/NavItem.tsx

[patternfly-build]

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

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