Skip to content

3979 collapsed sidebar state has usability and visual issues#4012

Merged
Siumauricio merged 3 commits intocanaryfrom
3979-collapsed-sidebar-state-has-usability-and-visual-issues
Mar 16, 2026
Merged

3979 collapsed sidebar state has usability and visual issues#4012
Siumauricio merged 3 commits intocanaryfrom
3979-collapsed-sidebar-state-has-usability-and-visual-issues

Conversation

@Siumauricio
Copy link
Copy Markdown
Contributor

@Siumauricio Siumauricio commented Mar 16, 2026

What is this PR about?

Please describe in a short paragraph what this PR is about.

Checklist

Before submitting this PR, please make sure that:

Issues related (if applicable)

closes #3979

Screenshots (if applicable)

Greptile Summary

This PR fixes collapsed sidebar usability and visual issues (#3979) through several focused changes:

  • Sidebar collapse logic: Introduces an isCollapsed variable (state === "collapsed" && !isMobile) in SidebarLogo to prevent collapsed-state styles from applying on mobile, where the sidebar is a full-width sheet overlay rather than a narrow icon strip.
  • TimeBadge centralization: Moves TimeBadge from an absolute-positioned element in the Projects page into the shared BreadcrumbSidebar component, ensuring consistent placement across all project-related pages.
  • Overflow fix: Changes SidebarContent from overflow-hidden to overflow-y-auto when collapsed, allowing users to scroll through sidebar items that exceed the available height.
  • Version display simplification: Removes the collapsed-state version label variant in the sidebar footer, hiding version info entirely when collapsed to reduce clutter.
  • Cleanup note: The TimeBadge import and isCloud query in show.tsx are now unused and should be removed.

Confidence Score: 4/5

  • This PR is safe to merge — it consists of UI/styling fixes with no backend or data changes.
  • All changes are cosmetic/UX improvements with correct logic. The only issue is minor dead code (unused import/query in show.tsx) that won't cause runtime errors but may trigger lint warnings.
  • apps/dokploy/components/dashboard/projects/show.tsx has unused TimeBadge import and isCloud query that should be cleaned up.

Comments Outside Diff (1)

  1. apps/dokploy/components/dashboard/projects/show.tsx, line 52 (link)

    Unused import left behind after refactor

    TimeBadge is still imported here but is no longer used in this component — it was moved into BreadcrumbSidebar. This will likely trigger a lint/build warning. Similarly, the isCloud query on line 61 is now dead code since the only consumer was the removed TimeBadge block.

Last reviewed commit: 4871520

- Replaced direct state checks with a derived variable `isCollapsed` for better readability and maintainability.
- Updated class names and conditions in the SidebarLogo component to use the new `isCollapsed` variable.
- Adjusted overflow behavior in Sidebar and SidebarContent components for improved layout management.
- Removed TimeBadge from the ShowProjects component and integrated it into the BreadcrumbSidebar.
- Added a query to determine if the environment is cloud-based, allowing for conditional display of the TimeBadge.
- Updated layout in BreadcrumbSidebar for improved spacing and organization.
@Siumauricio Siumauricio linked an issue Mar 16, 2026 that may be closed by this pull request
@dosubot dosubot Bot added the size:M This PR changes 30-99 lines, ignoring generated files. label Mar 16, 2026
@Siumauricio Siumauricio merged commit baaa470 into canary Mar 16, 2026
4 checks passed
@Siumauricio Siumauricio deleted the 3979-collapsed-sidebar-state-has-usability-and-visual-issues branch March 16, 2026 21:34
@dosubot dosubot Bot added the pr-open label Mar 16, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

pr-open size:M This PR changes 30-99 lines, ignoring generated files.

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Collapsed sidebar state has usability and visual issues

1 participant