Check styles declaration against MUI Theme with TypeScript (#133)

Author: Tristan-WorkGH

src/components/App/PageNotFound.tsx

@@ -5,9 +5,10 @@
  * file, You can obtain one at http://mozilla.org/MPL/2.0/.
  */
 
-import Container from '@mui/material/Container';
+import { Container } from '@mui/material';
 import ErrorOutlineIcon from '@mui/icons-material/ErrorOutline';
 import { ReactNode } from 'react';
+import { type MuiStyles } from '@gridsuite/commons-ui';
 
 const styles = {
     error: {
@@ -18,7 +19,7 @@ const styles = {
     container: {
         marginTop: '70px',
     },
-};
+} as const as MuiStyles;
 
 const PageNotFound = ({ message }: { message: ReactNode }) => {
     return (

src/components/Grid/AgGrid.tsx

@@ -17,7 +17,7 @@ import {
     useRef,
 } from 'react';
 import { AgGridReact } from 'ag-grid-react';
-import { CustomAGGrid, type CustomAGGridProps } from '@gridsuite/commons-ui';
+import { CustomAGGrid, type CustomAGGridProps, type SxStyle } from '@gridsuite/commons-ui';
 import { useDebugRender } from '../../utils/hooks';
 
 type AccessibleAgGridReact<TData> = Omit<
@@ -50,7 +50,7 @@ const style = {
     '@media print': {
         pageBreakInside: 'avoid',
     },
-};
+} as const satisfies SxStyle;
 
 // TODO move type generic restoration to commons-ui
 // TODO move useDebug feature from env to commons-ui

src/pages/common/multi-chip-cell-renderer.tsx

@@ -7,7 +7,7 @@
 
 import React, { useRef, useState, useEffect } from 'react';
 import { Chip, Grid, Tooltip } from '@mui/material';
-import { mergeSx } from '@gridsuite/commons-ui';
+import { mergeSx, type MuiStyles } from '@gridsuite/commons-ui';
 
 const maxChipWidth = 100;
 const counterChipWidth = 25;
@@ -23,7 +23,7 @@ const chipStyles = {
             fontWeight: 'bold',
         },
     },
-};
+} as const satisfies MuiStyles;
 
 export interface MultiChipCellRendererProps {
     value: string[];