CodeCow/stack
1
0
Fork 0
mirror of https://github.com/stack-auth/stack.git synced 2026-06-16 21:08:38 +08:00
Code Issues Actions 41 Packages Projects Releases Wiki Activity

Add team icon component for dashboard account settings.

Browse Source 
Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
Developing-Gamer 2026-05-27 12:47:47 -07:00
parent 5ed337eb38
commit 3d7eee99fb
1 changed files with 31 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

31
apps/dashboard/src/components/dashboard-account-settings/supporting/team-icon.tsx Normal file
View File

@ -0,0 +1,31 @@
'use client';
import { Avatar, AvatarImage, AvatarFallback } from "@/components/ui/avatar";
import { User } from "@phosphor-icons/react";
import { Team } from "@stackframe/stack";
export function TeamIcon(props: { team: Team | 'personal' }) {
if (props.team === 'personal') {
return (
<div className="flex items-center justify-center h-6 w-6 rounded-md bg-zinc-100 dark:bg-zinc-800 border border-black/[0.08] dark:border-white/[0.08] text-foreground/70 shadow-sm">
<User className="w-3.5 h-3.5" />
</div>
);
}
if (props.team.profileImageUrl) {
return (
<Avatar className="h-6 w-6 rounded-md border border-black/[0.08] dark:border-white/[0.08] shadow-sm">
<AvatarImage src={props.team.profileImageUrl} alt={props.team.displayName} />
<AvatarFallback className="bg-zinc-100 dark:bg-zinc-800 text-[10px] font-bold text-foreground">
{props.team.displayName.slice(0, 1).toUpperCase()}
</AvatarFallback>
</Avatar>
);
} else {
return (
<div className="flex items-center justify-center h-6 w-6 rounded-md bg-zinc-100 dark:bg-zinc-800 border border-black/[0.08] dark:border-white/[0.08] text-foreground shadow-sm">
<span className="text-[10px] font-bold">{props.team.displayName.slice(0, 1).toUpperCase()}</span>
</div>
);
}
}