refactor(striker-ui): migrate MUI v4->5 on Spinner

striker-ui/components/Spinner.tsx

@@ -1,28 +1,29 @@
-import { makeStyles } from '@material-ui/core/styles';
+import { styled } from '@mui/material/styles';
-import CircularProgress from '@material-ui/core/CircularProgress';
+import { CircularProgress } from '@mui/material';
 import { TEXT } from '../lib/consts/DEFAULT_THEME';
 
-const useStyles = makeStyles(() => ({
+const PREFIX = 'Spinner';
-  root: {
+
-    display: 'flex',
+const classes = {
-    alignItems: 'center',
+  spinner: `${PREFIX}-spinner`,
-    justifyContent: 'center',
+};
-    marginTop: '3em',
+
-  },
+const StyledDiv = styled('div')(() => ({
-  spinner: {
+  display: 'flex',
+  alignItems: 'center',
+  justifyContent: 'center',
+  marginTop: '3em',
+
+  [`& .${classes.spinner}`]: {
     color: TEXT,
-    variant: 'indeterminate',
-    size: '50em',
   },
 }));
 
 const Spinner = (): JSX.Element => {
-  const classes = useStyles();
-
   return (
-    <div className={classes.root}>
+    <StyledDiv>
-      <CircularProgress className={classes.spinner} />
+      <CircularProgress variant="indeterminate" className={classes.spinner} />
-    </div>
+    </StyledDiv>
   );
 };