import type { WalletKind } from "./injected";

type Brand = { bg: string; label: string };

const brands: Record<WalletKind, Brand> = {
  tokenPocket: { bg: "#2980FE", label: "TP" },
  metaMask: { bg: "#F6851B", label: "M" },
  imToken: { bg: "#11C4D1", label: "im" },
};

export function WalletBrandIcon({
  kind,
  size = 28,
}: {
  kind: WalletKind;
  size?: number;
}) {
  const brand = brands[kind];
  return (
    <span
      aria-hidden="true"
      style={{ width: size, height: size, backgroundColor: brand.bg }}
      className="inline-flex shrink-0 items-center justify-center rounded-lg text-[11px] font-bold leading-none text-white"
    >
      {brand.label}
    </span>
  );
}