updates on the ui changes and frully removed the mui and converted into astryx and color change

src/components/nearle_components/TableLoader.js

@@ -1,6 +1,10 @@
-import React from 'react';
-import { TableRow, TableCell, Skeleton } from '@mui/material';
+import PropTypes from 'prop-types';
 
+import { TableRow, TableCell } from '@astryxdesign/core/Table';
+import { Skeleton } from '@astryxdesign/core/Skeleton';
+
+// Placeholder rows for a loading table. Renders into an Astryx <TableBody>, so
+// the host page's table must already be on Astryx's Table.
 export default function TableLoader({ rows = 5, columns = 6, height = 40 }) {
   return (
     <>
@@ -8,7 +12,7 @@ export default function TableLoader({ rows = 5, columns = 6, height = 40 }) {
         <TableRow key={rowIndex}>
           {[...Array(columns)].map((_, colIndex) => (
             <TableCell key={colIndex}>
-              <Skeleton variant="rectangular" height={height} width={70} animation="wave" />
+              <Skeleton width={70} height={height} radius={2} index={colIndex} />
             </TableCell>
           ))}
         </TableRow>
@@ -16,3 +20,9 @@ export default function TableLoader({ rows = 5, columns = 6, height = 40 }) {
     </>
   );
 }
+
+TableLoader.propTypes = {
+  rows: PropTypes.number,
+  columns: PropTypes.number,
+  height: PropTypes.number
+};