"use client";

import { useEffect, useState } from "react";
import type { ConsoleUiKind } from "@/lib/consoleThemes";
import { playUi } from "@/lib/consoleUiAudio";

const BOOT_COPY: Partial<Record<ConsoleUiKind, { line1: string; line2?: string }>> =
  {
    "ps3-xmb": { line1: "HollowCade", line2: "PlayStation Library" },
    "psp-xmb": { line1: "PSP", line2: "XrossMediaBar" },
    nes: { line1: "NES", line2: "PLEASE WAIT" },
    snes: { line1: "SUPER NES", line2: "LOADING…" },
    n64: { line1: "NINTENDO 64", line2: "STARTING…" },
    gb: { line1: "GAME BOY", line2: "…" },
    gbc: { line1: "GAME BOY COLOR", line2: "…" },
    gba: { line1: "GAME BOY ADVANCE", line2: "…" },
    nds: { line1: "NINTENDO DS", line2: "Touch the menu" },
    genesis: { line1: "SEGA", line2: "GENESIS" },
    sms: { line1: "MASTER SYSTEM", line2: "SEGA" },
    arcade: { line1: "ARCADE", line2: "INSERT COIN" },
    atari2600: { line1: "ATARI", line2: "2600" },
    vb: { line1: "VIRTUAL BOY", line2: "RED ALERT" },
  };

export function ConsoleBoot({
  kind,
  onDone,
  durationMs = 1400,
}: {
  kind: ConsoleUiKind;
  onDone: () => void;
  durationMs?: number;
}) {
  const [fade, setFade] = useState(false);
  const copy = BOOT_COPY[kind] ?? { line1: "HollowCade" };

  useEffect(() => {
    playUi(kind, "boot");
    const fadeT = window.setTimeout(() => setFade(true), durationMs - 350);
    const doneT = window.setTimeout(onDone, durationMs);
    return () => {
      window.clearTimeout(fadeT);
      window.clearTimeout(doneT);
    };
  }, [kind, durationMs, onDone]);

  return (
    <div className={`console-boot console-boot--${kind}${fade ? " is-out" : ""}`}>
      <div className="console-boot-inner">
        <p className="console-boot-l1">{copy.line1}</p>
        {copy.line2 && <p className="console-boot-l2">{copy.line2}</p>}
      </div>
    </div>
  );
}