feat(pm-wizard): redesign Labels step — Combobox + bulk-create banner#1154
Merged
zbigniewsobiecki merged 3 commits intodevfrom Apr 18, 2026
Merged
feat(pm-wizard): redesign Labels step — Combobox + bulk-create banner#1154zbigniewsobiecki merged 3 commits intodevfrom
zbigniewsobiecki merged 3 commits intodevfrom
Conversation
Optional `swatch` field on ComboboxOption. When set, the Combobox renders a 12×12 rounded dot before the label in both the trigger (selected value) and every option row in the dropdown. Accepts any CSS color value — hex/rgb/named. Additive; existing callers that don't set `swatch` are unchanged. PM wizard label picker (next commit) uses this so operators can distinguish `cascade-*` labels at a glance. Co-Authored-By: Claude Opus 4 (1M context) <noreply@anthropic.com>
The Labels step shipped with three controls per row — a dropdown, a text input pre-filled with the SAME value as the dropdown, and a Create button — repeated for every slot whether mapped or not. Confusing, noisy, and makes fresh setup a 5-click chore. This rewrite: - **Searchable Combobox** replaces the plain <select> for enum-mode rows (Linear + Trello). Each label shows a color swatch so `cascade-*` labels are visually distinguishable. - **Bulk-create banner** at the top: when ≥1 slot has a default but no mapping, one click creates every missing label with canonical defaults (5 clicks → 1). Hidden when every slot is mapped or when the provider doesn't declare `createLabel`. Wires the existing but previously unused `createMissingLabelsMutation` hook. - **Per-row Create form** now renders only when the slot is unmapped. Mapped rows show a single clean Combobox. Cuts visual clutter ~50%. Free-text mode (JIRA) is unchanged — plain Input per slot. The Trello and Linear `useProviderHooks` expose the new `onCreateMissingLabels` + `creatingMissingLabels` values; the adapters pass them through. JIRA doesn't declare `createLabel` so the banner stays hidden automatically. Co-Authored-By: Claude Opus 4 (1M context) <noreply@anthropic.com>
Migrates the test strategy: enum mode uses element-tree traversal (same pattern as container-pick.test.ts) because the new Combobox- based rendering can't SSR through radix Popover. Free-text mode stays on renderToStaticMarkup. Adds coverage for the new UX contracts: - Each slot renders a Combobox with `swatch` mapped from label.color. - Mapped rows get `data-mapped="true"` and `data-has-create-form="false"`. - Bulk banner renders when missing-with-defaults ≥ 1 and both onCreateLabel + onCreateMissingLabels are supplied; hides otherwise. Co-Authored-By: Claude Opus 4 (1M context) <noreply@anthropic.com>
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
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
The Labels step shipped with three controls per row — dropdown + text input (pre-filled with the same value as the dropdown) + Create button — repeated for every slot whether mapped or not. Visually chaotic, and fresh setup forced 5 sequential Create clicks for the canonical
cascade-*labels.This redesign:
<select>for enum-mode rows (Linear + Trello). Each label shows a color swatch so operators can distinguishcascade-*labels at a glance. JIRA (free-text mode) unchanged.createLabel. Wires the existing-but-unusedcreateMissingLabelsMutation.Before / after slot row:
Plus
ComboboxOptiongains an optionalswatch?: stringfield rendered as a 12×12 rounded dot in both the trigger and option rows. Additive; existing callers unchanged.Test plan
npm test— 8212 / 8212 (up 2 — net new test count after refactoring the label-mapping suite from 9 SSR tests to 10 element-tree + SSR tests)npm run lint— cleannpm run typecheck— cleancd web && npm run build— clean🤖 Generated with Claude Code