import { test, expect, Page } from "@playwright/test";

test("cox can create and delete trip", async ({ page }) => {
  await page.goto("http://localhost:8000/auth");
  await page.getByPlaceholder("Name").click();
  await page.getByPlaceholder("Name").fill("cox");
  await page.getByPlaceholder("Name").press("Tab");
  await page.getByPlaceholder("Passwort").fill("cox");
  await page.getByPlaceholder("Passwort").press("Enter");
  await page.getByRole("link", { name: "Geplante Ausfahrten" }).click();
  await page.locator(".relative").first().click();
  await page.locator("#sidebar #planned_starting_time").click();
  await page.locator("#sidebar #planned_starting_time").fill("18:00");
  await page.locator("#sidebar #planned_starting_time").press("Tab");
  await page.locator("#sidebar #planned_starting_time").press("Tab");
  await page.getByRole("spinbutton").fill("5");
  await page.getByRole("button", { name: "Erstellen", exact: true }).click();
  await expect(page.locator("body")).toContainText("18:00 Uhr (cox) Details");

  await page.goto("http://localhost:8000/planned");
  await page.getByRole("link", { name: "Details" }).click();
  await page.getByRole("link", { name: "Termin löschen" }).click();
  await expect(page.locator("body")).toContainText("Erfolgreich gelöscht!");
});

// TODO: group -> cox can create trips
// TODO: cox can help/register at trips/events

test.describe("cox can edit trips", () => {
  let sharedPage: Page;

  test.beforeAll(async ({ browser }) => {
    const page = await browser.newPage();

    await page.goto("http://localhost:8000/auth");
    await page.getByPlaceholder("Name").click();
    await page.getByPlaceholder("Name").fill("cox");
    await page.getByPlaceholder("Name").press("Tab");
    await page.getByPlaceholder("Passwort").fill("cox");
    await page.getByPlaceholder("Passwort").press("Enter");
    await page.getByRole("link", { name: "Geplante Ausfahrten" }).click();
    await page.locator(".relative").first().click();
    await page.locator("#sidebar #planned_starting_time").click();
    await page.locator("#sidebar #planned_starting_time").fill("18:00");
    await page.locator("#sidebar #planned_starting_time").press("Tab");
    await page.locator("#sidebar #planned_starting_time").press("Tab");
    await page.getByRole("spinbutton").fill("5");
    await page.getByRole("button", { name: "Erstellen", exact: true }).click();

    sharedPage = page;
  });

  test("edit remarks", async () => {
    await sharedPage.goto("http://localhost:8000/planned");
    await sharedPage.getByRole("link", { name: "Details" }).click();
    await sharedPage.locator("#sidebar #notes").click();
    await sharedPage.locator("#sidebar #notes").fill("Meine Anmerkung");
    await sharedPage.getByRole("button", { name: "Speichern" }).click();
    await sharedPage.getByRole("link", { name: "Details" }).click();
    await expect(sharedPage.locator("#sidebar")).toContainText(
      "Meine Anmerkung",
    );

    await sharedPage
      .getByRole("button", { name: "Ausfahrt erstellen schließen" })
      .click();
  });

  test("add and remove guest", async () => {
    await sharedPage.goto("http://localhost:8000/planned");
    await sharedPage.getByRole("link", { name: "Details" }).click();
    await sharedPage.locator("#sidebar #user_note").click();
    await sharedPage.locator("#sidebar #user_note").fill("Mein Gast");
    await sharedPage.getByRole("button", { name: "Gast hinzufügen" }).click();
    await expect(sharedPage.locator("body")).toContainText(
      "Erfolgreich angemeldet!",
    );
    await sharedPage.getByRole("link", { name: "Details" }).click();
    await expect(sharedPage.locator("#sidebar")).toContainText(
      "Freie Plätze: 4",
    );
    await expect(sharedPage.locator("#sidebar")).toContainText(
      "Mein Gast (Gast) Abmelden",
    );
    await expect(
      sharedPage.getByRole("link", { name: "Termin löschen" }),
    ).not.toBeVisible();

    await sharedPage.getByRole("link", { name: "Abmelden" }).click();
    await expect(sharedPage.locator("body")).toContainText(
      "Erfolgreich abgemeldet!",
    );
    await sharedPage.getByRole("link", { name: "Details" }).click();
    await expect(sharedPage.locator("#sidebar")).toContainText(
      "Freie Plätze: 5",
    );
    await expect(sharedPage.locator("#sidebar")).toContainText(
      "Keine Ruderer angemeldet",
    );
    await expect(
      sharedPage.getByRole("link", { name: "Termin löschen" }),
    ).toBeVisible();

    await sharedPage
      .getByRole("button", { name: "Ausfahrt erstellen schließen" })
      .click();
  });

  test("change amount rower", async () => {
    await sharedPage.goto("http://localhost:8000/planned");
    await sharedPage.getByRole("link", { name: "Details" }).click();
    await expect(sharedPage.locator("#sidebar")).toContainText(
      "Freie Plätze: 5",
    );
    await sharedPage.getByRole("spinbutton").click();
    await sharedPage.getByRole("spinbutton").fill("3");
    await sharedPage.getByRole("button", { name: "Speichern" }).click();
    await expect(sharedPage.locator("body")).toContainText(
      "Ausfahrt erfolgreich aktualisiert.",
    );
  });

  test("call off trip", async () => {
    await sharedPage.goto("http://localhost:8000/planned");
    await sharedPage.getByRole("link", { name: "Details" }).click();
    await expect(sharedPage.locator("#sidebar")).toContainText(
      "Freie Plätze: 3",
    );
    await sharedPage.getByRole("spinbutton").click();
    await sharedPage.getByRole("spinbutton").fill("0");
    await sharedPage.getByRole("button", { name: "Speichern" }).click();
    await expect(sharedPage.locator("body")).toContainText(
      "Ausfahrt erfolgreich aktualisiert.",
    );
    await expect(sharedPage.locator("body")).toContainText("(Absage cox)");
  });

  test.afterAll(async () => {
    await sharedPage.goto("http://localhost:8000/planned");
    await sharedPage.getByRole("link", { name: "Details" }).click();
    await sharedPage.getByRole("link", { name: "Termin löschen" }).click();
    await sharedPage.close();
  });

  // TODO: 'Immer anzeigen' (also verify the functionality), 'Gesperrt' + type
});