// @vitest-environment happy-dom
import { cleanup, render, screen } from "@testing-library/react";
import { afterEach, describe, expect, it } from "vitest";

import type { Session } from "../../types.js";
import { PaneTitle } from "./PaneTitle.js";

afterEach(cleanup);

function session(over: Partial<Session> = {}): Session {
  return {
    id: "s1",
    cwd: "/home/n",
    command: "claude",
    env: {},
    metadata: {},
    status: "Running",
    created_at: "2026-01-01T00:00:00Z",
    ...over,
  } as Session;
}

describe("PaneTitle", () => {
  it("falls back to a short session id when the session isn't known yet", () => {
    render(<PaneTitle sessionId="abcdef12-3456-7890-abcd-ef1234567890" />);
    expect(screen.getByText(/abcdef12/)).toBeTruthy();
  });

  it("shows the name alone when the command matches it", () => {
    render(<PaneTitle sessionId="s1" session={session({ command: "claude", metadata: { name: "claude" } })} />);
    expect(screen.getByText("claude")).toBeTruthy();
    expect(document.querySelector(".at-cmd")).toBeNull();
  });

  it("shows the command alongside a custom name", () => {
    render(
      <PaneTitle sessionId="s1" session={session({ command: "hx src/main.rs", metadata: { name: "editor" } })} />,
    );
    expect(screen.getByText("editor")).toBeTruthy();
    expect(document.querySelector(".at-cmd")).not.toBeNull();
  });

  it("never injects markup from a session name", () => {
    render(<PaneTitle sessionId="s1" session={session({ metadata: { name: "<img onerror=x>" } })} />);
    expect(document.querySelector("img")).toBeNull();
    expect(screen.getByText("<img onerror=x>")).toBeTruthy();
  });
});