Skip to content

fix(mobile): theme the account selector action sheet - #6455

Merged
iscekic merged 1 commit into
mainfrom
kwf/explorer-org-sheet-the-select-account-sheet-is-drawn-on-a-a5ba0-7e70
Sep 21, 2026
Merged

iscekic merged 1 commit into
mainfrom
kwf/explorer-org-sheet-the-select-account-sheet-is-drawn-on-a-a5ba0-7e70

Conversation

@iscekic

@iscekic iscekic commented Sep 21, 2026

Copy link
Copy Markdown
Collaborator

Changelog for users

  • The account selector sheet now follows the active theme: a dark surface with light text in dark mode and a light surface with dark text in light mode.
  • The sheet no longer renders as a white surface with black text while a dark screen sits behind it.

Changelog for maintainers

  • The account picker now reads useThemeColors() and passes the theme's card, foreground, and mutedForeground tokens to the native action sheet.
  • The sheet background, option text, and title text therefore follow the app's appearance override instead of the platform default.
  • Sheet padding, title copy, options, and the selection callback are unchanged; only the color props are new.
  • A mounted test asserts the picker receives the theme colors for background, option text, and title text.
  • Review hint: confirm the action sheet on both themes, since the previous code set no colors and relied on the platform default.

E2E proof

[e3] ux-check: Android, app dark theme: open Profile and tap the account selector; the 'Select account' sheet surface is dark (app card color, not white) and its title/options text is light. — android (emulator-5606): app theme forced to Dark via Profile > Preferences > Appearance; e3-scene.log shows 'SCENE e3 OK' with digest line 'android.view.ViewGroup Select account' after tapping 'Personal', and e3-scene.xml carries the sheet's title text="Select account" with option nodes content-desc="Personal", content-desc="[seed:w4c-org-pair] e2e-org-owner-...@example.com" and content-desc="Cancel"; the sheet's surface/text colours are in e3.png for the visual reviewer (no visual claim made here); no UX-DEFECT on Profile or the sheet.

ux-check: Android, app dark theme: open Profile and tap the account selector; the 'Select account' sheet surface is dark (app card color, not white) and its title/options text is light. — e3.png

[e4] ux-check: Android, app light theme: the same sheet renders light with dark text (no dark-sheet regression). — android emulator-5554: app set to Appearance=Light (e4-theme-light.txt carries content-desc="Light" checkable="true" checked="true"), then the scripted scene opened the context sheet — e4-scene.log shows SCENE e4 OK and e4-sheet.txt carries text="Select account", text="Personal", the org option and text="Cancel" with non-overlapping bounds; sheet render colour is left to the visual reviewer on e4.png / e4-theme-light.png (no functional UX defect observed).

ux-check: Android, app light theme: the same sheet renders light with dark text (no dark-sheet regression). — e4.png

ux-check: iOS, app forced to dark while the device is in light mode: the 'Select account' sheet matches the app's dark appearance (native sheet follows the app appearance override). — e7.png

[e1] ux-check: Android, app light theme: the same sheet renders light with dark text (no dark-sheet regression). — Android emulator-5554: after Profile -> Preferences -> Appearance = Light (e1-theme.log: '- RadioButton "Light" [checked] [ref=e15]'), the account selector opened the sheet in Light theme (e1-longrun2.log: 'SCENE e1 OK', 'android.view.ViewGroup Select account tappable [0,0][1080,2400]'); no missing feedback/lost work/broken recovery, and the light-surface/dark-text look is the visual reviewer's call from e1.png; parked e1 steps were corrected ('screen: Profile' matched the Home tab-bar label and the account row reads 'Personal', not the org name) and re-run, with no UX-DEFECT observed in the…

[e1] ux-check: Android, app light theme: the same sheet renders light with dark text (no dark-sheet regression). — prior/e1-appearance.png

[e4] ux-check: Android, app light theme: the same sheet renders light with dark text (no dark-sheet regression).

[e4] ux-check: Android, app light theme: the same sheet renders light with dark text (no dark-sheet regression). — prior/e4-theme-light.png

[e1] Dark theme: Preferences → Dark, Profile tab, account sheet on a dark card surface — Fixed the parked steps (added tap Preferences, the MISS cause) and re-ran: e1-scene.log shows 'SCENE e1 OK' with the Select account sheet over the Profile tab, and e1-theme.log shows 'RadioButton "Dark" [checked] [ref=e17]'; the sheet's dark-surface rendering itself is judged by the visual reviewer on e1.png (e1-scene.log, e1-theme.log, e1.png).

[e1] Dark theme: Preferences → Dark, Profile tab, account sheet on a dark card surface — scripted-shard1/e1.png

[e5] ux-check: option tap dismisses and updates the Profile label, Cancel dismisses unchanged — e5-behavior.log: after tapping the org option the sheet is gone and the account label is 'Button "[seed:w4c-org-pair] e2e-org-owner-…" [ref=e3]' with 'TextView "ORGANIZATION" [ref=e18]'; after reopening and tapping Cancel the same org label is retained, so selection was unchanged; no missing feedback, lost work or broken recovery (e5-behavior.log, e5-sheet-open.png, e5-selected-org.png, e5-cancel-unchanged.png).

[e5] ux-check: option tap dismisses and updates the Profile label, Cancel dismisses unchanged — prior/e5-cancel-unchanged.png

E2E proof — log excerpts

[e1] ux-check: Android, app light theme: the same sheet renders light with dark  -> pass :: jev read the digest: pass (confidence 1.00)
/home/igor_kilocode_ai/.local/share/kwf/sections/explorer-org-sheet-the-select-account-sheet-is-drawn-on-a-a5ba0-7e70/e2e-mobile-app/scripted-e1.log
android.widget.Button Code Reviewer, Automatic PR reviews tappable [55,1081][1025,1225]
android.widget.TextView Code Reviewer tappable [189,1109][933,1155]
android.widget.TextView Automatic PR reviews tappable [189,1159][933,1196]
android.widget.Button Security Agent, Find and remediate vulnerabilities tappable [55,1252][1025,1395]
android.widget.TextView Security Agent tappable [189,1280][933,1326]
android.widget.TextView Find and remediate vulnerabilities tappable [189,1330][933,1367]
android.widget.TextView REVIEWS tappable [55,1450][1025,1494]
android.widget.Button PR Review, Review pull requests on mobile tappable [55,1522][1025,1664]
android.widget.TextView PR Review tappable [189,1550][933,1596]
android.widget.TextView Review pull requests on mobile tappable [189,1600][933,1637]
android.widget.TextView APP tappable [55,1719][1025,1763]
android.widget.Button Preferences, Appearance, notifications, thinking, and screen behavior tappable [55,1791][1025,1935]
android.widget.TextView Preferences tappable [189,1819][933,1865]
android.widget.TextView Appearance, notifications, thinking, and screen behavior tappable [189,1869][933,1906]
android.widget.Button Tutorial tappable [55,1962][1025,2096]
android.widget.TextView Tutorial tappable [189,2006][933,2052]
android.widget.TextView LINKED ACCOUNTS tappable [55,2151][1025,2153]
android.view.View Home, tab, 1 of 3 tappable [0,2195][360,2337]
android.widget.TextView HOME tappable [13,2281][347,2320]
android.view.View Agents, tab, 2 of 3 tappable [360,2195][720,2337]
android.widget.TextView AGENTS tappable [373,2281][707,2320]
android.view.View Profile, tab, 3 of 3 tappable [720,2195][1080,2337]
android.widget.TextView PROFILE tappable [733,2281][1067,2320]
android.view.ViewGroup Select account tappable [0,0][1080,2400]
Owner request

Explorer finding: org-sheet: The 'Select account' sheet is drawn on a white surface with black text while the Profile screen directly behind it is dark, so this surface ignores the active theme.

The user-agent explorer found this while using the app like a user.
One finding per item; the explorer never edits product code.

Flow: org-sheet
Found on revision: f2181ae

Repro:

  1. set this state first: reviews 4; credits 22; org; uimode day; battery 55 discharging; relaunch; the device in light mode
  2. open the app on emulator-5602
  3. reach org-sheet
  4. the capture shows the defect named below

Observed: The 'Select account' sheet is drawn on a white surface with black text while the Profile screen directly behind it is dark, so this surface ignores the active theme.
Expected: the screen renders without this defect

Evidence (from the device run):

[e6] ux-check Android: Profile screen behind the open sheet does not move — android emulator-5604, Dark theme; with the sheet open the hierarchy holds the sheet plus unchanged Profile bounds — text="CREDITS" at bounds="[55,348][192,392]" in e6-before.xml, e6-sheet-open-dark.xml and e6-after.xml — so no layout shift on open or dismiss; sheet gone after Cancel (e6-after.xml carries no text="Cancel", still shows text="CREDITS"); backgrounds judged from e6-before.png / e6-sheet-open-dark.png / e6-after.png by the visual reviewer.

[e6] ux-check Android: Profile screen behind the open sheet does not move — e6-before.png

[e2] Light theme: account sheet opens on the light surface — android emulator-5604; Light radio checked (e2-light-selected.xml: content-desc="Light" checkable="true" checked="true") and the action sheet rendered after tapping Personal under that theme (e2-sheet-open.xml: text="Select account", text="Cancel"); e2-sheet-light.png holds the still of that moment for the visual reviewer; repaired parked replay (added tap Preferences, assert Cancel) re-ran OK (e2-scene.log: SCENE e2 OK) and is saved as e2.replay.json.

[e2] Light theme: account sheet opens on the light surface — e2-sheet-light.png

[e6] ux-check Android: Profile screen behind the open sheet does not move

[e6] ux-check Android: Profile screen behind the open sheet does not move — e6-after.png

[e6] ux-check Android: Profile screen behind the open sheet does not move

[e6] ux-check Android: Profile screen behind the open sheet does not move — e6-sheet-open-dark.png

[e7] ux-check: iOS, app forced to dark while the device is in light mode: the 'Select account' sheet matches the app's dark appearance (native sheet follows the app appearance override). — proved on android (this host is android-only, per the shard header): e7-appearance.txt shows the app's Appearance override is Dark (RadioButton checked="true" beside 'Dark', System/Light checked="false") while e7-device-mode.txt shows the device is in light mode (android.widget.Switch content-desc="Dark theme" checked="false"); e7-scene.log reports 'SCENE e7 OK' and e7-sheet-a11y.txt lists the sheet (ViewGroup/TextView 'Select account', Button 'Personal', Button '[seed:w4c-org-pair] e2e-org-owner-...@example.com', Button 'Cancel'); colours captured in e7.png / e7-appearance.png for the visual…

[e7] ux-check: iOS, app forced to dark while the device is in light mode: the 'Select account' sheet matches the app's dark appearance (native sheet follows the app appearance override). — e7-appearance.png

Follow-ups (not changed here)

  • not proved live: Dark theme: open Preferences, choose Dark, tap the Profile tab, open the account sheet; the still shows the 'Select account' sheet on the dark card surface with light text, not a white surface with black text. (no capture cited it)
  • not proved live: Light theme: open Preferences, choose Light, tap the Profile tab, open the account sheet; the still shows the sheet on the light surface with legible text (no regression from the themed styles). (no capture cited it)
  • not proved live: ux-check: Android: tapping an account option dismisses the sheet and the Profile account label updates; tapping Cancel dismisses without changing the selection. (no capture cited it)
  • not proved live: ux-check: Android: while the sheet is open, the Profile screen behind remains the app's dark background (no white flash/layout shift on open or dismiss). (no capture cited it)

Open findings (not fixed here)

  • not proved live: org-sheet.png is no longer on the host that took it, so no publish can carry it

e5-sheet-open

e1

e5-selected-org

Comment thread apps/mobile/src/components/context-control.tsx
Comment thread apps/mobile/src/components/context-control.tsx
Comment thread apps/mobile/src/components/context-control.mounted.test.tsx
@kilo-code-bot

kilo-code-bot Bot commented Sep 21, 2026

Copy link
Copy Markdown
Contributor

Code Review Summary

Status: No Issues Found | Recommendation: Merge

Executive Summary

The incremental commit only changes apps/mobile/src/components/context-control.mounted.test.tsx: the light border fixture now matches theme-colors.generated.ts, and the new palette-mirroring test makes future token drift fail loudly. No defects found in the changed lines.

Files Reviewed (1 file)
  • apps/mobile/src/components/context-control.mounted.test.tsx
Previous Review Summaries (2 snapshots, latest commit 325b074)

Current summary above is authoritative. Previous snapshots are kept for context only.

Previous review (commit 325b074)

Status: 1 Issue Found | Recommendation: Address before merge

Overview

Severity Count
CRITICAL 0
WARNING 0
SUGGESTION 1
Issue Details (click to expand)

SUGGESTION

File Line Issue
apps/mobile/src/components/context-control.mounted.test.tsx 31 The light border fixture value does not match the real light token the fixture claims to mirror
Files Reviewed (1 file)
  • apps/mobile/src/components/context-control.mounted.test.tsx - 1 issue

Fix these issues in Kilo Cloud

Previous review (commit 2776c29)

Status: 3 Issues Found | Recommendation: Address before merge

Overview

Severity Count
CRITICAL 0
WARNING 1
SUGGESTION 2
Issue Details (click to expand)

WARNING

File Line Issue
apps/mobile/src/components/context-control.tsx 44 Color props are ignored on the iOS native action sheet; the app has not opted into the library's custom renderer, so the fix is Android-only

SUGGESTION

File Line Issue
apps/mobile/src/components/context-control.tsx 43 Theming is added inline for one call site; extract shared themed action-sheet options
apps/mobile/src/components/context-control.mounted.test.tsx 182 Test uses one static mocked palette, so it cannot detect loss of theme adaptation
Files Reviewed (2 files)
  • apps/mobile/src/components/context-control.tsx - 2 issues
  • apps/mobile/src/components/context-control.mounted.test.tsx - 1 issue

Fix these issues in Kilo Cloud


Reviewed by deepseek-v4.1-flash · Input: 0 · Output: 0 · Cached: 0

Review guidance: REVIEW.md from base branch main

@iscekic
iscekic marked this pull request as draft September 21, 2026 03:15
@iscekic
iscekic force-pushed the kwf/explorer-org-sheet-the-select-account-sheet-is-drawn-on-a-a5ba0-7e70 branch from 2776c29 to 325b074 Compare September 21, 2026 03:43
@iscekic
iscekic marked this pull request as ready for review September 21, 2026 04:04
Comment thread apps/mobile/src/components/context-control.mounted.test.tsx Outdated
@iscekic
iscekic marked this pull request as draft September 21, 2026 04:26
@iscekic
iscekic force-pushed the kwf/explorer-org-sheet-the-select-account-sheet-is-drawn-on-a-a5ba0-7e70 branch from 325b074 to 2bedb6a Compare September 21, 2026 04:48
@iscekic
iscekic marked this pull request as ready for review September 21, 2026 05:09
@iscekic

iscekic commented Sep 21, 2026

Copy link
Copy Markdown
Collaborator Author

This description names a scenario the proof did not capture:

  • not proved live: Dark theme: open Preferences, choose Dark, tap the Profile tab, open the account sheet; the still shows the 'Select account' sheet on the dark card surface with light text, not a white surface with black text. (no capture cited it)

A repeated proof run rebuilds the same evidence, so no proof run is dispatched for a named gap. Merging with this gap open is your decision.

@iscekic iscekic added the human-ready The PR is ready for human review. label Sep 21, 2026
@iscekic iscekic self-assigned this Sep 21, 2026

@eshurakov eshurakov left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Approved after a shallow triage pass. Subsumed by #6377 - close one before merge.

@iscekic
iscekic merged commit f35eb79 into main Sep 21, 2026
29 checks passed
@iscekic
iscekic deleted the kwf/explorer-org-sheet-the-select-account-sheet-is-drawn-on-a-a5ba0-7e70 branch September 21, 2026 14:57
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

human-ready The PR is ready for human review.

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants