Use codemod jss-to-styled

components/teks/pataje.js

@@ -1,7 +1,7 @@
 import {useState} from 'react'
 import PropTypes from 'prop-types'
 
-import {makeStyles} from '@material-ui/core/styles'
+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'
@@ -10,24 +10,29 @@ import ShareIcon from '@material-ui/icons/Share'
 import TwitterIcon from '@material-ui/icons/Twitter'
 import {Backdrop} from '@material-ui/core'
 
-const SITE_URL = process.env.NEXT_PUBLIC_SITE_URL
-const TWITTER_HASHTAGS = process.env.NEXT_PUBLIC_TWITTER_HASHTAGS || 'OKi'
-const TWITTER_USERNAME = process.env.NEXT_PUBLIC_TWITTER_USERNAME || 'OrganisationKA'
+const PREFIX = 'pataje'
 
-const useStyles = makeStyles(() => ({
-  root: {
+const classes = {
+  root: `${PREFIX}-root`
+}
+
+const Root = styled('div')(() => ({
+  [`&.${classes.root}`]: {
     height: 0,
     transform: 'translateZ(0px)'
   }
 }))
 
+const SITE_URL = process.env.NEXT_PUBLIC_SITE_URL
+const TWITTER_HASHTAGS = process.env.NEXT_PUBLIC_TWITTER_HASHTAGS || 'OKi'
+const TWITTER_USERNAME = process.env.NEXT_PUBLIC_TWITTER_USERNAME || 'OrganisationKA'
+
 const actions = [
   {icon: <TwitterIcon />, name: 'Twitter', code: 'twitter'},
   {icon: <FileCopyIcon />, name: 'Copier le lien', code: 'copy'}
 ]
 
 export default function Pataje({teks, setError, setSuccess}) {
-  const classes = useStyles()
   const {tit, awtis, slug} = teks
   const [open, setOpen] = useState(false)
 
@@ -62,7 +67,7 @@ export default function Pataje({teks, setError, setSuccess}) {
   }
 
   return (
-    <div className={classes.root}>
+    <Root className={classes.root}>
       <Backdrop open={open} />
       <SpeedDial
         FabProps={{size: 'small', margin: 'auto', color: 'default'}}
@@ -83,7 +88,7 @@ export default function Pataje({teks, setError, setSuccess}) {
           />
         ))}
       </SpeedDial>
-    </div>
+    </Root>
   )
 }