Kartikeya
e26961d526
Replace the single join form with a richer UI: team cards (members as avatars, repo, description), a member picker, and a post-join PodView showing pod members (you highlighted) plus a PodMan panel with a slot for live intervention cards. Adds Avatar/TeamCard/PodView components. Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
37 lines
822 B
TypeScript
37 lines
822 B
TypeScript
function colorFor(name: string): string {
|
|
let h = 0;
|
|
for (let i = 0; i < name.length; i++) h = (h * 31 + name.charCodeAt(i)) % 360;
|
|
return `hsl(${h} 55% 42%)`;
|
|
}
|
|
|
|
function initials(name: string): string {
|
|
return name
|
|
.split(/\s+/)
|
|
.map((w) => w[0] ?? '')
|
|
.join('')
|
|
.slice(0, 2)
|
|
.toUpperCase();
|
|
}
|
|
|
|
export function Avatar({
|
|
name,
|
|
size = 36,
|
|
ring = false,
|
|
}: {
|
|
name: string;
|
|
size?: number;
|
|
ring?: boolean;
|
|
}) {
|
|
return (
|
|
<div
|
|
className={`flex shrink-0 items-center justify-center rounded-full font-semibold text-white ${
|
|
ring ? 'ring-2 ring-emerald-400 ring-offset-2 ring-offset-slate-950' : ''
|
|
}`}
|
|
style={{ width: size, height: size, background: colorFor(name), fontSize: size * 0.38 }}
|
|
title={name}
|
|
>
|
|
{initials(name)}
|
|
</div>
|
|
);
|
|
}
|