From 95d44a25b98320959cacbe844a67d44e4352390f Mon Sep 17 00:00:00 2001 From: kenny lopez Date: Tue, 18 Aug 2026 16:03:01 +0100 Subject: [PATCH] Keep conversation styles within file limits Signed-off-by: kenny lopez --- desktop/src/features/home/ui/HomeView.tsx | 5 +-- .../messages/ui/MessageThreadPanel.tsx | 3 +- .../messages/ui/useMentionSendFlow.ts | 13 ++---- desktop/src/shared/styles/globals.css | 1 + .../shared/styles/globals/conversation.css | 40 +++++++++++++++++ desktop/src/shared/styles/globals/theme.css | 44 ------------------- 6 files changed, 47 insertions(+), 59 deletions(-) create mode 100644 desktop/src/shared/styles/globals/conversation.css diff --git a/desktop/src/features/home/ui/HomeView.tsx b/desktop/src/features/home/ui/HomeView.tsx index 02a247c841..6b59683c69 100644 --- a/desktop/src/features/home/ui/HomeView.tsx +++ b/desktop/src/features/home/ui/HomeView.tsx @@ -111,9 +111,8 @@ export function HomeView({ homeInboxWidthPx < INBOX_SINGLE_COLUMN_BREAKPOINT_PX; const [filter, setFilter] = React.useState("all"); const [unreadOnly, setUnreadOnly] = React.useState(false); - // Explicit selections are mirrored to `?item=`, so navigation and reloads - // restore the detail pane. Default/automatic selection stays local-only — - // background data loads must never trigger navigations. + // Explicit selections mirror to `?item=` for navigation and reloads; default + // selection stays local so background data never triggers navigation. const { applyPatch: applyInboxSearchPatch, values: inboxSearchValues } = useHistorySearchState(INBOX_SEARCH_KEYS); const isReminders = filter === "reminders"; diff --git a/desktop/src/features/messages/ui/MessageThreadPanel.tsx b/desktop/src/features/messages/ui/MessageThreadPanel.tsx index 544f2dc27f..8841ecaecb 100644 --- a/desktop/src/features/messages/ui/MessageThreadPanel.tsx +++ b/desktop/src/features/messages/ui/MessageThreadPanel.tsx @@ -258,8 +258,7 @@ export function MessageThreadPanel({ !isHuddleTranscript && (isOverlay || isSinglePanelView || isFocusMode), ); const hasConstrainedColumn = columnMaxWidthPx != null; - // Whether the composer dock trades its quiet-state spacer for the - // conditional activity accessory (agent working and/or someone typing). + // Whether the dock trades its spacer for agent or typing activity. const hasComposerBottomActivity = activityAccessoryVisible || threadTypingPubkeys.length > 0; diff --git a/desktop/src/features/messages/ui/useMentionSendFlow.ts b/desktop/src/features/messages/ui/useMentionSendFlow.ts index 6f1ef3e25d..d7a004c1a8 100644 --- a/desktop/src/features/messages/ui/useMentionSendFlow.ts +++ b/desktop/src/features/messages/ui/useMentionSendFlow.ts @@ -43,7 +43,7 @@ import { mergeOutgoingTagsWithReferenceMentions, type PendingNonMemberMentionSend, type SendMessageWithMentionFlowInput, - resolvePreviewTags, + resolvePreviewTags as previewTags, uniqueNormalizedPubkeys, } from "./useMentionSendFlow.helpers"; type UseMentionSendFlowOptions = { @@ -444,7 +444,6 @@ export function useMentionSendFlow({ return; } } - const agentReadiness = await ensureManagedAgentMentionsReady( managedMentionPubkeys.filter( (pubkey) => !readyAgentPubkeys.has(normalizePubkey(pubkey)), @@ -543,20 +542,14 @@ export function useMentionSendFlow({ restoreQueuedAttachments(withoutMedia ? [] : draft.queuedAttachments); mentions.restoreDraftMentionRefs(draft.savedMentionRefs); setSpoileredAttachmentUrls?.( - withoutMedia - ? new Set() - : new Set(draft.savedSpoileredAttachmentUrls), + new Set(withoutMedia ? [] : draft.savedSpoileredAttachmentUrls), ); }; const finishSend = async ( uploaded: ImetaMedia[], signal?: AbortSignal, ) => { - const textTags = await resolvePreviewTags( - draft, - undefined, - outgoingTags, - ); + const textTags = await previewTags(draft, undefined, outgoingTags); if (!textTags || signal?.aborted || isSendCancelled()) return; const parts = buildOutgoingMessageParts({ body: draft.trimmed, diff --git a/desktop/src/shared/styles/globals.css b/desktop/src/shared/styles/globals.css index 0d5a103219..e6bdb8f562 100644 --- a/desktop/src/shared/styles/globals.css +++ b/desktop/src/shared/styles/globals.css @@ -7,6 +7,7 @@ @import "./globals/composer.css"; @import "./globals/markdown.css"; @import "./globals/theme.css"; +@import "./globals/conversation.css"; @import "./globals/skeleton.css"; @import "./globals/spoilers.css"; @import "./globals/components.css"; diff --git a/desktop/src/shared/styles/globals/conversation.css b/desktop/src/shared/styles/globals/conversation.css new file mode 100644 index 0000000000..96b13e4e4d --- /dev/null +++ b/desktop/src/shared/styles/globals/conversation.css @@ -0,0 +1,40 @@ +@layer base { + :root { + /* Font preferences and Cmd +/- scale type without resizing rem-based UI. */ + --buzz-type-rem: 1rem; + --text-xs: calc(var(--buzz-type-rem) * 0.75); + --text-sm: calc(var(--buzz-type-rem) * 0.875); + --text-base: var(--buzz-type-rem); + --text-lg: calc(var(--buzz-type-rem) * 1.125); + --text-xl: calc(var(--buzz-type-rem) * 1.25); + --text-2xl: calc(var(--buzz-type-rem) * 1.5); + --text-3xl: calc(var(--buzz-type-rem) * 1.875); + --text-4xl: calc(var(--buzz-type-rem) * 2.25); + --text-5xl: calc(var(--buzz-type-rem) * 3); + --text-6xl: calc(var(--buzz-type-rem) * 3.75); + /* Font size changes type only; conversation density changes spacing. */ + --conversation-message-font-size: calc(var(--buzz-type-rem) * 0.875); + --conversation-message-line-height: calc(var(--buzz-type-rem) * 1.25); + --conversation-author-line-height: var(--buzz-type-rem); + --conversation-body-gap: 0.125rem; + --conversation-row-padding-block: 0.375rem; + --conversation-paragraph-gap: 0.5rem; + --conversation-list-item-gap: 0.375rem; + --conversation-timestamp-font-size: calc(var(--buzz-type-rem) * 0.75); + --conversation-timestamp-line-height: var(--buzz-type-rem); + } + + :root[data-conversation-density="compact"] { + --conversation-body-gap: 0rem; + --conversation-row-padding-block: 0.25rem; + --conversation-paragraph-gap: 0.375rem; + --conversation-list-item-gap: 0.25rem; + } + + :root[data-conversation-density="spacious"] { + --conversation-body-gap: 0.25rem; + --conversation-row-padding-block: 0.5rem; + --conversation-paragraph-gap: 0.625rem; + --conversation-list-item-gap: 0.5rem; + } +} diff --git a/desktop/src/shared/styles/globals/theme.css b/desktop/src/shared/styles/globals/theme.css index 12f68f5750..e33f5edffd 100644 --- a/desktop/src/shared/styles/globals/theme.css +++ b/desktop/src/shared/styles/globals/theme.css @@ -2,36 +2,6 @@ :root { /* Catppuccin Latte (mauve accent) */ --radius: 0.625rem; - /* - * A virtual typography rem. Font preferences and Cmd +/- change this - * token while the browser root remains 16px, so text scales without also - * resizing rem-based widths, gaps, radii, and controls. - */ - --buzz-type-rem: 1rem; - --text-xs: calc(var(--buzz-type-rem) * 0.75); - --text-sm: calc(var(--buzz-type-rem) * 0.875); - --text-base: var(--buzz-type-rem); - --text-lg: calc(var(--buzz-type-rem) * 1.125); - --text-xl: calc(var(--buzz-type-rem) * 1.25); - --text-2xl: calc(var(--buzz-type-rem) * 1.5); - --text-3xl: calc(var(--buzz-type-rem) * 1.875); - --text-4xl: calc(var(--buzz-type-rem) * 2.25); - --text-5xl: calc(var(--buzz-type-rem) * 3); - --text-6xl: calc(var(--buzz-type-rem) * 3.75); - /* - * Default conversation type and comfy spacing for channels, DMs, threads, - * Inbox, and the composer. Font size changes the type tokens only; - * Conversation density overrides only spacing. - */ - --conversation-message-font-size: calc(var(--buzz-type-rem) * 0.875); - --conversation-message-line-height: calc(var(--buzz-type-rem) * 1.25); - --conversation-author-line-height: var(--buzz-type-rem); - --conversation-body-gap: 0.125rem; - --conversation-row-padding-block: 0.375rem; - --conversation-paragraph-gap: 0.5rem; - --conversation-list-item-gap: 0.375rem; - --conversation-timestamp-font-size: calc(var(--buzz-type-rem) * 0.75); - --conversation-timestamp-line-height: var(--buzz-type-rem); --background: 220 23.08% 94.9%; --foreground: 234 16.02% 35.49%; --card: 220 23.08% 94.9%; @@ -95,20 +65,6 @@ --buzz-hosted-community-identity-bg: 255 255 255; } - :root[data-conversation-density="compact"] { - --conversation-body-gap: 0rem; - --conversation-row-padding-block: 0.25rem; - --conversation-paragraph-gap: 0.375rem; - --conversation-list-item-gap: 0.25rem; - } - - :root[data-conversation-density="spacious"] { - --conversation-body-gap: 0.25rem; - --conversation-row-padding-block: 0.5rem; - --conversation-paragraph-gap: 0.625rem; - --conversation-list-item-gap: 0.5rem; - } - .dark { /* Catppuccin Macchiato (mauve accent) */ --radius: 0.625rem;