// @vitest-environment jsdom

import { fireEvent, render, screen, within } from "@testing-library/react";
import { beforeEach, describe, expect, it } from "vitest";
import { AdminModalForm } from "./admin-modal-form";
import { GroupScheduleEditor, GroupScheduleSummary } from "./group-schedule-editor";

beforeEach(() => {
  HTMLDialogElement.prototype.showModal = function showModal() { this.open = true; };
  HTMLDialogElement.prototype.close = function close() {
    this.open = false;
    this.dispatchEvent(new Event("close"));
  };
});

describe("GroupScheduleEditor", () => {
  it("shows UTC authority, browser-local equivalents, and repeatable windows", () => {
    const { container } = render(<GroupScheduleEditor windows={[{
      startMinuteOfWeek: 6960,
      endMinuteOfWeek: 7199,
    }]} />);

    expect(screen.getByText(/stored and enforced in UTC/i)).toBeTruthy();
    expect(screen.getAllByRole("group", { name: /access window/i })).toHaveLength(1);
    expect(container.querySelectorAll('input[name="startMinuteOfWeek"]')).toHaveLength(1);

    fireEvent.click(screen.getByRole("button", { name: /add window/i }));
    expect(screen.getAllByRole("group", { name: /access window/i })).toHaveLength(2);
    expect(container.querySelectorAll('input[name="startMinuteOfWeek"]')).toHaveLength(2);

    fireEvent.click(screen.getAllByRole("button", { name: /remove window/i })[0]!);
    expect(screen.getAllByRole("group", { name: /access window/i })).toHaveLength(1);
  });

  it("discards an abandoned draft when its confirmation dialog is reopened", () => {
    render(<AdminModalForm action={async () => undefined} description="Confirm schedule." submitLabel="Save schedule" title="Schedule group" triggerLabel="Edit schedule"><GroupScheduleEditor windows={[{ startMinuteOfWeek: 6960, endMinuteOfWeek: 7200 }]} /></AdminModalForm>);
    fireEvent.click(screen.getByRole("button", { name: "Edit schedule" }));
    const dialog = screen.getByRole("dialog");
    fireEvent.click(within(dialog).getByRole("button", { name: "Add window" }));
    expect(within(dialog).getAllByRole("group", { name: /access window/i })).toHaveLength(2);
    fireEvent.click(within(dialog).getByRole("button", { name: "Cancel" }));

    fireEvent.click(screen.getByRole("button", { name: "Edit schedule" }));
    expect(within(dialog).getAllByRole("group", { name: /access window/i })).toHaveLength(1);
  });

  it("summarizes an unrestricted group and configured local equivalents", () => {
    const { container, rerender } = render(<GroupScheduleSummary windows={[]} />);
    expect(container.textContent).toMatch(/no schedule restrictions/i);

    rerender(<GroupScheduleSummary windows={[{ startMinuteOfWeek: 6960, endMinuteOfWeek: 7199 }]} />);
    expect(container.textContent).toMatch(/current browser-local equivalent/i);
    expect(container.textContent).toContain("Friday 20:00 UTC");
  });
});