Org card + org switcher

import { OrgCard } from "@moodinary/ui/components/org-card";
import { useState } from "react";

// Nombres y datos de ejemplo. En la app el logo viene de Clerk.
const orgs = [
	{
		id: "colegio",
		logo: "/favicon.svg",
		meta: "La Plata · 12 equipos · Core",
		name: "Colegio Ejemplo",
	},
	{ id: "empresa", meta: "6 equipos · Gratis", name: "Estudio Norte" },
];

export default function OrgCards() {
	const [chosen, setChosen] = useState<string | null>(null);
	return (
		<div className="grid gap-3">
			{orgs.map((org) => (
				<OrgCard
					aria-pressed={chosen === org.id}
					key={org.id}
					logo={org.logo}
					meta={org.meta}
					name={org.name}
					onClick={() => setChosen(org.id)}
				/>
			))}
			<OrgCard
				disabled
				meta="Invitación pendiente"
				name="Instituto Nuevo Día"
			/>
		</div>
	);
}

import { OrgSwitcher } from "@moodinary/ui/components/org-card";
import { useState } from "react";

/* Como OrgSwitch en apps/pulses/src/components/v8/shell.tsx: sin logo, iniciales sobre navy. Sin red. */
const orgs = [
	{ id: "colegio", logo: "/favicon.svg", name: "Colegio Ejemplo" },
	{ id: "estudio", name: "Estudio Bermúdez" },
	{ id: "muni", name: "Dirección de Personal" },
];

export default function OrgSwitcherExample() {
	const [org, setOrg] = useState("colegio");
	return (
		<OrgSwitcher
			onCreate={() => undefined}
			onValueChange={setOrg}
			orgs={orgs}
			value={org}
		/>
	);
}