LaLeV/wacrm
1
0
Fork 0
mirror of https://github.com/Luchexx/wacrm.git synced 2026-11-02 09:19:51 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Merge pull request #166 from ArnasDon/fix/reply-quote-overflow

Browse Source 
fix(inbox): reply quote no longer overflows or single-lines (#165)
This commit is contained in:
Arnas Donauskas 2026-05-31 11:31:10 +02:00 committed by GitHub
commit c7ea1af684
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
3 changed files with 25 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
src/app/(dashboard)/inbox/page.tsx
View File

@ -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. */}
<div
className={cn(
"flex h-full flex-1 lg:flex",
"flex h-full min-w-0 flex-1 lg:flex",
hasActiveConv ? "flex" : "hidden lg:flex",
)}
>

7
src/components/inbox/message-actions.tsx
View File

@ -85,7 +85,12 @@ export function MessageActions({
onContextMenu={handleContextMenu}
onBlur={() => setTouchOpen(false)}
>
<div className="group/actions relative max-w-[75%]">
{/* `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. */}
<div className="group/actions relative min-w-0 max-w-[75%]">
{children}
<div
data-touch-open={touchOpen || pickerOpen ? "true" : undefined}

13
src/components/inbox/reply-quote.tsx
View File

@ -31,11 +31,20 @@ export function ReplyQuote({
: "mb-1.5 rounded-md bg-black/20",
)}
>
<div className="min-w-0 flex-1">
<div className="min-w-0 flex-1 overflow-hidden">
<div className="truncate text-[11px] font-medium text-primary">
{authorLabel}
</div>
<div className="truncate text-xs text-slate-200/80">{preview}</div>
{/* 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. */}
<div className="whitespace-pre-wrap break-words text-xs text-slate-200/80">
{preview}
</div>
</div>
{onDismiss && (
<button