import { describe, it, expect } from "vitest";
import { render, screen } from "@testing-library/react";
import { MetricCard } from "../MetricCard";

describe("MetricCard", () => {
	it("renders the label, value, and subtext on the comfortable ramp", () => {
		render(
			<MetricCard label="Movies" value="1,234" subtext="across 3 libraries" />,
		);
		expect(screen.getByText("Movies")).toBeInTheDocument();
		expect(screen.getByText("1,234")).toBeInTheDocument();
		expect(screen.getByText(/across 3 libraries/)).toBeInTheDocument();
	});

	it("omits subtext when not provided", () => {
		render(<MetricCard label="Series" value="42" />);
		expect(screen.getByText("Series")).toBeInTheDocument();
		expect(screen.getByText("42")).toBeInTheDocument();
		expect(screen.queryByText(/subtext/i)).not.toBeInTheDocument();
	});
});