"use client";

import { render, screen } from "@testing-library/react";
import userEvent from "@testing-library/user-event";
import { describe, expect, it } from "vitest";
import type { ColumnDef } from "@tanstack/react-table";
import { DataTable } from "@/components/common/data-table";

type Row = { name: string; status: string };

const columns: ColumnDef<Row>[] = [
  { accessorKey: "name", header: "Name" },
  { accessorKey: "status", header: "Status" },
];

describe("DataTable", () => {
  it("filters rows by search input", async () => {
    render(
      <DataTable
        data={[
          { name: "Alpha", status: "healthy" },
          { name: "Beta", status: "warning" },
        ]}
        columns={columns}
      />,
    );

    await userEvent.type(screen.getByPlaceholderText("Search"), "Beta");
    expect(screen.getByText("Beta")).toBeInTheDocument();
    expect(screen.queryByText("Alpha")).not.toBeInTheDocument();
  });
});