import { expect, test } from "bun:test";
import { renderToStaticMarkup as render } from "react-dom/server";
import { GameSettings } from "../src/client/components/redesign/GameSettings.tsx";
import { migrateLegacy } from "../src/client/state/reader/migration.ts";
test("game settings explains simultaneous server tracking and credits zero-event sources", () => {
  const at = "2026-10-16T12:00:00.000Z",
    state = migrateLegacy({}, ["genshin"], at, () => "account:one");
  const html = render(
    <GameSettings
      state={state}
      initialGame="genshin"
      sources={[
        {
          sourceId: "genshin-extra",
          game: "genshin",
          url: "https://example.com/events",
          lastSuccessAt: null,
          lastConfirmedAt: null,
          contentChangedAt: null,
          eventCount: 0,
          parsedCount: null,
          statesNoEvents: false,
        },
      ]}
      onAction={async () => ({ ok: true })}
    />,
  );
  expect(html).toContain("track both accounts separately");
  expect(html).toContain("Track another server");
  expect(html).toContain("Automatic");
  expect(html).toContain("Reset to default");
  // Tracking choices save on click; there is no separate apply step.
  expect(html).not.toContain("Apply tracking choices");
  // A kind with no built-in routine is explained and still selectable.
  expect(html).toContain("none built in");
  expect(html).not.toMatch(/<button[^>]*disabled[^>]*data-st/);
});

import { AppearancePage } from "../src/client/components/redesign/AppearancePage.tsx";
test("Appearance orders only the games being tracked, with up and down buttons", () => {
  const at = "2026-10-16T12:00:00.000Z",
    state = migrateLegacy(
      {},
      ["genshin", "hsr", "zzz"],
      at,
      (() => {
        let n = 0;
        return () => `account:${++n}`;
      })(),
    );
  state.prefs.hiddenGames = ["zzz"];
  const html = render(
    <AppearancePage state={state} onAction={async () => ({ ok: true })} />,
  );
  expect(html).toContain("Game order");
  expect(html).toContain("Move Genshin Impact down");
  expect(html).toContain("Move Honkai: Star Rail up");
  expect(html).not.toContain("Move Zenless Zone Zero");
  expect(html).not.toContain("Sort A–Z");
});

test("game settings shows the tab the parent holds, so switching games keeps it", () => {
  const at = "2026-10-16T12:00:00.000Z",
    ids = ["account:one", "account:two"],
    state = migrateLegacy({}, ["genshin", "zzz"], at, () => ids.shift()!);
  const html = (game: string) =>
    render(
      <GameSettings
        state={state}
        initialGame={game}
        tab="codes"
        onTab={() => {}}
        sources={[]}
        onAction={async () => ({ ok: true })}
      />,
    );
  for (const game of ["genshin", "zzz"]) {
    expect(html(game)).toContain('data-tab="codes" aria-pressed="true"');
    expect(html(game)).toContain("Redeem codes");
  }
});