import React from "react";
import { renderToStaticMarkup } from "react-dom/server";
import { describe, expect, it, vi } from "vitest";
import { FloatingActionBar } from "./FloatingActionBar.js";

const noop = vi.fn();

describe("FloatingActionBar", () => {
  it("renders nothing when no items are selected", () => {
    const html = renderToStaticMarkup(
      <FloatingActionBar
        selectedAllocationCount={0}
        selectedResourceCount={0}
        onDelete={noop}
        onAssign={noop}
        onClear={noop}
        isDeleting={false}
      />,
    );
    expect(html).toBe("");
  });

  it("shows allocation count label when allocations are selected", () => {
    const html = renderToStaticMarkup(
      <FloatingActionBar
        selectedAllocationCount={2}
        selectedResourceCount={0}
        onDelete={noop}
        onAssign={noop}
        onClear={noop}
        isDeleting={false}
      />,
    );
    expect(html).toMatch(/2 allocations selected/i);
  });

  it("shows resource count label when resources are selected", () => {
    const html = renderToStaticMarkup(
      <FloatingActionBar
        selectedAllocationCount={0}
        selectedResourceCount={1}
        onDelete={noop}
        onAssign={noop}
        onClear={noop}
        isDeleting={false}
      />,
    );
    expect(html).toMatch(/1 resource selected/i);
  });

  it("shows combined label when both allocations and resources are selected", () => {
    const html = renderToStaticMarkup(
      <FloatingActionBar
        selectedAllocationCount={1}
        selectedResourceCount={1}
        onDelete={noop}
        onAssign={noop}
        onClear={noop}
        isDeleting={false}
      />,
    );
    expect(html).toMatch(/1 allocation.*1 resource/i);
  });
});
