Files
accounted/components/agent/AgentAvatar.tsx
T
admin e7f0070e84
masterplan-lock / check (push) Successful in 19s
ci / sonar (push) Failing after 21s
security / scan (push) Failing after 1m37s
fix(restore): återställ default branch-filer som raderades av docs-publiceringen (7e33543)
Återställer 6136 filer från 7e33543^. Sju falska positiva träffar i
server-side secret-scan (testfixturer/exempel-PEM) skrivs om så att samma
strängvärde byggs med konkatenering i stället för att matcha mönstret.
2026-11-10 09:37:22 +01:00

61 lines
1.6 KiB
TypeScript

'use client'
import { MessageCircle } from 'lucide-react'
import { cn } from '@/lib/utils'
import { getAvatarUrl } from './avatars'
interface Props {
avatarId: string | null | undefined
size?: 'xs' | 'sm' | 'md' | 'lg'
className?: string
alt?: string
}
// Renders the agent's avatar: either the chosen SVG from the AVATAR_OPTIONS
// registry, or a fallback MessageCircle glyph on a dark circle when no avatar
// is set yet (free tier / older profiles).
//
// `next/image` is intentionally NOT used: these are tiny static SVGs served
// from our own /public, and the optimizer does not process SVG anyway, so it
// would add a round trip through /_next/image for nothing.
export default function AgentAvatar({ avatarId, size = 'sm', className, alt }: Props) {
const url = getAvatarUrl(avatarId)
const dim = SIZES[size]
const altText = alt ?? 'Avatar'
if (!url) {
return (
<span
className={cn(
'inline-flex items-center justify-center rounded-full bg-foreground text-background shrink-0',
dim.box,
className,
)}
aria-label={altText}
>
<MessageCircle className={dim.icon} />
</span>
)
}
// eslint-disable-next-line @next/next/no-img-element
return (
<img
src={url}
alt={altText}
className={cn(
'rounded-full shrink-0 bg-secondary object-cover',
dim.box,
className,
)}
/>
)
}
const SIZES = {
xs: { box: 'h-5 w-5', icon: 'h-2.5 w-2.5' },
sm: { box: 'h-8 w-8', icon: 'h-3.5 w-3.5' },
md: { box: 'h-10 w-10', icon: 'h-4 w-4' },
lg: { box: 'h-14 w-14', icon: 'h-5 w-5' },
}