feat(data-table): Introduce comprehensive DataTable component with full feature set

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

@@ -0,0 +1,40 @@
+import { Table as TanstackTable } from "@tanstack/react-table";
+
+import { TableCell, TableRow } from "#components/table";
+import { Button } from "#components/button.tsx";
+
+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>
+  );
+}