fix: Render noDataMessage on cluster tables (#27)

`noDataMessage` is not currently being rendered. <img width="990" alt="image" src="https://github.com/differentialhq/differential/assets/9162298/edf12d3f-5543-4e4d-87d5-93caae43f5aa"> --------- Co-authored-by: Nadeesha Cabral <[email protected]>
differentialhq · Dec 30, 2023 · bccae6e · bccae6e
1 parent e355e37
commit bccae6e
Showing 1 changed file with 4 additions and 2 deletions.
diff --git a/admin/app/clusters/[id]/DataTable.tsx b/admin/app/clusters/[id]/DataTable.tsx
@@ -22,7 +22,8 @@ export const DataTable = <T = any,>({
   noDataMessage?: string;
   columnDef?: ColumnDef<T>[];
 }) => {
-  const keys = Object.keys(data[0]);
+
+  const keys = data.length > 0 ? Object.keys(data[0]) : [];
 
   const columns: ColumnDef<any>[] =
     columnDef ||
@@ -38,6 +39,7 @@ export const DataTable = <T = any,>({
     manualSorting: true,
   });
 
+
   return (
     <div className="rounded-md border">
       <Table>
@@ -76,7 +78,7 @@ export const DataTable = <T = any,>({
           ) : (
             <TableRow>
               <TableCell colSpan={columns.length} className="h-24 text-center">
-                No results.
+                  <p className="text-gray-400 mt-2">{noDataMessage}</p>
               </TableCell>
             </TableRow>
           )}