Put "compose as new" where a thumb can find it #184

Closed
opened 2026-09-01 17:53:44 +00:00 by jcoffey-dev · 0 comments
Owner

Closes #181.

What was actually wrong

It was never absent on a phone — I checked in a mobile viewport, and it's there in the per-message ⋮ menu, fourth item, right after Forward. But that is not where anybody looks. On a phone you act on a thread from the strip at the bottom (Reply / Reply all / Forward), and what isn't in that strip is, for practical purposes, not there.

So the strip gets an overflow of its own with compose-as-new in it. A fourth labelled button doesn't fit; a ⋮ does, and it spells the action out once opened. It's present at every width, not just mobile — the per-message menu keeps its copy.

A layout bug found while placing it

Measuring the strip to see what would fit turned up something worth fixing on its own. The three labelled buttons come to 391px of content, which fits a 430px phone and does not fit 390, 360 or 320. That was already true before today — Reply / Reply all / Forward alone need ~347px, over the line on a 360px phone — and the strip simply overflowed horizontally.

It now wraps, and the spacer that would otherwise take the whole first line and push the overflow onto a line of its own is dropped below 480px, so the buttons wrap as a group.

Verification

npm run typecheck, npm test (564 pass) and npm run build green; no new tests — this is placement and layout, and the behaviour behind it is already covered by the compose-as-new store tests.

In the browser against dev:mock:

  • confirmed first, at a mobile breakpoint, that compose-as-new was in the per-message ⋮ and was not in the bottom strip — i.e. what the report is actually about
  • the strip now reads Reply / Reply all / Forward / ⋮, and the menu opens with Compose as new
  • measured the strip's content at 391px and confirmed it clears 430px but not 390/360/320
  • with the container narrowed to each of 430 / 390 / 360 / 320, the strip wraps instead of overflowing at every one

One caveat on that last point: the window manager stopped honouring resize requests partway through, so the wrap was verified by narrowing the container rather than the viewport — which means the ≤480px rule that hides the spacer was not exercised, and the measurement above is the pessimistic case with the spacer still flexing. It doesn't overflow even so.

Also true, and not fixed here

On a touchscreen there is no per-row context menu in the message list at all — holding a row starts selection instead — so Reply, Forward and compose-as-new are all unreachable from the list on a phone. That predates this feature and is a bigger question about what a long-press should do; happy to open an issue for it if you want it looked at.

Merged 2026-09-01 as coffey-labs/ihasmail@2beedc0f3c

Rebuilt from: git history, session transcript.

Closes #181. ## What was actually wrong It was never absent on a phone — I checked in a mobile viewport, and it's there in the per-message ⋮ menu, fourth item, right after Forward. But **that is not where anybody looks.** On a phone you act on a thread from the strip at the bottom (Reply / Reply all / Forward), and what isn't in that strip is, for practical purposes, not there. So the strip gets an overflow of its own with compose-as-new in it. A fourth *labelled* button doesn't fit; a ⋮ does, and it spells the action out once opened. It's present at every width, not just mobile — the per-message menu keeps its copy. ## A layout bug found while placing it Measuring the strip to see what would fit turned up something worth fixing on its own. The three labelled buttons come to **391px** of content, which fits a 430px phone and does **not** fit 390, 360 or 320. That was already true before today — Reply / Reply all / Forward alone need ~347px, over the line on a 360px phone — and the strip simply overflowed horizontally. It now wraps, and the spacer that would otherwise take the whole first line and push the overflow onto a line of its own is dropped below 480px, so the buttons wrap as a group. ## Verification `npm run typecheck`, `npm test` (564 pass) and `npm run build` green; no new tests — this is placement and layout, and the behaviour behind it is already covered by the `compose-as-new` store tests. In the browser against `dev:mock`: - confirmed first, at a mobile breakpoint, that compose-as-new **was** in the per-message ⋮ and **was not** in the bottom strip — i.e. what the report is actually about - the strip now reads Reply / Reply all / Forward / ⋮, and the menu opens with **Compose as new** - measured the strip's content at 391px and confirmed it clears 430px but not 390/360/320 - with the container narrowed to each of 430 / 390 / 360 / 320, the strip **wraps instead of overflowing** at every one One caveat on that last point: the window manager stopped honouring resize requests partway through, so the wrap was verified by narrowing the container rather than the viewport — which means the ≤480px rule that hides the spacer was *not* exercised, and the measurement above is the pessimistic case with the spacer still flexing. It doesn't overflow even so. ## Also true, and not fixed here On a touchscreen there is no per-row context menu in the message list at all — holding a row starts selection instead — so Reply, Forward and compose-as-new are all unreachable from the list on a phone. That predates this feature and is a bigger question about what a long-press should do; happy to open an issue for it if you want it looked at. **Merged** 2026-09-01 as coffey-labs/ihasmail@2beedc0f3cd9 <sub>Rebuilt from: git history, session transcript.</sub>
This repo is archived. You cannot comment on issues.