fix: ajouté feedback visuel pour votes sur VersionPage
- Callback onVoteResult pour VoteButtons avec notifications - Snackbar pour confirmer succès/erreur des votes - État snackbar avec gestion des messages
This commit is contained in:
@@ -10,6 +10,8 @@ import Paper from '@mui/material/Paper'
|
|||||||
import Chip from '@mui/material/Chip'
|
import Chip from '@mui/material/Chip'
|
||||||
import IconButton from '@mui/material/IconButton'
|
import IconButton from '@mui/material/IconButton'
|
||||||
import Tooltip from '@mui/material/Tooltip'
|
import Tooltip from '@mui/material/Tooltip'
|
||||||
|
import Snackbar from '@mui/material/Snackbar'
|
||||||
|
import Alert from '@mui/material/Alert'
|
||||||
import ArrowBackIcon from '@mui/icons-material/ArrowBack'
|
import ArrowBackIcon from '@mui/icons-material/ArrowBack'
|
||||||
import ShareIcon from '@mui/icons-material/Share'
|
import ShareIcon from '@mui/icons-material/Share'
|
||||||
import {useRouter} from 'next/navigation'
|
import {useRouter} from 'next/navigation'
|
||||||
@@ -33,6 +35,7 @@ export default function VersionPage({session, versionId, viewMode}) {
|
|||||||
const [loading, setLoading] = useState(true)
|
const [loading, setLoading] = useState(true)
|
||||||
const [error, setError] = useState('')
|
const [error, setError] = useState('')
|
||||||
const [isErrorAlertOpen, setIsErrorAlertOpen] = useState(false)
|
const [isErrorAlertOpen, setIsErrorAlertOpen] = useState(false)
|
||||||
|
const [snackbar, setSnackbar] = useState({open: false, message: '', severity: 'success'})
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
async function fetchVersionData() {
|
async function fetchVersionData() {
|
||||||
@@ -79,6 +82,18 @@ export default function VersionPage({session, versionId, viewMode}) {
|
|||||||
router.push('/dashboard')
|
router.push('/dashboard')
|
||||||
}
|
}
|
||||||
|
|
||||||
|
const handleVoteResult = result => {
|
||||||
|
setSnackbar({
|
||||||
|
open: true,
|
||||||
|
message: result.message,
|
||||||
|
severity: result.success ? 'success' : 'error'
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
const handleCloseSnackbar = () => {
|
||||||
|
setSnackbar(prev => ({...prev, open: false}))
|
||||||
|
}
|
||||||
|
|
||||||
const handleShare = async () => {
|
const handleShare = async () => {
|
||||||
const url = window.location.href
|
const url = window.location.href
|
||||||
|
|
||||||
@@ -208,7 +223,7 @@ export default function VersionPage({session, versionId, viewMode}) {
|
|||||||
label='Copier le contenu de cette version'
|
label='Copier le contenu de cette version'
|
||||||
/>
|
/>
|
||||||
{!isVoteDisabled && (
|
{!isVoteDisabled && (
|
||||||
<VoteButtons versionId={versionId} />
|
<VoteButtons versionId={versionId} onVoteResult={handleVoteResult} />
|
||||||
)}
|
)}
|
||||||
</Box>
|
</Box>
|
||||||
</Box>
|
</Box>
|
||||||
@@ -234,6 +249,17 @@ export default function VersionPage({session, versionId, viewMode}) {
|
|||||||
<SessionExpired ref={countdownRef} setError={setError} setIsErrorAlertOpen={setIsErrorAlertOpen} />
|
<SessionExpired ref={countdownRef} setError={setError} setIsErrorAlertOpen={setIsErrorAlertOpen} />
|
||||||
</Container>
|
</Container>
|
||||||
<Footer />
|
<Footer />
|
||||||
|
|
||||||
|
<Snackbar
|
||||||
|
open={snackbar.open}
|
||||||
|
autoHideDuration={6000}
|
||||||
|
anchorOrigin={{vertical: 'bottom', horizontal: 'center'}}
|
||||||
|
onClose={handleCloseSnackbar}
|
||||||
|
>
|
||||||
|
<Alert variant='filled' severity={snackbar.severity} sx={{width: '100%'}} onClose={handleCloseSnackbar}>
|
||||||
|
{snackbar.message}
|
||||||
|
</Alert>
|
||||||
|
</Snackbar>
|
||||||
</Box>
|
</Box>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user