fix(FE): adding skeleton state data on null or unfiltered

src/components/Table.tsx

@@ -42,6 +42,7 @@ interface TableClassNames {
   footerRowClassName?: string;
   footerColumnClassName?: string;
   paginationClassName?: string;
+  skeletonCellClassName?: string;
 }
 
 export interface TableProps<TData extends object> {
@@ -79,7 +80,9 @@ export interface TableProps<TData extends object> {
   getSubRows?: (originalRow: TData, index: number) => TData[] | undefined;
 }
 
-const DUMMY_SKELETON_DATA = [{}, {}, {}, {}, {}];
+const DUMMY_SKELETON_DATA = Array.from({ length: 10 }, (_, index) => ({
+  id: index,
+}));
 
 const emptyContentDefaultValue = (
   <div className='w-full p-5 text-center'>
@@ -414,7 +417,14 @@ const Table = <TData extends object>({
                             cell.getContext()
                           )}
 
-                        {isLoading && <div className='skeleton w-full h-4' />}
+                        {isLoading && (
+                          <div
+                            className={cn(
+                              'skeleton w-full h-4',
+                              tableClassNames.skeletonCellClassName
+                            )}
+                          />
+                        )}
                       </td>
                     ))}
                   </tr>