Merge pull request #862 from amitamrutiya/update-table-theme

 update mui table theme

Author: amitamrutiya

src/custom/ResponsiveDataTable.tsx

@@ -126,11 +126,29 @@ const dataTableTheme = (theme: Theme, backgroundColor?: string) =>
     typography: {
       fontFamily: theme.typography.fontFamily
     },
+    // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+    //@ts-ignore
+    palette: {
+      text: {
+        primary: theme.palette.text.default,
+        secondary: theme.palette.text.secondary
+      },
+      background: {
+        default: backgroundColor || theme.palette.background.constant?.table,
+        paper: backgroundColor || theme.palette.background.constant?.table
+      }
+    },
     components: {
+      MuiTableCell: {
+        styleOverrides: {
+          root: {
+            borderBottom: `1px solid ${theme.palette.border.default}`
+          }
+        }
+      },
       MuiPaper: {
         styleOverrides: {
           root: {
-            background: backgroundColor || theme.palette.background.default,
             maxWidth: '-moz-available'
           }
         }
@@ -141,24 +159,19 @@ const dataTableTheme = (theme: Theme, backgroundColor?: string) =>
             width: '-webkit-fill-available',
             '@media (max-width: 500px)': {
               wordWrap: 'break-word'
-            },
-            background: backgroundColor || theme.palette.background.constant?.table,
-            color: theme.palette.text.default
+            }
           }
         }
       },
       MUIDataTableHeadCell: {
         styleOverrides: {
           data: {
             fontWeight: 'bold',
-            textTransform: 'uppercase',
-            color: theme.palette.text.default
+            textTransform: 'uppercase'
           },
           root: {
             fontWeight: 'bold',
-            textTransform: 'uppercase',
-            color: theme.palette.text.default,
-            backgroundColor: backgroundColor || theme.palette.background.constant?.table
+            textTransform: 'uppercase'
           }
         }
       },
@@ -177,7 +190,6 @@ const dataTableTheme = (theme: Theme, backgroundColor?: string) =>
             intermediate: false,
             color: 'transparent',
             '&.Mui-checked': {
-              color: theme.palette.text.default,
               '& .MuiSvgIcon-root': {
                 width: '1.25rem',
                 height: '1.25rem',
@@ -207,30 +219,6 @@ const dataTableTheme = (theme: Theme, backgroundColor?: string) =>
           }
         }
       },
-      MuiTableCell: {
-        styleOverrides: {
-          body: {
-            color: theme.palette.text.default
-          },
-          root: {
-            borderBottom: `1px solid ${theme.palette.border.default}`
-          }
-        }
-      },
-      MUIDataTablePagination: {
-        styleOverrides: {
-          toolbar: {
-            color: theme.palette.text.default
-          }
-        }
-      },
-      MUIDataTableSelectCell: {
-        styleOverrides: {
-          headerCell: {
-            background: backgroundColor || theme.palette.background.constant?.table
-          }
-        }
-      },
       MuiInput: {
         styleOverrides: {
           root: {