Use codemod preset-safe

components/teks/denye-teks.js

@@ -1,4 +1,4 @@
-import {Container, Grid} from '@material-ui/core'
+import {Container, Grid} from '@mui/material'
 
 import {styled} from '@mui/material/styles'
 

components/teks/drawer-bar.js

@@ -9,9 +9,9 @@ import {
   FormControl,
   InputAdornment,
   InputBase
-} from '@material-ui/core'
+} from '@mui/material'
 
-import SearchIcon from '@material-ui/icons/Search'
+import SearchIcon from '@mui/icons-material/Search'
 
 import MizikLis from '../awtis/mizik-lis'
 

components/teks/entegre-mizik.js

@@ -1,4 +1,4 @@
-import {Box, IconButton, Typography} from '@material-ui/core'
+import {Box, IconButton, Typography} from '@mui/material'
 import PropTypes from 'prop-types'
 import {useRouter} from 'next/router'
 
@@ -126,7 +126,12 @@ function EntegreMizik({anTeks, isMobile}) {
       </Typography>
 
       {!okiMizikID && filteredKouteyAchtey.map(({_id, boutik, url}) => (
-        <IconButton key={_id} aria-label='player' onClick={() => handleClick(boutik, url)}>
+        <IconButton
+          key={_id}
+          aria-label='player'
+          size='large'
+          onClick={() => handleClick(boutik, url)}
+        >
           {kouteyAchteyIcons[boutik]}
         </IconButton>
       ))}

components/teks/oki-mizik.js

@@ -1,4 +1,4 @@
-import {Typography, Link, Box} from '@material-ui/core'
+import {Typography, Link, Box} from '@mui/material'
 import PropTypes from 'prop-types'
 
 const MIZIK_URL = process.env.NEXT_PUBLIC_OKI_MIZIK_URL || 'https://funkwhale-server.com'

components/teks/pataje.js

@@ -1,14 +1,14 @@
 import {useState} from 'react'
 import PropTypes from 'prop-types'
 
-import {styled} from '@material-ui/core/styles'
-import SpeedDial from '@material-ui/lab/SpeedDial'
-import SpeedDialIcon from '@material-ui/lab/SpeedDialIcon'
-import SpeedDialAction from '@material-ui/lab/SpeedDialAction'
-import FileCopyIcon from '@material-ui/icons/FileCopyOutlined'
-import ShareIcon from '@material-ui/icons/Share'
-import TwitterIcon from '@material-ui/icons/Twitter'
-import {Backdrop} from '@material-ui/core'
+import {styled} from '@mui/material/styles'
+import SpeedDial from '@mui/material/SpeedDial'
+import SpeedDialIcon from '@mui/material/SpeedDialIcon'
+import SpeedDialAction from '@mui/material/SpeedDialAction'
+import FileCopyIcon from '@mui/icons-material/FileCopyOutlined'
+import ShareIcon from '@mui/icons-material/Share'
+import TwitterIcon from '@mui/icons-material/Twitter'
+import {Backdrop} from '@mui/material'
 
 const PREFIX = 'pataje'
 

components/teks/teks-drawer.js

@@ -18,16 +18,16 @@ import {
   Snackbar,
   Tooltip,
   Zoom
-} from '@material-ui/core'
+} from '@mui/material'
 
-import KeyboardBackspaceIcon from '@material-ui/icons/KeyboardBackspace'
-import ExplicitIcon from '@material-ui/icons/Explicit'
+import KeyboardBackspaceIcon from '@mui/icons-material/KeyboardBackspace'
+import ExplicitIcon from '@mui/icons-material/Explicit'
 
-import MenuIcon from '@material-ui/icons/Menu'
+import MenuIcon from '@mui/icons-material/Menu'
 
-import {useTheme, styled} from '@material-ui/core/styles'
+import {useTheme, styled} from '@mui/material/styles'
 
-import MuiAlert from '@material-ui/lab/Alert'
+import MuiAlert from '@mui/material/Alert'
 import {formatJsonString} from '../../lib/utils/format'
 
 import VweKomante from '../komante/vwe-komante'
@@ -253,6 +253,7 @@ export default function TeksDrawer({teks, anTeks, komante}) {
             aria-label='open drawer'
             edge='start'
             className={classes.menuButton}
+            size='large'
             onClick={handleDrawerToggle}
           >
             <MenuIcon />
@@ -300,7 +301,7 @@ export default function TeksDrawer({teks, anTeks, komante}) {
             <DrawerBar meteEsMobilOuve={meteEsMobilOuve} teks={teks} anTeks={anTeks} />
           </Drawer>
         </Hidden>
-        <Hidden xsDown implementation='css'>
+        <Hidden smDown implementation='css'>
           <Drawer
             open
             classes={{
@@ -357,7 +358,7 @@ export default function TeksDrawer({teks, anTeks, komante}) {
             {anTeks.okiMizikID && (
               <OkiMizik id={anTeks.okiMizikID} />
             )}
-            <Grid container justify='center' spacing={1}>
+            <Grid container justifyContent='center' spacing={1}>
               <Grid item xs={12} md={langArray.length > 0 ? 6 : null}>
                 <div className={classes.gridText}>
                   <Typography align='center' className={classes.text} variant='h4'>

components/teks/teks-kat.js

@@ -9,9 +9,9 @@ import {
   CardMedia,
   Typography,
   Grid
-} from '@material-ui/core'
-import ExplicitIcon from '@material-ui/icons/Explicit'
-import {styled} from '@material-ui/core/styles'
+} from '@mui/material'
+import ExplicitIcon from '@mui/icons-material/Explicit'
+import {styled} from '@mui/material/styles'
 
 const PREFIX = 'teks-kat'
 

components/teks/vwe-koute-achte.js

@@ -13,12 +13,12 @@ import {
   Lbry,
   Peertube
 } from '@icons-pack/react-simple-icons'
-import VideocamIcon from '@material-ui/icons/Videocam'
-import MusicNoteIcon from '@material-ui/icons/MusicNote'
-import AlbumIcon from '@material-ui/icons/Album'
-import PlayCircleFilledIcon from '@material-ui/icons/PlayCircleFilled'
-import {styled} from '@material-ui/core/styles'
-import {SpeedDial, SpeedDialIcon, SpeedDialAction} from '@material-ui/lab'
+import VideocamIcon from '@mui/icons-material/Videocam'
+import MusicNoteIcon from '@mui/icons-material/MusicNote'
+import AlbumIcon from '@mui/icons-material/Album'
+import PlayCircleFilledIcon from '@mui/icons-material/PlayCircleFilled'
+import {styled} from '@mui/material/styles'
+import {SpeedDial, SpeedDialIcon, SpeedDialAction} from '@mui/material'
 
 const PREFIX = 'vwe-koute-achte'