import type { ConsoleUiKind } from "./consoleThemes";
import type { SystemId } from "./types";

/** Browse / home shell the player picks after signup (or in settings). */
export type UiSkinId =
  | "classic"
  | "ps3-xmb"
  | "psp-xmb"
  | "nes"
  | "snes"
  | "n64"
  | "gba"
  | "genesis"
  | "arcade";

export interface UiSkinDef {
  id: UiSkinId;
  name: string;
  blurb: string;
  /** Visual family for console shells; classic uses the redesigned site chrome. */
  mode: "classic" | "console";
  consoleKind?: ConsoleUiKind;
  /** System id used to resolve theme chrome when mode is console */
  themeSystem?: SystemId;
  preview: {
    bg: string;
    accent: string;
    label: string;
  };
}

export const UI_SKINS: UiSkinDef[] = [
  {
    id: "classic",
    name: "HollowCade",
    blurb: "Amber CRT cabinet — brand-first library shelf.",
    mode: "classic",
    preview: {
      bg: "linear-gradient(160deg,#120e0a,#2a1a0c 50%,#0a0b0f)",
      accent: "#f0a030",
      label: "CADE",
    },
  },
  {
    id: "ps3-xmb",
    name: "PS3 XMB",
    blurb: "Wave Cross Media Bar — icons across, games down.",
    mode: "console",
    consoleKind: "ps3-xmb",
    themeSystem: "psx",
    preview: {
      bg: "linear-gradient(180deg,#1a3a5c,#0a1520)",
      accent: "#7eb8ff",
      label: "XMB",
    },
  },
  {
    id: "psp-xmb",
    name: "PSP",
    blurb: "Handheld XMB in a portable frame.",
    mode: "console",
    consoleKind: "psp-xmb",
    themeSystem: "psp",
    preview: {
      bg: "linear-gradient(180deg,#2a3040,#12151c)",
      accent: "#c0c8d8",
      label: "PSP",
    },
  },
  {
    id: "nes",
    name: "NES Shelf",
    blurb: "Grey brick cartridge select.",
    mode: "console",
    consoleKind: "nes",
    themeSystem: "nes",
    preview: {
      bg: "linear-gradient(180deg,#6b6b6b,#2a2a2a)",
      accent: "#c0392b",
      label: "NES",
    },
  },
  {
    id: "snes",
    name: "SNES Shelf",
    blurb: "Purple era cartridge rack.",
    mode: "console",
    consoleKind: "snes",
    themeSystem: "snes",
    preview: {
      bg: "linear-gradient(180deg,#4a3a6b,#1e1528)",
      accent: "#b08cff",
      label: "SNES",
    },
  },
  {
    id: "n64",
    name: "N64 Shelf",
    blurb: "Get N or get out.",
    mode: "console",
    consoleKind: "n64",
    themeSystem: "n64",
    preview: {
      bg: "linear-gradient(180deg,#1a4a2a,#0c1a10)",
      accent: "#3ddc84",
      label: "N64",
    },
  },
  {
    id: "gba",
    name: "GBA Handheld",
    blurb: "Portable glow, AGS library.",
    mode: "console",
    consoleKind: "gba",
    themeSystem: "gba",
    preview: {
      bg: "linear-gradient(180deg,#3a4a6b,#141c28)",
      accent: "#7aa2ff",
      label: "GBA",
    },
  },
  {
    id: "genesis",
    name: "Genesis Shelf",
    blurb: "Blast Processing black & red.",
    mode: "console",
    consoleKind: "genesis",
    themeSystem: "genesis",
    preview: {
      bg: "linear-gradient(180deg,#1a1a1a,#3a0a0a)",
      accent: "#e74c3c",
      label: "MD",
    },
  },
  {
    id: "arcade",
    name: "Arcade Cab",
    blurb: "Insert coin. Attract-mode flash.",
    mode: "console",
    consoleKind: "arcade",
    themeSystem: "arcade",
    preview: {
      bg: "linear-gradient(180deg,#1a0a20,#0a0a0a)",
      accent: "#ff2a6d",
      label: "1UP",
    },
  },
];

export function getUiSkin(id: string | undefined | null): UiSkinDef {
  return UI_SKINS.find((s) => s.id === id) ?? UI_SKINS[0];
}

const PREFERRED_UI_KEY = "hollowcade_preferred_ui";

/** Sync read for first paint — avoids HollowCade flash on profile navigations. */
export function getCachedPreferredUi(): UiSkinId | null {
  if (typeof window === "undefined") return null;
  try {
    const raw = localStorage.getItem(PREFERRED_UI_KEY);
    if (!raw) return null;
    return UI_SKINS.some((s) => s.id === raw) ? (raw as UiSkinId) : null;
  } catch {
    return null;
  }
}

export function setCachedPreferredUi(id: string | undefined | null) {
  if (typeof window === "undefined" || !id) return;
  try {
    if (UI_SKINS.some((s) => s.id === id)) {
      localStorage.setItem(PREFERRED_UI_KEY, id);
    }
  } catch {
    /* ignore quota / private mode */
  }
}

export function resolvePreferredUi(
  accountUi?: string | null,
  profileUi?: string | null,
): UiSkinId {
  const fromAccount = accountUi && UI_SKINS.some((s) => s.id === accountUi)
    ? (accountUi as UiSkinId)
    : null;
  const fromProfile = profileUi && UI_SKINS.some((s) => s.id === profileUi)
    ? (profileUi as UiSkinId)
    : null;
  return fromAccount ?? fromProfile ?? getCachedPreferredUi() ?? "classic";
}

export const AVATARS = [
  { id: "default", label: "Signal", color: "#f0a030" },
  { id: "phosphor", label: "Phosphor", color: "#7dffb3" },
  { id: "cobalt", label: "Cobalt", color: "#5b8def" },
  { id: "crimson", label: "Crimson", color: "#e74c3c" },
  { id: "violet", label: "Violet", color: "#9b59b6" },
  { id: "sand", label: "Sand", color: "#c4a574" },
  { id: "ice", label: "Ice", color: "#a8d8ea" },
  { id: "gold", label: "Gold", color: "#f1c40f" },
] as const;

export type AvatarId = (typeof AVATARS)[number]["id"];