edr-platform/packages/ui-common/src/components/data-table/error.tsx

import { Table as TanstackTable } from "@tanstack/react-table";

import { TableCell, TableRow } from "../table";
import { Button } from "../button";

export function DataTableError({
  table,
  message,
  description,
  onRetry,
}: {
  table: TanstackTable<any>;
  message?: string;
  description?: string;
  onRetry?: () => void;
}) {
  return (
    <TableRow>
      <TableCell colSpan={table.getVisibleFlatColumns().length}>
        <div className="flex items-center my-6 justify-center">
          <div className="text-center">
            <div className="my-4">
              <h2 className="text-xl font-semibold ">
                {message ?? "No results"}
              </h2>
              <p className="mt-2 text-sm text-secondary-foreground">
                {description ?? "No results found"}
              </p>
            </div>
            {onRetry && (
              <Button variant={"outline"} onClick={onRetry}>
                Retry
              </Button>
            )}
          </div>
        </div>
      </TableCell>
    </TableRow>
  );
}