import { describe, it, expect } from "vitest";
import { mount } from "@vue/test-utils";
import { createPinia } from "pinia";
import { createRouter, createWebHashHistory } from "vue-router";
import AppShell from "../AppShell.vue";
import { useAuthStore } from "../../../stores/auth.js";

function createTestRouter() {
  return createRouter({
    history: createWebHashHistory(),
    routes: [{ path: "/", name: "home", component: { template: "<div>Home</div>" } }],
  });
}

describe("AppShell", () => {
  function mountShell(options = {}) {
    const pinia = createPinia();
    const authStore = useAuthStore(pinia);
    authStore.$patch({
      user: { id: 1, display_name: "Test" },
      permissions: [
        "areas.view", "areas.manage",
        "devices.view", "devices.scan", "devices.setup", "devices.control", "devices.edit", "devices.delete",
        "scripts.view", "scripts.run", "scripts.edit",
        "firmware.view", "firmware.upload",
      ],
    });
    const router = createTestRouter();
    return mount(AppShell, {
      global: {
        plugins: [pinia, router],
      },
      slots: { default: options.slot || "Content" },
    });
  }

  it("renders brand name", () => {
    const wrapper = mountShell({ slot: "Content" });
    expect(wrapper.text()).toContain("SHSERV WEB CLIENT");
  });

  it("renders slot content", () => {
    const wrapper = mountShell({ slot: "<p>Page Content</p>" });
    expect(wrapper.text()).toContain("Page Content");
  });

  it("renders navigation items with icons", () => {
    const wrapper = mountShell();
    expect(wrapper.text()).toContain("Favorites");
    expect(wrapper.text()).toContain("Areas");
    expect(wrapper.text()).toContain("Devices");
    expect(wrapper.text()).toContain("Scanning");
    expect(wrapper.text()).toContain("Actions");
    expect(wrapper.text()).toContain("Regular");
    expect(wrapper.text()).toContain("Scopes");
  });
});