danvics/zerobyte
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions 1

refactor: users table

Browse source
This commit is contained in:
Nicolas Meienberger 2026-03-15 12:14:38 +01:00
parent 59fcce7e40
commit 4356ace665
1 changed files with 90 additions and 84 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

32
app/client/modules/settings/components/user-management.tsx
View file

@ -139,11 +139,16 @@ export function UserManagement({ currentUser }: { currentUser: { id: string } |
No users found.
</TableCell>
</TableRow>
{filteredUsers.map((user) => (
{filteredUsers.map((user) => {
const displayName = user.name ?? user.email;
const isCurrentUser = user.id === currentUser?.id;
const isBanned = Boolean(user.banned);
return (
<TableRow key={user.id}>
<TableCell>
<div className="flex flex-col">
<span className="font-medium">{user.name ?? user.email}</span>
<span className="font-medium">{displayName}</span>
<span className="text-sm text-muted-foreground">{user.email}</span>
</div>
</TableCell>
@ -151,10 +156,10 @@ export function UserManagement({ currentUser }: { currentUser: { id: string } |
<Badge>{user.role}</Badge>
</TableCell>
<TableCell>
<Badge variant="outline" className={cn("text-red-500 border-red-500", { hidden: !user.banned })}>
<Badge variant="outline" className={cn("text-red-500 border-red-500", { hidden: !isBanned })}>
Banned
</Badge>
<Badge variant="outline" className={cn("bg-success/10 text-success", { hidden: user.banned })}>
<Badge variant="outline" className={cn("bg-success/10 text-success", { hidden: isBanned })}>
Active
</Badge>
</TableCell>
@ -164,7 +169,7 @@ export function UserManagement({ currentUser }: { currentUser: { id: string } |
variant="ghost"
size="icon"
title="Demote to User"
className={cn({ hidden: user.role !== "admin" || user.id === currentUser?.id })}
className={cn({ hidden: user.role !== "admin" || isCurrentUser })}
onClick={() => setRoleMutation.mutate({ userId: user.id, role: "user" })}
>
<ShieldAlert className="h-4 w-4" />
@ -173,7 +178,7 @@ export function UserManagement({ currentUser }: { currentUser: { id: string } |
variant="ghost"
size="icon"
title="Promote to Admin"
className={cn({ hidden: user.role === "admin" || user.id === currentUser?.id })}
className={cn({ hidden: user.role === "admin" || isCurrentUser })}
onClick={() => setRoleMutation.mutate({ userId: user.id, role: "admin" })}
>
<Shield className="h-4 w-4" />
@ -183,8 +188,8 @@ export function UserManagement({ currentUser }: { currentUser: { id: string } |
variant="ghost"
size="icon"
title="Unban user"
className={cn({ hidden: !user.banned || user.id === currentUser?.id })}
onClick={() => setUserToBan({ id: user.id, name: user.name ?? user.email, isBanned: true })}
className={cn({ hidden: !isBanned || isCurrentUser })}
onClick={() => setUserToBan({ id: user.id, name: displayName, isBanned: true })}
>
<UserCheck className="h-4 w-4" />
</Button>
@ -192,8 +197,8 @@ export function UserManagement({ currentUser }: { currentUser: { id: string } |
variant="ghost"
size="icon"
title="Ban user"
className={cn({ hidden: !!user.banned || user.id === currentUser?.id })}
onClick={() => setUserToBan({ id: user.id, name: user.name ?? user.email, isBanned: false })}
className={cn({ hidden: isBanned || isCurrentUser })}
onClick={() => setUserToBan({ id: user.id, name: displayName, isBanned: false })}
>
<Ban className="h-4 w-4" />
</Button>
@ -202,7 +207,7 @@ export function UserManagement({ currentUser }: { currentUser: { id: string } |
variant="ghost"
size="icon"
title="Delete User"
className={cn({ hidden: user.id === currentUser?.id })}
className={cn({ hidden: isCurrentUser })}
onClick={() => setUserToDelete(user.id)}
>
<Trash2 className="h-4 w-4 text-destructive" />
@ -215,7 +220,7 @@ export function UserManagement({ currentUser }: { currentUser: { id: string } |
onClick={() =>
setUserToManageAccounts({
id: user.id,
name: user.name ?? user.email,
name: displayName,
accounts: user.accounts,
})
}
@ -225,7 +230,8 @@ export function UserManagement({ currentUser }: { currentUser: { id: string } |
</div>
</TableCell>
</TableRow>
))}
);
})}
</TableBody>
</Table>
</div>