// @vitest-environment jsdom
// SPEC: PJ2026-010405 云端控制台.
// Implementation reference: draft-2026-07-13-p0-cloud-console.
// Responsibility: 验证集合视图 query 的恢复、清理与 cursor 重置行为。

import { mount } from "@vue/test-utils";
import { describe, expect, test, vi } from "vitest";
import { createMemoryHistory, createRouter } from "vue-router";
import { defineComponent, nextTick } from "vue";
import {
  useConsoleViewState,
  type ConsoleViewState,
} from "./useConsoleViewState";

describe("useConsoleViewState", () => {
  test("restores stable query fields and resets cursor when the query changes", async () => {
    const router = createRouter({
      history: createMemoryHistory(),
      routes: [{ path: "/resources", component: { template: "<div />" } }],
    });
    await router.push(
      "/resources?view=list&density=compact&q=node&filter=online&sort=-updatedAt&cursor=next&tab=nodes",
    );
    await router.isReady();

    let state!: ConsoleViewState;
    const Host = defineComponent({
      setup() {
        state = useConsoleViewState();
        return {};
      },
      template: "<div />",
    });
    const wrapper = mount(Host, { global: { plugins: [router] } });
    expect(state.view.value).toBe("list");
    expect(state.density.value).toBe("compact");
    expect(state.cursor.value).toBe("next");
    expect(state.tab.value).toBe("nodes");

    await state.update({ q: "device", view: "cards" });
    await nextTick();
    expect(router.currentRoute.value.query.q).toBe("device");
    expect(router.currentRoute.value.query.view).toBe("cards");
    expect(router.currentRoute.value.query.cursor).toBeUndefined();
    wrapper.unmount();
  });

  test("rejects unsupported display modes without persisting a second authority", async () => {
    const router = createRouter({
      history: createMemoryHistory(),
      routes: [{ path: "/resources", component: { template: "<div />" } }],
    });
    await router.push("/resources?view=tiles&density=huge");
    await router.isReady();

    let state!: ConsoleViewState;
    const Host = defineComponent({
      setup() {
        state = useConsoleViewState();
        return {};
      },
      template: "<div />",
    });
    const wrapper = mount(Host, { global: { plugins: [router] } });
    expect(state.view.value).toBe("cards");
    expect(state.density.value).toBe("comfortable");
    wrapper.unmount();
  });

  test("supports page-specific view modes and avoids duplicate history entries", async () => {
    const router = createRouter({
      history: createMemoryHistory(),
      routes: [{ path: "/resources", component: { template: "<div />" } }],
    });
    await router.push("/resources?view=list");
    await router.isReady();

    let state!: ConsoleViewState<"matrix" | "list">;
    const Host = defineComponent({
      setup() {
        state = useConsoleViewState({
          view: "matrix",
          viewValues: ["matrix", "list"],
        });
        return {};
      },
      template: "<div />",
    });
    const wrapper = mount(Host, { global: { plugins: [router] } });
    expect(state.view.value).toBe("list");

    const replace = vi.spyOn(router, "replace");
    await state.update({ view: "list" });
    expect(replace).not.toHaveBeenCalled();

    await state.update({ view: undefined });
    expect(router.currentRoute.value.query.view).toBeUndefined();
    expect(state.view.value).toBe("matrix");
    wrapper.unmount();
  });
});
