Cédric FAMIBELLE-PRONZOLA
77 lines
1.8 KiB
JavaScript
77 lines
1.8 KiB
JavaScript
import {useState} from 'react'
|
|
import {styled} from '@mui/material/styles'
|
|
import PropTypes from 'prop-types'
|
|
import Link from 'next/link'
|
|
import {signOut} from 'next-auth/client'
|
|
import {Tooltip, Fab, Zoom} from '@mui/material'
|
|
import ExitToAppIcon from '@mui/icons-material/ExitToApp'
|
|
|
|
import Alet from '../alet'
|
|
|
|
const PREFIX = 'Dekoneksyon'
|
|
|
|
const classes = {
|
|
tooltip: `${PREFIX}-tooltip`,
|
|
dekoneksyon: `${PREFIX}-dekoneksyon`
|
|
}
|
|
|
|
const Root = styled('div')(() => ({
|
|
[`& .${classes.dekoneksyon}`]: {
|
|
position: props => props.position,
|
|
top: props => props.top,
|
|
left: props => props.left
|
|
}
|
|
}))
|
|
|
|
const siteUrl = process.env.NEXT_PUBLIC_SITE_URL || 'http://localhost:3000'
|
|
|
|
const DekoneksonTooltip = Tooltip
|
|
|
|
function Dekoneksyon({chimen, tooltipPlacement}) {
|
|
const [esOuve, meteEsOuve] = useState(false)
|
|
|
|
const handleDekonekte = event => {
|
|
event.preventDefault()
|
|
signOut({callbackUrl: `${siteUrl}${chimen}`})
|
|
}
|
|
|
|
return (
|
|
(
|
|
<Root>
|
|
<Link passHref href='/api/auth/signout'>
|
|
<DekoneksonTooltip
|
|
title='Dékoneksyon'
|
|
placement={tooltipPlacement}
|
|
TransitionComponent={Zoom}
|
|
classes={{
|
|
tooltip: classes.tooltip
|
|
}}
|
|
>
|
|
<Fab
|
|
className={classes.dekoneksyon}
|
|
color='secondary'
|
|
aria-label='logout'
|
|
size='small'
|
|
onClick={() => meteEsOuve(true)}
|
|
>
|
|
<ExitToAppIcon />
|
|
</Fab>
|
|
</DekoneksonTooltip>
|
|
</Link>
|
|
<Alet esOuve={esOuve} meteEsOuve={meteEsOuve} handleKonfime={handleDekonekte} />
|
|
</Root>
|
|
)
|
|
)
|
|
}
|
|
|
|
Dekoneksyon.defaultProps = {
|
|
tooltipPlacement: 'left'
|
|
}
|
|
|
|
Dekoneksyon.propTypes = {
|
|
chimen: PropTypes.string.isRequired,
|
|
tooltipPlacement: PropTypes.string
|
|
}
|
|
|
|
export default Dekoneksyon
|