[GIT-57 | WEB-5912] fix: app sidebar ux and responsiveness

[anmolsinghbhatia]

Description

This PR fixes app sidebar ux and mobile responsiveness.

Type of Change

• Bug fix
• Improvement (change that would cause existing functionality to not work as expected)

Summary by CodeRabbit

Release Notes

• Bug Fixes
  • Improved sidebar behavior when navigating between projects—the extended sidebar now properly closes on navigation
  • Enhanced accordion mode navigation to prevent unexpected sidebar state changes
  • Refined mobile sidebar interaction handling

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

[makeplane]

Linked to Plane Work Item(s)

References

• [GIT-57] [bug]: Sidebar closes when interacting with tree branch on touch device
• [WEB-5912] UX issue in Project navigation - accordion navigation not working on click redirect

This comment was auto-generated by Plane

[coderabbitai]

📝 Walkthrough

Walkthrough

These changes refine sidebar navigation behavior by adding mobile-specific click prevention to the resizable sidebar, extending the project navigation component to manage the extended sidebar state, and refining projects list item click handling to respect accordion mode.

Changes

Cohort / File(s)	Summary
Sidebar Navigation Components apps/web/core/components/sidebar/resizable-sidebar.tsx, apps/web/core/components/workspace/sidebar/project-navigation.tsx, apps/web/core/components/workspace/sidebar/projects-list-item.tsx	Added mobile-specific click prevention data attribute to resizable sidebar. Extended project navigation to close extended sidebar on item click via useAppTheme hook. Refined projects list item to respect accordion mode when determining whether to close extended sidebar on click.

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~12 minutes

Poem

🐰 A sidebar so clever, refined and so spry,
Mobile clicks prevented, accordion mode held high,
Extended drawers closing with elegant grace,
Navigation flows smoother through each workspace space!

🚥 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 reflects the main changes: improvements to app sidebar UX and responsive behavior across multiple sidebar components.
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 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

• X
• Mastodon
• Reddit
• LinkedIn

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

[Copilot]

Pull request overview

This PR fixes app sidebar UX issues and improves mobile responsiveness by ensuring the extended project sidebar is properly closed in accordion mode and when navigating to project items.

Changes:

• Modified sidebar behavior to prevent extended sidebar from closing in accordion mode when clicking project items
• Added logic to close extended sidebar when navigating within project items
• Added mobile-specific attribute to prevent outside click handling on the resizable sidebar

Reviewed changes

Copilot reviewed 3 out of 3 changed files in this pull request and generated no comments.

File	Description
apps/web/core/components/workspace/sidebar/projects-list-item.tsx	Moved isAccordionMode variable declaration earlier and added condition to prevent closing extended sidebar in accordion mode
apps/web/core/components/workspace/sidebar/project-navigation.tsx	Added logic to close extended sidebar when clicking navigation items
apps/web/core/components/sidebar/resizable-sidebar.tsx	Added data-prevent-outside-click attribute for mobile devices

---

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.