Skip to content

fix(web): preserve the composer outline above attached controls - #25380

Open
dr-baker wants to merge 2 commits into
pingdotgg:mainfrom
dr-baker:fix/composer-attached-material
Open

dr-baker wants to merge 2 commits into
pingdotgg:mainfrom
dr-baker:fix/composer-attached-material

Conversation

@dr-baker

@dr-baker dr-baker commented Oct 26, 2026 •

Copy link
Copy Markdown

Problem

When the lower controls attach to the composer, a clip path removes the middle of the composer's bottom outline. The border ends at the attachment edges instead of continuing across the input. This addresses the outline portion of the original report.

Change

Remove the outline cutout from both the host outline and the main input outline. The host draws the outline normally; the main input draws it when an upper banner is attached or the lower controls are transitioning.

Scope and approval

Five deleted lines in one component. This is a focused visual defect fix covered by the obvious-bug exception. Web and desktop use the same composer component. The existing material rendering remains unchanged; #25335 already fixed the missing lower-card background under update notices.

Verification

vp run check:changed bfc7177 passed formatting, lint, both Knip checks, and typechecking of affected packages. No tests were added for this visual-only change.

Verified the exact narrowed patch in T3's Browser panel against isolated, populated development state. Before is bfc7177; after is 9d6dd892ed. Each pair uses the same 1280×800 viewport, timeline position, and composer state. The dark pair has an attached upper banner; the light pair exercises the host outline without a banner. The update notice is a temporary fixture rendered with the real banner components; timeline text is sanitized. No fixture code is included in the PR.

The dark-mode crops differ only on the restored bottom border row. The strip background and backdrop filter are unchanged. The 8× detail uses nearest-neighbor scaling so the one-pixel outline is visible.

State Before After
Dark, upper banner attached Before After
Bottom outline, 8× detail Before After
Light, no upper banner Before After

Scrolling verification on the narrowed patch

Model: GPT-6.1-Sol. Harness: Codex in T3 Code.

@github-actions github-actions Bot added vouch:unvouched PR author is not yet trusted in the VOUCHED list. size:S 10-29 changed lines (additions + deletions). labels Oct 26, 2026
@dr-baker dr-baker changed the title fix(web): match composer card materials and preserve its border fix(web): preserve the composer border above its lower controls Oct 26, 2026
- remove the shared outline cutout from the host and main input surfaces
@dr-baker
dr-baker force-pushed the fix/composer-attached-material branch from c644125 to 9d6dd89 Compare October 26, 2026 20:43
@dr-baker dr-baker changed the title fix(web): preserve the composer border above its lower controls fix(web): preserve the composer outline above attached controls Oct 26, 2026
@github-actions github-actions Bot added size:XS 0-9 changed lines (additions + deletions). and removed size:S 10-29 changed lines (additions + deletions). labels Oct 26, 2026
@maria-rcks
maria-rcks marked this pull request as ready for review October 27, 2026 00:37

Copy link
Copy Markdown
Collaborator

Note

Written by gpt-6.1-sol on behalf of Maria

thanks @dr-baker. removing the shared outline cutout fixes the border without changing the glass material. i preserved your commit and merged current main into the branch. the resulting diff is still exactly five deleted lines in ComposerSurface.tsx; nothing from the original narrowed diff was dropped or moved.

verification: blacksmith passed vp run check:changed github/main (format, lint, both knip checks, affected web/scripts typechecks) and 22 existing branch-toolbar/footer-layout tests. two independent code reviews approved head e4248cd7db07c8cef228e1f8646ae3d51b410159 with no findings. system chrome rendered the real app with the attached strip in light/dark and at 390px; the workspace menu still opens. main's component produced the cutout; the patched component produces a continuous outline with matching draft data. captures use the same checkout, replacing only the component with main's source for the before state.

unverified: native desktop shell, custom themes, and an attached update notice/model-strip transition in the live client. native mobile uses a separate composer and is unaffected. no provider or wire behavior changed. ci status will be checked before handoff.

before, light:

main component with interrupted bottom outline in light mode

after, light:

patched composer with continuous bottom outline in light mode

before, dark:

main component with interrupted bottom outline in dark mode

after, dark:

patched composer with continuous bottom outline in dark mode

@coderabbitai

coderabbitai Bot commented Oct 27, 2026 •

Copy link
Copy Markdown
Contributor

Review in Change Stack →

No actionable comments were generated in the recent review.

Recent review info
Run configuration
Commits

Reviewing files that changed from the base of the PR and between 9bc0c33 and e4248cd.

