updated build add update delete

frontend/pages/build-areas/list/data-table.tsx

@@ -70,6 +70,7 @@ import { schemaType } from "./schema"
 import { getColumns, DraggableRow } from "./columns"
 import { useRouter } from "next/navigation"
 import { useDeleteBuildAreaMutation } from "../queries"
+import { TableSkeleton } from "@/components/skeletons/tableSkeleton"
 
 export function BuildAreasDataTable({
     data,
@@ -79,7 +80,8 @@ export function BuildAreasDataTable({
     onPageChange,
     onPageSizeChange,
     refetchTable,
-    buildId
+    buildId,
+    tableIsLoading,
 }: {
     data: schemaType[],
     totalCount: number,
@@ -88,7 +90,8 @@ export function BuildAreasDataTable({
     onPageChange: (page: number) => void,
     onPageSizeChange: (size: number) => void,
     refetchTable: () => void,
-    buildId: string
+    buildId: string,
+    tableIsLoading: boolean
 }) {
 
     const router = useRouter();
@@ -189,11 +192,9 @@ export function BuildAreasDataTable({
                                 ))}
                             </TableHeader>
                             <TableBody className="**:data-[slot=table-cell]:first:w-8">
-                                {table.getRowModel().rows?.length ? (<SortableContext items={dataIds} strategy={verticalListSortingStrategy} >
-                                    {table.getRowModel().rows.map((row) => <DraggableRow key={row.id} row={row} />)}
-                                </SortableContext>) : (
-                                    <TableRow><TableCell colSpan={columns.length} className="h-24 text-center">No results.</TableCell></TableRow>
-                                )}
+                                {tableIsLoading ?
+                                    <TableSkeleton columnCount={table.getAllColumns().length} rowCount={pageSize} hasActions={true} /> :
+                                    <SortableContext items={dataIds} strategy={verticalListSortingStrategy}>{table.getRowModel().rows.map(row => <DraggableRow key={row.id} row={row} />)}</SortableContext>}
                             </TableBody>
                         </Table>
                     </DndContext>