UI Bug: Long organization names break sidebar layout and text descenders are clipped #5286

To Reproduce

1. Set up a Dokploy instance and navigate to the dashboard.
2. Create or rename an organization with a very long name (e.g., "My Production Workspace").
3. Look at the organization selector in the top-left of the sidebar.
4. Observe that the text wraps to multiple lines and breaks the layout.

Current vs. Expected behavior

Following the steps from the previous section, I expected the organization name to truncate smoothly with a single-line ellipsis (...) if it exceeds the sidebar width, and for the letters to display fully without clipping. Instead, I observed that long organization names break the layout by wrapping to multiple lines awkwardly, and when using text truncation, the bottom descenders of the letters are visibly sliced off.

Provide environment information

Operating System: Ubuntu 24
Dokploy version: 0.30.5
VPS Provider: AWS EC2 (c8a.4xl)

Which area(s) are affected?

Dashboard/Sidebar

Additional context

This is purely a UI styling issue in apps/dokploy/components/layouts/side.tsx.

The layout structure in the organization selector trigger needs Flexbox constraints (min-w-0 and flex-1) so the child can properly apply truncate. Additionally, the leading-none class needs to be removed from the <p> tag because leading-none combined with overflow: hidden (from truncate) causes descenders to fall outside the bounding box and get clipped.

The exact changes required to fix this in side.tsx are:

1. Wrap the text in min-w-0 and flex-1.
2. Remove the leading-none class.

// Before:
<div className="flex items-center gap-1.5 min-w-0 w-full">
  <p className="text-sm font-medium leading-none">

// After:
<div className="flex items-center gap-1.5 min-w-0 w-full">
  <p className="text-sm font-medium truncate">

Will you send a PR to fix it?

Yes