Skip to content

Conversation

@iamlokanath
Copy link

@iamlokanath iamlokanath commented Jan 28, 2026

Initialize the sidebar collapsed on mobile viewports so that, after login,
users land on the home screen with the sidebar closed by default, while
keeping the existing behavior (open by default) on larger screens.

INJIWEB-1640.mp4

Summary by CodeRabbit

  • New Features
    • The sidebar now automatically collapses when viewing the app on mobile devices, adapting to screen size on page load.

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

@coderabbitai
Copy link

coderabbitai bot commented Jan 28, 2026

Walkthrough

The Sidebar component now intelligently initializes its collapsed state based on viewport width. A mobile breakpoint constant (640px) and initialization function were added, with SSR-safe fallback handling to determine the initial sidebar state during page load.

Changes

Cohort / File(s) Change Summary
Responsive Sidebar Initialization
inji-web/src/components/User/Sidebar.tsx
Added MOBILE_BREAKPOINT_PX constant (640px) and getInitialSidebarCollapsed() function to dynamically set sidebar's initial collapsed state based on viewport width. Function includes SSR-safe window checking to gracefully handle server-side rendering contexts.

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~8 minutes

Poem

🐰 A sidebar so clever, it shrinks with the screen,
On mobile devices, it knows just what's seen,
With a hop and a bound at 640 wide,
It collapses on load, fit snug by your side! 🎯

🚥 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 clearly and specifically describes the main change: fixing the mobile sidebar to default to a closed state after login, which aligns with the PR's objective of initializing the sidebar as collapsed on mobile viewports.
Docstring Coverage ✅ Passed Docstring coverage is 100.00% which is sufficient. The required threshold is 80.00%.

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

✨ Finishing touches
  • 📝 Generate docstrings

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.

@sonarqubecloud
Copy link

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

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant