refactor(ui,settings): unify Select wrappers into one primitive + dead selector sweep - #254
Merged
Merged
Conversation
… one primitive + dead selector sweep @kenji styles inventory task #128 (`notes/maka-styles-css-inventory-2026-06-25-task-128.md`) flagged that `styles.css` (14066 lines) had become the product's UI database, with the Settings select and Plan Reminder select drifted into two near-identical wrappers + two CSS recipes. The Plan Reminder copy got a real bug fix (selected-trigger icon) in PR #250; the Settings copy never did. @WAWQAQ msg `dea869c5` "做久一点 / 一次多做点" + msg `61862591` authorizing this round; coordination ack `a137b9d7`. This bundles Round A (dead selector sweep) and Round B (shared Rich Select primitive + call-site migration) into one PR. **Round B — shared SettingsSelect primitive.** - New `packages/ui/src/primitives/settings-select.tsx`. Option type `[value, label, icon?]`; `width` variant (`compact` | `select` | `full`); the trigger uses `SelectValue`'s function-child so the collapsed picked state renders the same icon + label row as the popup items. - `PlanReminderSelect` in `components.tsx` collapsed to a thin `<SettingsSelect width="full" {...props} />` specialization. Both surfaces now share one source of truth. - `SettingsModal.tsx` drops its local `SettingsSelect` definition; the 5 existing call sites (Daily Review 分析模型, Proxy 代理协议, Gateway 监听地址, Bot 域名, Usage 状态筛选) automatically pick up the imported primitive — same `[value, label]` props still work. - CSS: rename `.maka-plan-select*` / `.settingsBaseSelectTrigger*` → `.settingsSelect*` family on the primitive side; drop the `.settingsBaseSelectPopup` block that no longer has a consumer. `.settingsRow[data-control-width="select"]` and `.settingsField[data-orient="horizontal"]` keep the same width contract, now keyed off `.settingsSelectTrigger`. **Round A — dead selector sweep.** Per @kenji inventory the following had zero JSX/TSX consumers; I re-verified each with `grep --include='*.tsx'`: - `.maka-nav-primary` (3 rules under `.maka-session-panel[data- collapsed="true"]`) - `.maka-skill-workbench-rail` Promoted both into `renderer-style-pruning-contract.test.ts`'s retired-hook list alongside the 12 already locked there. The contract test (`✔ does not keep CSS for retired renderer hooks`) passes after the deletion. Net: +162 / -148 lines. One source of truth for the Settings/Plan Reminder Select chrome; one less wrapper and ~24 lines of dead CSS to maintain. Round C (ChoiceCard/RadioCard) and Round D (CSS ownership split) still on @kenji's plan.
3 tasks
jackwener
added a commit
that referenced
this pull request
Jun 25, 2026
…onnectionStatus) (#255) * refactor(ui,settings): unify SettingsSelect + PlanReminderSelect into one primitive + dead selector sweep @kenji styles inventory task #128 (`notes/maka-styles-css-inventory-2026-06-25-task-128.md`) flagged that `styles.css` (14066 lines) had become the product's UI database, with the Settings select and Plan Reminder select drifted into two near-identical wrappers + two CSS recipes. The Plan Reminder copy got a real bug fix (selected-trigger icon) in PR #250; the Settings copy never did. @WAWQAQ msg `dea869c5` "做久一点 / 一次多做点" + msg `61862591` authorizing this round; coordination ack `a137b9d7`. This bundles Round A (dead selector sweep) and Round B (shared Rich Select primitive + call-site migration) into one PR. **Round B — shared SettingsSelect primitive.** - New `packages/ui/src/primitives/settings-select.tsx`. Option type `[value, label, icon?]`; `width` variant (`compact` | `select` | `full`); the trigger uses `SelectValue`'s function-child so the collapsed picked state renders the same icon + label row as the popup items. - `PlanReminderSelect` in `components.tsx` collapsed to a thin `<SettingsSelect width="full" {...props} />` specialization. Both surfaces now share one source of truth. - `SettingsModal.tsx` drops its local `SettingsSelect` definition; the 5 existing call sites (Daily Review 分析模型, Proxy 代理协议, Gateway 监听地址, Bot 域名, Usage 状态筛选) automatically pick up the imported primitive — same `[value, label]` props still work. - CSS: rename `.maka-plan-select*` / `.settingsBaseSelectTrigger*` → `.settingsSelect*` family on the primitive side; drop the `.settingsBaseSelectPopup` block that no longer has a consumer. `.settingsRow[data-control-width="select"]` and `.settingsField[data-orient="horizontal"]` keep the same width contract, now keyed off `.settingsSelectTrigger`. **Round A — dead selector sweep.** Per @kenji inventory the following had zero JSX/TSX consumers; I re-verified each with `grep --include='*.tsx'`: - `.maka-nav-primary` (3 rules under `.maka-session-panel[data- collapsed="true"]`) - `.maka-skill-workbench-rail` Promoted both into `renderer-style-pruning-contract.test.ts`'s retired-hook list alongside the 12 already locked there. The contract test (`✔ does not keep CSS for retired renderer hooks`) passes after the deletion. Net: +162 / -148 lines. One source of truth for the Settings/Plan Reminder Select chrome; one less wrapper and ~24 lines of dead CSS to maintain. Round C (ChoiceCard/RadioCard) and Round D (CSS ownership split) still on @kenji's plan. * chore(css): drop 2 more verified-dead selectors + lock in retired-hook contract Round A-extended (yuejing 2026-06-25). @WAWQAQ 「继续」 (msg `76e36d3b`) after #254 landed. Sticking to zero-visual-risk cleanup while @kenji is offline and the ChoiceCard / RadioCard primitive (Round C) still needs a visual-smoke harness to be safe. Found two more selectors with zero JSX/TSX consumers via the standard sweep against `apps/desktop/src/renderer/styles.css`: - `.providerCatalog` — bare base class. `.providerCatalogRow` / `.providerCatalogTitle` / `.providerCatalogDesc` etc. are live in `ProvidersPanel.tsx`, but nothing renders the bare class itself. - `.connectionStatus[data-ok="false"]` — combinator. No element ever carries the `connectionStatus` class in the renderer; the live status arm in the codebase is `.settingsConnectionBadge[data-tone]`, and `.providerError` (the other arm of the same rule) is unrelated and stays. Both promoted into `renderer-style-pruning-contract.test.ts`'s retired-hook list (now locks 16). `\.${hook}\b` boundary keeps the live `.providerCatalogRow` / `.settingsConnectionBadge` siblings clear.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
Bundled Round A (dead selector sweep) + Round B (shared Rich Select primitive + call-site migration) per @kenji styles inventory task #128 (
notes/maka-styles-css-inventory-2026-06-25-task-128.md) and @WAWQAQ thread#my-ai:b26d4b58msgdea869c5/61862591("做久一点 / 一次多做点", kenji handed off to me).Round B — shared
SettingsSelectprimitivepackages/ui/src/primitives/settings-select.tsx. Option type[value, label, icon?];widthvariant (compact|select|full); trigger usesSelectValue's function-child so the collapsed picked state renders the same icon + label row as the popup items (the bug fix that PR fix(ui,styles): Plan Reminder trigger logo + 100vh→100dvh sweep (kenji round 3 #2, #6) #250 only landed for Plan Reminder is now baked into the primitive itself).PlanReminderSelectincomponents.tsxcollapses to a thin<SettingsSelect width=\"full\" {...props} />specialization. Both surfaces use one source of truth.SettingsModal.tsxdrops its localSettingsSelectdefinition; the 5 existing call sites (Daily Review 分析模型 / Proxy 代理协议 / Gateway 监听地址 / Bot 域名 / Usage 状态筛选) automatically pick up the imported primitive — same[value, label]props still work..maka-plan-select*/.settingsBaseSelectTrigger*→.settingsSelect*family..settingsBaseSelectPopupblock dropped (no consumers)..settingsRow[data-control-width=\"select\"]and.settingsField[data-orient=\"horizontal\"]keep the same width contract, now keyed off.settingsSelectTrigger.Round A — dead selector sweep
Per kenji inventory the following had zero JSX/TSX consumers; re-verified each:
.maka-nav-primary(3 rules under.maka-session-panel[data-collapsed=\"true\"]).maka-skill-workbench-railBoth promoted into
renderer-style-pruning-contract.test.ts's retired-hook list (alongside the 12 already locked there). Contract test passes after deletion.Net
+162 / -148. One source of truth for Settings + Plan Reminder Select chrome; one less wrapper; ~24 lines of dead CSS gone. Round C (ChoiceCard/RadioCard) and Round D (CSS ownership split) still on kenji's plan.
Test plan
pnpm -F @maka/ui build— clean.tsc --noEmit -p apps/desktop/tsconfig.renderer.json— only the pre-existing unrelated TS2366 at line 5790.node --test dist/main/__tests__/renderer-style-pruning-contract.test.js— pass (1/1).