PR: #496: feat(settings): use select for invite team role [Story-1972] by @ayush-pramaan

Story-1972

Invite member uses a name-only Team role dropdown

The invite-member sheet's Team role control is now a closed Radix Select dropdown built from src/components/ui/select.tsx. The trigger shows Choose a team role until a role is selected, then shows only that role name. Opening the trigger shows a listbox of the firm's roles, also name-only, with the existing Select item check on the selected row.

What changed

Picker internals simplified

TeamRoleSelect no longer owns search query state, Input, or RadioGroup cards. It composes Select, SelectTrigger, SelectValue, SelectContent, and SelectItem.

Contract preserved

The invite form still writes the same teamRoleId string through the existing Controller name="teamRoleId". The zod schema and invitation metadata contract were not changed.

Name-only rows

Role access/capability is intentionally absent from this picker. Access remains derived from the selected role and configured on the Team roles page.

Empty catalog is safe

If the firm has no roles, the select is disabled and the component renders the existing empty affordance instead of crashing.

Storybook states

Settings/Team/TeamRoleSelect / Placeholder
Settings/Team/TeamRoleSelect / Open list
Settings/Team/TeamRoleSelect / Selected
Settings/Team/TeamRoleSelect / Disabled
Settings/Team/TeamRoleSelect / Empty catalog

The running Storybook iframe was checked with Playwright for all five states: placeholder text, open option list, selected role text, disabled trigger, and empty-catalog status copy.

Tests and scope guards

team-role-select.test.tsx confirms selecting "Senior Advocate" emits the role id, and the empty catalog is disabled.
team-list-page.test.tsx still proves the invite submit payload contains teamRoleId.
The member "Change role" submenu, team list role columns, invitation schema, OpenAPI mirror, and codegen output were not touched.

Verification

pnpm lint
# passes with one pre-existing add-matter/avatar.tsx no-img-element warning

pnpm test
# 156 files passed, 983 tests passed

pnpm build
# Next.js production build passed

git diff --check
# passed

Files changed

8 file(s), +168 / -86 lines

Path	Role	+	-
messages/en.json	Config	+1	-4
messages/hi.json	Config	+1	-4
src/components/settings/team/invite-member-fields.tsx	Component	+1	-0
src/components/settings/team/team-list-page.test.tsx	Component	+15	-1
src/components/settings/team/team-role-select.stories.tsx	Component	+13	-5
src/components/settings/team/team-role-select.test.tsx	Component	+77	-0
src/components/settings/team/team-role-select.tsx	Component	+43	-71
tests/setup.ts	Test	+17	-1