Apply unsaved changes

src/apps/dashboard/routes/devices/index.tsx

@@ -4,6 +4,7 @@ import Edit from '@mui/icons-material/Edit';
 import Box from '@mui/material/Box/Box';
 import Button from '@mui/material/Button/Button';
 import IconButton from '@mui/material/IconButton';
+import { useTheme } from '@mui/material/styles';
 import Tooltip from '@mui/material/Tooltip/Tooltip';
 import parseISO from 'date-fns/parseISO';
 import { type MRT_ColumnDef, type MRT_Theme, useMaterialReactTable } from 'material-react-table';
@@ -21,8 +22,6 @@ import ConfirmDialog from 'components/ConfirmDialog';
 import { useApi } from 'hooks/useApi';
 import { type UsersRecords, useUsersDetails } from 'hooks/useUsers';
 import globalize from 'lib/globalize';
-import { COLOR_SCHEMES } from 'themes/themes';
-import { useColorScheme, useTheme } from '@mui/material';
 
 const getUserCell = (users: UsersRecords) => function UserCell({ renderedCellValue, row }: DeviceInfoCell) {
     return (
@@ -43,7 +42,6 @@ export const Component = () => {
         data?.Items || []
     ), [ data ]);
     const { usersById: users, names: userNames, isLoading: isUsersLoading } = useUsersDetails();
-    const { colorScheme } = useColorScheme();
     const theme = useTheme();
 
     const [ isDeleteConfirmOpen, setIsDeleteConfirmOpen ] = useState(false);
@@ -141,6 +139,8 @@ export const Component = () => {
         }
     ], [ UserCell, userNames ]);
 
+    // NOTE: We need to provide a custom theme due to a MRT bug causing the initial theme to always be used
+    // https://github.com/KevinVandy/material-react-table/issues/1429
     const mrtTheme = useMemo<Partial<MRT_Theme>>(() => ({
         baseBackgroundColor: theme.palette.background.paper
     }), [ theme ]);