Title: Expand / collapse (maximize) toggle for the chat composer · Issue #48 · modelstudioai/openwork · GitHub
Open Graph Title: Expand / collapse (maximize) toggle for the chat composer · Issue #48 · modelstudioai/openwork
X Title: Expand / collapse (maximize) toggle for the chat composer · Issue #48 · modelstudioai/openwork
Description: Problem or Motivation OpenWork's chat composer (FreeFormInput) auto-grows as you type, but only up to a fixed cap — min(66% of window height, 540px). There is no way to deliberately give the input a large editing area. When drafting or e...
Open Graph Description: Problem or Motivation OpenWork's chat composer (FreeFormInput) auto-grows as you type, but only up to a fixed cap — min(66% of window height, 540px). There is no way to deliberately give the input ...
X Description: Problem or Motivation OpenWork's chat composer (FreeFormInput) auto-grows as you type, but only up to a fixed cap — min(66% of window height, 540px). There is no way to deliberately give the in...
Opengraph URL: https://github.com/modelstudioai/openwork/issues/48
X: @github
Domain: github.com
{"@context":"https://schema.org","@type":"DiscussionForumPosting","headline":"Expand / collapse (maximize) toggle for the chat composer","articleBody":"## Problem or Motivation\n\nOpenWork's chat composer (`FreeFormInput`) auto-grows as you type, but only up to\na **fixed cap** — `min(66% of window height, 540px)`. There is no way to\ndeliberately give the input a large editing area. When drafting or editing a long\nprompt (a spec, a big paste, a multi-paragraph instruction), you're stuck writing\nand scrolling inside a small box even when the window has plenty of room.\n\nComparable desktop chat surfaces (Claude's desktop app, ChatGPT desktop, Codex\ndesktop) all offer a **maximize / expand** affordance on the composer so you can\npop the input open into a tall editor for composing long messages, then collapse\nit back. OpenWork is the conspicuous exception: the composer toolbar already has a\nmodel picker, a thinking-level picker, a context-usage indicator and an attach\ncontrol, but no expand toggle.\n\n## Proposed Solution\n\nAdd an **expand / collapse toggle** to the composer toolbar (right-side controls,\nnext to the thinking-level and model pickers, mirroring their `!compactMode`\nrule):\n\n- A small icon button (Maximize when collapsed, Minimize when expanded) with a\n tooltip (\"Expand composer\" / \"Collapse composer\") and `aria-pressed` reflecting\n the state.\n- Clicking it maximizes the input to a large share of the window\n (`max(78% of window height, 560px)`, recomputed on resize) by applying a tall\n `minHeight`/`maxHeight` to the editable area, so the box is genuinely large even\n when empty.\n- Clicking again collapses it back to the normal auto-grow cap.\n- The maximized state resets when switching sessions, so a new conversation always\n starts compact.\n\nThis is a **frontend-only** change:\n\n- It only adjusts the renderer's local layout state (`isComposerExpanded`) and the\n inline height style already applied to the `RichTextInput`. No backend / no\n qwen-code change.\n- Two new i18n keys (`chat.expandComposer`, `chat.collapseComposer`) added to all\n locales for the tooltip.\n\n## Alternatives Considered\n\n- **Auto-grow only** (the status quo) helps for moderate text but caps out; it\n can't be opened deliberately for long-form composing, and never exceeds ~540px.\n- **A separate full-screen editor modal** would be heavier and diverge from the\n established composer-toolbar pattern (model/thinking pickers) that this mirrors.\n An inline maximize is the lighter, more discoverable fit and can be layered with\n a modal later if wanted.\n\n## Additional Context\n\nFeasibility: **frontend-only / doable.** Verified against `apps/electron` — the\ncomposer already owns its height state (`inputMaxHeight`, computed from the window\nin a resize effect) and passes an inline `style` (merged onto the contenteditable)\nto `RichTextInput`; the toggle just introduces a second, larger height and swaps\nwhich one is applied.\n\n### Acceptance criteria (CDP e2e assertion)\n\nA new `e2e/assertions/composer-expand.assert.ts` drives the real built app over\nCDP entirely in the draft (no-session) state — no seeded conversation needed:\n\n1. The composer renders the expand toggle, initially `aria-pressed=\"false\"`.\n2. Measure the input area's height (collapsed).\n3. Click the toggle → the input **grows substantially** (height \u003e= 2× the\n collapsed height) **and** the toggle flips to `aria-pressed=\"true\"`.\n4. Click again → the input **collapses back** to roughly its start height **and**\n the toggle returns to `aria-pressed=\"false\"`.\n\nThe height measurements prove the toggle actually *resizes* the composer, not\nmerely swaps an icon.\n\nPart of the autonomous desktop-feature loop (`loop-bot`).","author":{"url":"https://github.com/DragonnZhang","@type":"Person","name":"DragonnZhang"},"datePublished":"2026-07-03T01:37:08.000Z","interactionStatistic":{"@type":"InteractionCounter","interactionType":"https://schema.org/CommentAction","userInteractionCount":0},"url":"https://github.com/48/openwork/issues/48"}
| route-pattern | /_view_fragments/issues/show/:user_id/:repository/:id/issue_layout(.:format) |
| route-controller | voltron_issues_fragments |
| route-action | issue_layout |
| fetch-nonce | v2:d7b44c5c-3c0a-16be-0449-26ce10e8f72b |
| current-catalog-service-hash | 81bb79d38c15960b92d99bca9288a9108c7a47b18f2423d0f6438c5b7bcd2114 |
| request-id | CA60:20A2E2:1559A87:1CFD9EC:6A52271C |
| html-safe-nonce | f78d2fa3b8a2a7a459838af28d93329e6dd4f2c14c78a15ec59af1a23363034b |
| visitor-payload | eyJyZWZlcnJlciI6IiIsInJlcXVlc3RfaWQiOiJDQTYwOjIwQTJFMjoxNTU5QTg3OjFDRkQ5RUM6NkE1MjI3MUMiLCJ2aXNpdG9yX2lkIjoiNjQ5MDgwODE3MTU0Nzk5Mzg4NCIsInJlZ2lvbl9lZGdlIjoiaWFkIiwicmVnaW9uX3JlbmRlciI6ImlhZCJ9 |
| visitor-hmac | fbe8b1d37c9077832df728f61695bfd9ed7fba9fe5d33f159712e4b9f2f4b7b4 |
| hovercard-subject-tag | issue:4799425175 |
| github-keyboard-shortcuts | repository,issues,copilot |
| google-site-verification | Apib7-x98H0j5cPqHWwSMm6dNU4GmODRoqxLiDzdx9I |
| octolytics-url | https://collector.github.com/github/collect |
| analytics-location | / |
| fb:app_id | 1401488693436528 |
| apple-itunes-app | app-id=1477376905, app-argument=https://github.com/_view_fragments/issues/show/modelstudioai/openwork/48/issue_layout |
| twitter:image | https://opengraph.githubassets.com/72b08c60fd7669d7b188117885f56628907938fc0ffaa48a4ba8d7d7e2f9a622/modelstudioai/openwork/issues/48 |
| twitter:card | summary_large_image |
| og:image | https://opengraph.githubassets.com/72b08c60fd7669d7b188117885f56628907938fc0ffaa48a4ba8d7d7e2f9a622/modelstudioai/openwork/issues/48 |
| og:image:alt | Problem or Motivation OpenWork's chat composer (FreeFormInput) auto-grows as you type, but only up to a fixed cap — min(66% of window height, 540px). There is no way to deliberately give the input ... |
| og:image:width | 1200 |
| og:image:height | 600 |
| og:site_name | GitHub |
| og:type | object |
| og:author:username | DragonnZhang |
| hostname | github.com |
| expected-hostname | github.com |
| None | b9a586c06a05a7a86fc7e3f4dbd03e42f6869085879aa184aa6369456dbd50fb |
| turbo-cache-control | no-preview |
| go-import | github.com/modelstudioai/openwork git https://github.com/modelstudioai/openwork.git |
| octolytics-dimension-user_id | 283556804 |
| octolytics-dimension-user_login | modelstudioai |
| octolytics-dimension-repository_id | 1256697754 |
| octolytics-dimension-repository_nwo | modelstudioai/openwork |
| octolytics-dimension-repository_public | true |
| octolytics-dimension-repository_is_fork | false |
| octolytics-dimension-repository_network_root_id | 1256697754 |
| octolytics-dimension-repository_network_root_nwo | modelstudioai/openwork |
| turbo-body-classes | logged-out env-production page-responsive |
| disable-turbo | false |
| browser-stats-url | https://api.github.com/_private/browser/stats |
| browser-errors-url | https://api.github.com/_private/browser/errors |
| release | 7aed05249554b889eb33d002851a973eebcc7e91 |
| ui-target | canary-1 |
| theme-color | #1e2327 |
| color-scheme | light dark |
Links:
Viewport: width=device-width