fix(navbar): ensure all primary actions are accessible on small screens

[Hardik301002]

What

• Fixes missing primary navigation actions when the top navbar collapses on small screen sizes

Why

• Important actions were inaccessible on mobile and tablet viewports due to conditional rendering

How

• Updated mobile navbar logic to ensure all primary controls are included in the collapsed menu instead of being hidden

Steps to test

1. Resize viewport to ~700–800px or mobile width
2. Open the navbar overflow (stack) menu
3. Verify all navigation actions are accessible

Summary by CodeRabbit

Bug Fixes

• Fixed navbar to ensure VoIP and Omnichannel controls are now consistently displayed across all device layouts.

_{✏️ Tip: You can customize this high-level summary in your review settings.}

[changeset-bot]

⚠️ No Changeset found

Latest commit: 0228686

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

This PR includes no changesets

When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types

Click here to learn what changesets are, and how to add one.

Click here if you're a maintainer who wants to add a changeset to this PR

[dionisio-bot]

Looks like this PR is not ready to merge, because of the following issues:

• This PR is missing the 'stat: QA assured' label
• This PR is missing the required milestone or project

Please fix the issues and try again

If you have any trouble, please check the PR guidelines

[CLAassistant]

All committers have signed the CLA.

[coderabbitai]

Walkthrough

The PR removes mobile-specific rendering logic from NavBarControlsSection, making Voip and Omnichannel component groups render unconditionally on all layouts when their respective conditions are met, rather than only on specific device sizes.

Changes

Cohort / File(s)	Change Summary
NavBar Controls Rendering apps/meteor/client/navbar/NavBarControls/NavBarControlsSection.tsx	Removed mobile-specific early return; now always renders NavBarSection with unconditional Voip and Omnichannel group inclusion when callAction and showOmnichannel conditions are met

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~8 minutes

Possibly related PRs

• chore: bump fuselage packages #37420 — Modifies the same NavBar component hierarchy (NavBarControlsSection, NavBarOmnichannelGroup, NavBarVoipGroup) with related rendering and feature-gating logic changes.

Suggested reviewers

• tassoevan

Poem

🐰 The navbar hops without a care,
Mobile walls now disappear—
Voip and Omnichannel shine,
On every layout, they align!
Controls that dance on every screen,
The smoothest navbar ever seen! ✨

🚥 Pre-merge checks | ✅ 3

✅ Passed checks (3 passed)

Check name	Status	Explanation
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.
Docstring Coverage	✅ Passed	No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.
Title check	✅ Passed	The title accurately reflects the main change: ensuring primary navigation actions are accessible on small screens by fixing the conditional rendering logic in the navbar component.

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

✨ Finishing touches

• 📝 Generate docstrings

🧪 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.}

[cubic-dev-ai]

No issues found across 1 file

[coderabbitai]

Actionable comments posted: 0

🧹 Nitpick comments (1)

apps/meteor/client/navbar/NavBarControls/NavBarControlsSection.tsx (1)

20-44: Consider refactoring to eliminate code duplication.

The mobile and non-mobile branches duplicate the rendering of NavBarVoipGroup, NavBarOmnichannelGroup, and the workspace/user preferences group. The only difference is the conditional NavBarControlsWithData on mobile.

♻️ Proposed refactor to reduce duplication

-	if (isMobile) {
-	return (
-		<NavBarSection>
-			{callAction && <NavBarVoipGroup />}
-			{showOmnichannel && <NavBarOmnichannelGroup />}
-			{(showOmnichannel || callAction) && <NavBarControlsWithData />}
-			<NavBarGroup aria-label={t('Workspace_and_user_preferences')}>
-				<NavBarItemAdministrationMenu />
-				{user ? <UserMenu user={user} /> : <NavBarItemLoginPage />}
-			</NavBarGroup>
-		</NavBarSection>
-	);
-}
-
-
-	return (
+	return (
 		<NavBarSection>
 			{callAction && <NavBarVoipGroup />}
 			{showOmnichannel && <NavBarOmnichannelGroup />}
+			{isMobile && (showOmnichannel || callAction) && <NavBarControlsWithData />}
 			<NavBarGroup aria-label={t('Workspace_and_user_preferences')}>
 				<NavBarItemAdministrationMenu />
 				{user ? <UserMenu user={user} /> : <NavBarItemLoginPage />}
 			</NavBarGroup>
 		</NavBarSection>
 	);

📜 Review details

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro

Disabled knowledge base sources:

• Jira integration is disabled by default for public repositories

You can enable these sources in your CodeRabbit configuration.

📥 Commits

Reviewing files that changed from the base of the PR and between 05c415b and 0228686.

📒 Files selected for processing (1)

• apps/meteor/client/navbar/NavBarControls/NavBarControlsSection.tsx

🧰 Additional context used

📓 Path-based instructions (1)

**/*.{ts,tsx,js}

📄 CodeRabbit inference engine (.cursor/rules/playwright.mdc)

**/*.{ts,tsx,js}: Write concise, technical TypeScript/JavaScript with accurate typing in Playwright tests
Avoid code comments in the implementation

Files:

• apps/meteor/client/navbar/NavBarControls/NavBarControlsSection.tsx

🔇 Additional comments (1)

apps/meteor/client/navbar/NavBarControls/NavBarControlsSection.tsx (1)

20-32: AI summary incorrectly describes the change.

The AI summary states "Removed mobile-specific early return," but the code still contains an if (isMobile) block. The actual change adds Voip and Omnichannel groups to the mobile view, not removes the conditional rendering.