Skip to content

feat(sdk-app): replace entity ID inputs with searchable selects#1676

Merged
aaronlee777 merged 3 commits intomainfrom
al/add-select-menu-demo-entities
May 6, 2026
Merged

feat(sdk-app): replace entity ID inputs with searchable selects#1676
aaronlee777 merged 3 commits intomainfrom
al/add-select-menu-demo-entities

Conversation

@aaronlee777
Copy link
Copy Markdown
Contributor

@aaronlee777 aaronlee777 commented May 5, 2026

Summary

Updates the SDK dev app's demo settings panel so users no longer need to know UUIDs to switch the active employee, contractor, or payroll. The entity ID text inputs are replaced with searchable two-line comboboxes populated from the API, and every entity row gains a Copy ID button.

Changes

  • Employee, Contractor, and Payroll IDs are now searchable comboboxes listing entities for the current company. Each option shows a primary label (employee/contractor name or payroll period) and the UUID below it in a muted monospace style.
  • Lists are fetched on panel open from /api/v1/companies/{companyId}/{employees,contractors,payrolls} when the proxy is in flow-token mode. When the proxy is unavailable, each combobox gracefully falls back to a plain text input.
  • Company ID becomes a read-only field.
  • Every entity row (Company, Employee, Contractor, Payroll, Request ID, Form ID) gets a Copy ID button with a "Copied" confirmation state.
  • Adds combobox/helper-line/copy-row styles to DemoSettingsPanel.module.scss.
  • New helpers extracted to entityFormatters.ts (label formatting) and useEntityCatalog.ts (fetching/caching the entity lists).

Open/close behavior

  • Clicking the input toggles the menu open and closed.
  • Clicking anywhere outside the input (label, copy button, panel background, other fields) closes the menu.
  • The selected entity name stays in the DOM (hidden via visibility while the menu is open) so opening the menu does not shift content below.
  • The menu anchors flush below the input rather than below the helper line.

Demo

Testing

  • npm run sdk-app
  • Open the demo settings panel and verify:
    • Company ID is read-only and the Copy button copies the UUID (shows "Copied" briefly).
    • Employee, Contractor, and Payroll fields show comboboxes with two-line options (name/period + UUID).
    • Selecting an option updates the active entity ID and the Update button appears.
    • Every entity row (including Request ID and Form ID) has a working Copy ID button.
    • Clicking the input toggles the menu; clicking anywhere outside (label, copy button, etc.) closes it.
    • Pressing Escape closes the menu.
    • Opening/closing the menu does not shift the fields below.
    • When running without a flow token, the three combobox fields gracefully fall back to text inputs.

🤖 Generated with Claude Code

aaronlee777 and others added 2 commits May 6, 2026 11:19
Convert employee, contractor, and payroll ID fields in the demo
settings panel to two-line dropdowns populated from the API. Make
company ID read-only with a copy button. Request and form IDs remain
text inputs.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
Clicking the input now toggles the menu, clicking outside reliably closes
it, and the entity helper line stays in the DOM so opening the menu does
not shift content below.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
@aaronlee777 aaronlee777 force-pushed the al/add-select-menu-demo-entities branch from df5d158 to 319fa19 Compare May 6, 2026 15:19
@aaronlee777 aaronlee777 marked this pull request as ready for review May 6, 2026 15:19
@aaronlee777 aaronlee777 requested a review from jeffredodd as a code owner May 6, 2026 15:19
Copilot AI review requested due to automatic review settings May 6, 2026 15:19
Arrow keys move through the menu, Enter selects the highlighted item,
Home/End jump to the first/last option, and the active option scrolls
into view and is announced via aria-activedescendant.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
@aaronlee777 aaronlee777 merged commit df352bb into main May 6, 2026
19 checks passed
@aaronlee777 aaronlee777 deleted the al/add-select-menu-demo-entities branch May 6, 2026 15:35
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants