import { expect } from "e2e";
import { test, WEB } from "./t3.ts";

test("Legacy collapsed project stays closed after a UI-state save and reload", WEB, async ({ t3, app, screen, browser }) => {
  const a = await t3.project("Project A");
  const b = await t3.project("Project B");
  await t3.thread({ project: a, title: "A saved thread", messages: ["Hello"] });
  await t3.thread({ project: b, title: "B saved thread", messages: ["Hello"] });
  await t3.open();
  await browser.evaluate(({ a, b }) => {
    sessionStorage.setItem("legacy-seed", JSON.stringify({ expandedProjectCwds: [a], projectOrderCwds: [a, b] }));
  }, { a, b });
  await browser.addInitScript(() => {
    const legacy = sessionStorage.getItem("legacy-seed");
    if (legacy) {
      localStorage.setItem("t3code:ui-state:v1", legacy);
      localStorage.setItem("t3code:client-settings:v1", JSON.stringify({ boringSidebarEnabled: true, onboardingCompletedAt: "2026-01-01T00:00:00.000Z", theme: "dark" }));
      sessionStorage.removeItem("legacy-seed");
    }
  });
  await browser.reload();
  const folderA = screen.getByRole("button", /^Project A/);
  const folderB = screen.getByRole("button", /^Project B/);
  await expect(folderB).toHaveAttribute("aria-expanded", "false");
  await app.screenshot("legacy-state-before-save");
  await folderA.tap();
  // Allow the real store's 500 ms persistence debounce to finish, without changing B.
  await browser.evaluate(async () => {
    await new Promise<void>((resolve) => {
      const check = () => {
        const value = JSON.parse(localStorage.getItem("t3code:ui-state:v1") ?? "{}");
        if (value.projectExpandedById) resolve();
        else setTimeout(check, 50);
      };
      check();
    });
  });
  await browser.reload();
  await screen.getByRole("button", /^Project B/).waitFor({ state: "visible" });
  await app.screenshot("after-save-and-reload");
  await expect(screen.getByRole("button", /^Project B/)).toHaveAttribute("aria-expanded", "false");
});