danabra.mov
forked from
slices.network/slices
Highly ambitious ATProtocol AppView service and sdks
chadtmiller.com
add new frontend client using graphql and relay, get graphql schema at feature parity with the xrpc endpoints
1import { DefaultAvatar } from "./DefaultAvatar.tsx";
2
3interface AvatarProps {
4 src?: string | null;
5 alt: string;
6 size?: "sm" | "md" | "lg";
7}
8
9export function Avatar({ src, alt, size = "md" }: AvatarProps) {
10 const sizeClasses = {
11 sm: "w-6 h-6",
12 md: "w-12 h-12",
13 lg: "w-16 h-16",
14 };
15
16 const sizePx = {
17 sm: 24,
18 md: 48,
19 lg: 64,
20 };
21
22 const sizeClass = sizeClasses[size];
23 const sizePxValue = sizePx[size];
24
25 if (src) {
26 return (
27 <img
28 src={src}
29 alt={alt}
30 className={`${sizeClass} rounded-full flex-shrink-0`}
31 />
32 );
33 }
34
35 return (
36 <div className={`${sizeClass} rounded-full flex-shrink-0 overflow-hidden`}>
37 <DefaultAvatar size={sizePxValue} />
38 </div>
39 );
40}