Files selected for processing: 1
  • apps/web/src/components/chat/ComposerSurface.tsx
Files with no reviewable changes: 1
  • apps/web/src/components/chat/ComposerSurface.tsx

Included review availability: This review used your included allowance. Your plan provides up to 10 included reviews per hour; 6 remain after this review.

Walkthrough

ComposerSurface.Host and ComposerSurface.Main no longer apply the context-seam clipping class. The shared contextSeamClasses constant was removed.

Changes: Composer outline

Layer / File(s) Summary
Remove context-seam clipping
apps/web/src/components/chat/ComposerSurface.tsx
Host and Main no longer apply the context-seam clipping class. The shared class constant was removed.

Priority: Low

Estimated code review effort: 1 (Trivial) | ~3 minutes

Change: Bug fix

Possibly related PRs

Suggested reviewers: macroscopeapp

Merge Risk: Minimal · up to e4248

The composer outline change is mergeable after normal checks; no actionable issue is identified.

Pre-merge checks: Passed 4
Check name Status Explanation
Title check Passed The title names the main change: it removes the composer outline cutout so the border stays continuous above attached controls. It uses the conventional commit format and matches the five-line removal…
Linked Issues check Passed Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check Passed Check skipped because no linked issues were found for this pull request.
Description check Passed The description includes all required sections. It explains the problem, change, scope and approval basis, verification results, visual evidence, and unverified checks. It also identifies the model an…
Full details: Title check

Explanation

The title names the main change: it removes the composer outline cutout so the border stays continuous above attached controls. It uses the conventional commit format and matches the five-line removal in ComposerSurface.tsx. Its scope is narrow and accurate, and it does not describe unrelated work.

Full details: Description check

Explanation

The description includes all required sections. It explains the problem, change, scope and approval basis, verification results, visual evidence, and unverified checks. It also identifies the model and harness used.

Finishing Touches
🧪 Generate unit tests (beta)
  • Create a new PR
  • Autofix · Keep fixing CodeRabbit findings and required CI, and resolving merge conflicts

Comment @coderabbitai help to get the list of available commands.

@dr-baker

Copy link
Copy Markdown
Author

thanks mariastra. repro looks great

maria-rcks commented Oct 28, 2026 •

Copy link
Copy Markdown
Collaborator

Note

Written by gpt-6.1-sol on behalf of Maria

Verified in a real dev environment

verified as-is at e4248cd7db07c8cef228e1f8646ae3d51b410159 on a disposable linux boat vm, using repository playwright and /usr/bin/google-chrome.

reproduced the missing bottom outline on github/main (7c6446b81a) in a separate worktree with vp i and a real background dev server. stopped that server before starting the exact pr head with its own fresh state. added /home/user/main as a project through the client, created threads, and sent real codex gpt-6.1-sol turns through the local provider proxy. no mocks, seeded database, fixtures, or temporary component replacements.

on main the attached host outline clips out its middle two pixels. on this head the outline continues across the input in light and dark. both screenshot pairs use the same project path, prompt, model, and 1280×800 viewport. main is newer than the pr, so unrelated model-label and sidebar presentation differs.

also exercised a real branch mismatch notice with lower context controls enabled through settings. the host outline hides and the main input outline draws without clipping. clicking "restore branch" changed the real checkout back and removed the notice. real sol follow-ups completed; the project actions menu opens, the composer draft survives reload, and the 390px web layout has no horizontal overflow.

blacksmith passed vp run check:changed 9bc0c334383a43af5390283e9b10f999acc021b8: formatting, lint, both knip checks, and affected web/scripts typechecks. the pr currently reports 25 successful checks, none failing or pending. no source changes were needed.

short runtime transcript

main: missing outline above attached controls, light

pr: continuous outline above attached controls, light

main: missing outline above attached controls, dark

pr: continuous outline above attached controls, dark

pr: real branch notice and lower controls attached together

real codex sol follow-up completes and project actions open

the uploaded clip plays and seeks in t3's browser player. github and git.cafe do not embed this external mp4 inline.

Not verified

native electron on macos/windows, native ios/android, other browsers/providers, custom themes, remote relay/tunnel connections, an actual update notice, and the model-strip collapse transition. the branch notice exercises the shared attached-banner outline but does not prove the update-specific flow. native mobile uses a separate composer. no claim about merge readiness against newer main.

This branch has not been deployed

No deployments
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

size:XS 0-9 changed lines (additions + deletions). vouch:unvouched PR author is not yet trusted in the VOUCHED list.

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants