import { render, screen } from "@testing-library/react";
import userEvent from "@testing-library/user-event";
import { beforeEach, expect, test } from "vitest";
import { TimeZoneProvider, useTimeZone } from "@/app/timezone/TimeZoneProvider.jsx";
import { RoomTurnoverRewardConfigSummary } from "./RoomTurnoverRewardConfigSummary.jsx";

const updatedAtMs = Date.UTC(2026, 5, 7, 5, 4, 13);

beforeEach(() => {
  window.localStorage.clear();
});

test("formats summary update time through the selected admin timezone", async () => {
  const user = userEvent.setup();

  render(
    <TimeZoneProvider>
      <SummaryFixture />
    </TimeZoneProvider>
  );

  expect(screen.queryByText(String(updatedAtMs))).not.toBeInTheDocument();
  expect(screen.getByText("2026-06-07 13:04:13")).toBeInTheDocument();

  await user.click(screen.getByRole("button", { name: "UTC" }));

  expect(screen.getByText("2026-06-07 05:04:13")).toBeInTheDocument();
  expect(screen.queryByText(String(updatedAtMs))).not.toBeInTheDocument();
});

function SummaryFixture() {
  const { setTimeZone } = useTimeZone();

  return (
    <>
      <button type="button" onClick={() => setTimeZone("UTC")}>
        UTC
      </button>
      <RoomTurnoverRewardConfigSummary
        canUpdate
        config={{
          enabled: true,
          tiers: [{ rewardCoinAmount: 50, status: "active" }],
          updatedAtMs
        }}
        configLoading={false}
        onEdit={() => {}}
        onRefresh={() => {}}
      />
    </>
  );
}
