update mui

package.json

@@ -46,9 +46,9 @@
   "dependencies": {
     "@emotion/react": "11.13.3",
     "@emotion/styled": "11.13.0",
-    "@mui/icons-material": "5.16.7",
+    "@mui/icons-material": "6.1.1",
     "@mui/lab": "5.0.0-alpha.169",
-    "@mui/material": "5.16.7",
+    "@mui/material": "6.1.1",
     "commonmark": "0.31.2",
     "svg-pan-zoom": "3.6.1"
   },

src/components/IntrospectionModal.tsx

@@ -6,12 +6,12 @@ import Button from '@mui/material/Button';
 import Dialog from '@mui/material/Dialog';
 import DialogActions from '@mui/material/DialogActions';
 import DialogContent from '@mui/material/DialogContent';
+import Grid from '@mui/material/Grid2';
 import Stack from '@mui/material/Stack';
 import Tab from '@mui/material/Tab';
 import TextField from '@mui/material/TextField';
 import Tooltip from '@mui/material/Tooltip';
 import Typography from '@mui/material/Typography';
-import Grid from '@mui/material/Unstable_Grid2';
 import { buildClientSchema } from 'graphql/utilities';
 import { useState } from 'react';
 
@@ -179,7 +179,7 @@ function PresetsTab(props: PresetsTabProps) {
   return (
     <Grid container spacing={4}>
       {presetNames.map((name) => (
-        <Grid xs={12} sm={6} key={name}>
+        <Grid size={{ xs: 12, sm: 6 }} key={name}>
           <Button
             fullWidth
             variant="outlined"