Fix member selection checkboxes showing for all rows regardless of status

Previously checkboxes only appeared for users with status NONE (Not Invited),
hiding them for INVITED/ACTIVE members and making "Select all" confusing.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
Matt 2026-02-14 18:38:54 +01:00
parent c321d4711e
commit c634982835
1 changed files with 88 additions and 95 deletions

View File

@ -171,9 +171,8 @@ export function MembersContent() {
}, },
}) })
// Users on the current page that are selectable (status NONE)
const selectableUsers = useMemo( const selectableUsers = useMemo(
() => (data?.users ?? []).filter((u) => u.status === 'NONE'), () => data?.users ?? [],
[data?.users] [data?.users]
) )
@ -323,7 +322,7 @@ export function MembersContent() {
<Checkbox <Checkbox
checked={allSelectableSelected ? true : someSelectableSelected ? 'indeterminate' : false} checked={allSelectableSelected ? true : someSelectableSelected ? 'indeterminate' : false}
onCheckedChange={toggleAll} onCheckedChange={toggleAll}
aria-label="Select all uninvited members" aria-label="Select all members"
/> />
)} )}
</TableHead> </TableHead>
@ -340,15 +339,11 @@ export function MembersContent() {
{data.users.map((user) => ( {data.users.map((user) => (
<TableRow key={user.id}> <TableRow key={user.id}>
<TableCell> <TableCell>
{user.status === 'NONE' ? (
<Checkbox <Checkbox
checked={selectedIds.has(user.id)} checked={selectedIds.has(user.id)}
onCheckedChange={() => toggleUser(user.id)} onCheckedChange={() => toggleUser(user.id)}
aria-label={`Select ${user.name || user.email}`} aria-label={`Select ${user.name || user.email}`}
/> />
) : (
<span />
)}
</TableCell> </TableCell>
<TableCell> <TableCell>
<div className="flex items-center gap-3"> <div className="flex items-center gap-3">
@ -438,14 +433,12 @@ export function MembersContent() {
<CardHeader className="pb-3"> <CardHeader className="pb-3">
<div className="flex items-start justify-between"> <div className="flex items-start justify-between">
<div className="flex items-center gap-3"> <div className="flex items-center gap-3">
{user.status === 'NONE' && (
<Checkbox <Checkbox
checked={selectedIds.has(user.id)} checked={selectedIds.has(user.id)}
onCheckedChange={() => toggleUser(user.id)} onCheckedChange={() => toggleUser(user.id)}
aria-label={`Select ${user.name || user.email}`} aria-label={`Select ${user.name || user.email}`}
className="mt-1" className="mt-1"
/> />
)}
<UserAvatar <UserAvatar
user={user} user={user}
avatarUrl={(user as Record<string, unknown>).avatarUrl as string | undefined} avatarUrl={(user as Record<string, unknown>).avatarUrl as string | undefined}