René's URL Explorer Experiment

{"@context":"https://schema.org","@type":"DiscussionForumPosting","headline":"Add a \"Conversation width\" setting (Comfortable / Wide / Full) to Appearance","articleBody":"## Problem or Motivation\n\nOpenWork renders the chat transcript (and the composer) inside a fixed reading\nwidth — `CHAT_LAYOUT.maxWidth` = `max-w-[840px]` (see `packages/ui/src/lib/layout.ts`,\napplied in `ChatDisplay.tsx` and `ChatInputZone.tsx`). There is **no way for the\nuser to change it**.\n\nOn large / ultrawide desktop displays this leaves most of the window empty, and\nfor code-heavy conversations (wide diffs, long tool output, tables) the 840px\ncolumn forces unnecessary wrapping and horizontal scrolling inside blocks.\n\nComparable desktop clients all expose this as a preference:\n- **Claude Desktop** — \"wider chat\" width control,\n- **ChatGPT desktop** — chat **width** setting,\n- **Codex / VS Code** — editor/content width preferences.\n\nOpenWork's otherwise rich Appearance page (theme, color theme, font, language,\nrich tool descriptions, reduce motion) is missing this one common affordance.\n\n## Proposed Solution\n\nAdd a **\"Conversation width\"** segmented control to **Settings → Appearance →\nInterface**, right below the existing \"Reduce motion\" toggle, with three options:\n\n- **Comfortable** (default) — the current 840px reading column,\n- **Wide** — 1100px, a roomier column for code-heavy chats,\n- **Full** — no max-width, uses the full available panel width.\n\nBehavior:\n- Renderer-only preference persisted in `localStorage`, mirroring the existing\n  `ReduceMotionContext` pattern (no backend/qwen-code change).\n- A `ConversationWidthProvider` reflects the choice onto `\u003chtml\u003e` as\n  `data-conversation-width` **and** drives a CSS custom property\n  `--chat-content-max-width` (`840px` / `1100px` / `none`).\n- The transcript container and the composer read that variable via an inline\n  `max-width: var(--chat-content-max-width, 840px)`, so the fallback keeps the\n  shared web viewer (`packages/ui` `SessionViewer`) unchanged at 840px.\n\n## Feasibility\n\n**Frontend-only.** Pure renderer/CSS state — the width is a presentation concern\nin `apps/electron/src/renderer`. No qwen-code backend involvement. Follows the\nalready-merged reduce-motion preference precedent (#50 / #51).\n\n## Acceptance criteria (CDP assertion)\n\nA new `e2e/assertions/conversation-width.assert.ts` drives the real UI over CDP\nand asserts, for each of the three options selected from the Appearance page:\n\n1. the segmented control button reports `aria-checked=\"true\"`,\n2. `\u003chtml\u003e` carries the matching `data-conversation-width` value,\n3. the computed CSS custom property `--chat-content-max-width` on `\u003chtml\u003e`\n   equals the expected value (`840px` / `1100px` / `none`),\n4. the choice is persisted in `localStorage` under `craft-conversation-width`,\n\ncycling through the options to prove it both applies and reverts.","author":{"url":"https://github.com/DragonnZhang","@type":"Person","name":"DragonnZhang"},"datePublished":"2026-07-06T13:22:39.000Z","interactionStatistic":{"@type":"InteractionCounter","interactionType":"https://schema.org/CommentAction","userInteractionCount":0},"url":"https://github.com/62/openwork/issues/62"}