import { describe, it, expect } from "vitest";
import { readFileSync } from "node:fs";
import { resolve } from "node:path";

describe("Mietkatalog Page (prototype port)", () => {
  const pagePath = resolve(__dirname, "../../pages/mietkatalog.vue");
  const content = readFileSync(pagePath, "utf-8");

  it("should have page title Mietkatalog", () => {
    expect(content).toContain("Mietkatalog");
  });

  it("should have search input with hms-input", () => {
    expect(content).toContain('type="search"');
    expect(content).toContain("hms-input");
    expect(content).toContain("searchQuery");
  });

  it("should have sort dropdown", () => {
    expect(content).toContain("sortBy");
    expect(content).toContain("name");
    expect(content).toContain("brand");
    expect(content).toContain("code");
  });

  it("should have category filter chips with hms-chip", () => {
    expect(content).toContain("hms-chip");
    expect(content).toContain("activeCategory");
    expect(content).toContain("Tontechnik");
    expect(content).toContain("Lichttechnik");
    expect(content).toContain("Rigging");
  });

  it("should show result count", () => {
    expect(content).toContain("filteredEquipment.length");
    expect(content).toContain("Gerät");
    expect(content).toContain("gefunden");
  });

  it("should use LoadingSkeleton component", () => {
    expect(content).toContain("LoadingSkeleton");
  });

  it("should use ErrorState component", () => {
    expect(content).toContain("ErrorState");
  });

  it("should use EmptyState component", () => {
    expect(content).toContain("EmptyState");
  });

  it("should render EquipmentCard for each item", () => {
    expect(content).toContain("EquipmentCard");
    expect(content).toContain("filteredEquipment");
  });

  it("should have 18 equipment items", () => {
    expect(content).toContain("L-Acoustics K2");
    expect(content).toContain("Shure SM58");
    expect(content).toContain("Sennheiser EW-DX 835");
  });

  it("should have Warenkorb button", () => {
    expect(content).toContain("Warenkorb ansehen");
  });

  it("should use TypeScript with lang=ts", () => {
    expect(content).toContain('<script setup lang="ts">');
  });

  it("should use hms-card for filter panel", () => {
    expect(content).toContain("hms-card");
  });
});

describe("EquipmentCard Component (prototype port)", () => {
  const cardPath = resolve(__dirname, "../../components/EquipmentCard.vue");
  const content = readFileSync(cardPath, "utf-8");

  it("should have hms-eq-card class", () => {
    expect(content).toContain("hms-eq-card");
  });

  it("should have image with fallback placeholder", () => {
    expect(content).toContain("item.image");
    expect(content).toContain("📦");
  });

  it("should show category badge", () => {
    expect(content).toContain("hms-badge");
    expect(content).toContain("hms-badge-primary");
    expect(content).toContain("item.category");
  });

  it("should display equipment name", () => {
    expect(content).toContain("item.name");
  });

  it("should show truncated description", () => {
    expect(content).toContain("item.description");
    expect(content).toContain("line-clamp");
  });

  it("should display item code", () => {
    expect(content).toContain("item.code");
  });

  it("should emit add-to-cart", () => {
    expect(content).toContain("add-to-cart");
  });

  it("should have Hinzufügen button", () => {
    expect(content).toContain("Hinzufügen");
    expect(content).toContain("hms-btn-ghost");
  });

  it("should emit click", () => {
    expect(content).toContain("click");
  });

  it("should use TypeScript with lang=ts", () => {
    expect(content).toContain('<script setup lang="ts">');
  });
});