diff --git a/src/app/(dashboard)/inbox/page.tsx b/src/app/(dashboard)/inbox/page.tsx index ab50293..21143a2 100644 --- a/src/app/(dashboard)/inbox/page.tsx +++ b/src/app/(dashboard)/inbox/page.tsx @@ -530,10 +530,16 @@ export default function InboxPage() { {/* Center panel: Message thread. Hidden on mobile when no conversation is selected so the list can occupy the full width. Always visible on lg+ - (shows its own empty-state if no thread is picked yet). */} + (shows its own empty-state if no thread is picked yet). + + `min-w-0` is load-bearing: without it, a single wide piece + of content inside the thread (long quote preview, very + long URL in a message body) forces the flex child past + its share and pushes the contact-sidebar panel off-screen + on the right. Issue #165. */}
diff --git a/src/components/inbox/message-actions.tsx b/src/components/inbox/message-actions.tsx index bd63f6f..4e23ecf 100644 --- a/src/components/inbox/message-actions.tsx +++ b/src/components/inbox/message-actions.tsx @@ -85,7 +85,12 @@ export function MessageActions({ onContextMenu={handleContextMenu} onBlur={() => setTouchOpen(false)} > -
+ {/* `min-w-0` lets this flex child actually respect the 75% cap. + * Default `min-width: auto` lets content (a long quote preview, + * an unbroken URL) push past the cap and shove the row past + * 100%, which used to bleed across into the contact-sidebar + * area. See issue #165. */} +
{children}
-
+
{authorLabel}
-
{preview}
+ {/* Wrap the preview instead of truncating to a single line. + * `truncate` (white-space: nowrap) forced the quote onto one + * impossibly-wide line and — because the parent flex chain + * lacked `min-w-0` at every step — pushed the entire inbox + * layout wider, shoving the contact sidebar off-screen. + * `break-words` also wraps long URLs that have no whitespace + * to break on. Issue #165. */} +
+ {preview} +
{onDismiss && (