fix(sidebar): improve tree item comment layout

apps/desktop/src/lib/__tests__/sidebar/sidebarTreeItemLayout.spec.ts

@@ -0,0 +1,20 @@
+import { describe, expect, it } from "vitest";
+import { trailingCommentAvailableWidth, treeLabelWidthClass, usesFullWidthTreeLabel } from "@/lib/sidebar/sidebarTreeItemLayout";
+
+describe("sidebar tree item layout", () => {
+  it("keeps a table row constrained when it displays a comment", () => {
+    expect(usesFullWidthTreeLabel("table", true)).toBe(true);
+    expect(usesFullWidthTreeLabel("table", true, true)).toBe(false);
+  });
+
+  it("lets a table name consume the available row width before truncating", () => {
+    expect(treeLabelWidthClass({ fullWidth: false, hasTrailingComment: true })).toBe("min-w-0 flex-1 truncate");
+  });
+
+  it("gives the comment only the width left after the full table name and gap", () => {
+    expect(trailingCommentAvailableWidth(260, 100)).toBe(152);
+    expect(trailingCommentAvailableWidth(108, 100)).toBe(0);
+    expect(trailingCommentAvailableWidth(100, 100)).toBe(0);
+    expect(trailingCommentAvailableWidth(99, 100)).toBe(0);
+  });
+});

apps/desktop/src/lib/sidebar/sidebarTreeItemLayout.ts

@@ -54,8 +54,14 @@ export function treeItemPaddingLeft(depth: number): string {
   return `${depth * 16 + 8}px`;
 }
 
-export function usesFullWidthTreeLabel(type: TreeNodeType, allowHorizontalScroll: boolean): boolean {
-  return allowHorizontalScroll && fullWidthLabelTypes.has(type);
+export const trailingCommentGapPx = 8;
+
+export function trailingCommentAvailableWidth(containerWidth: number, leadingWidth: number): number {
+  return Math.max(0, Math.floor(containerWidth - leadingWidth - trailingCommentGapPx));
+}
+
+export function usesFullWidthTreeLabel(type: TreeNodeType, allowHorizontalScroll: boolean, hasTrailingComment = false): boolean {
+  return allowHorizontalScroll && !hasTrailingComment && fullWidthLabelTypes.has(type);
 }
 
 export function treeLabelWidthClass({ fullWidth, hasTrailingComment }: { fullWidth: boolean; hasTrailingComment: boolean }): string {