diff --git a/components/versions/list-versions.js b/components/versions/list-versions.js index d4485e5..2ebe7e6 100644 --- a/components/versions/list-versions.js +++ b/components/versions/list-versions.js @@ -67,7 +67,7 @@ function rowContent({ setError, setIsErrorAlertOpen, setIsOpenComparison, - setVersionData + setVersionCompare }) { const handleButtonClick = async versionId => { const version = await compareVersion({ @@ -80,7 +80,7 @@ function rowContent({ }) if (version) { - setVersionData({...version, versionId}) + setVersionCompare({...version, versionId}) setIsOpenComparison(true) } } @@ -112,7 +112,9 @@ export default function ListVersions({ const countdownRef = useRef() const [isOpenComparison, setIsOpenComparison] = useState(false) - const [versionData, setVersionData] = useState(null) + const [versionCompare, setVersionCompare] = useState(null) + + const versionData = data.find(({id}) => id === versionCompare?.versionId) return ( <> @@ -126,13 +128,13 @@ export default function ListVersions({ components={VirtuosoTableComponents} fixedHeaderContent={fixedHeaderContent} itemContent={(index, row) => rowContent({ - index, row, accessToken, userId, countdownRef, setError, setIsErrorAlertOpen, setIsOpenComparison, setVersionData + index, row, accessToken, userId, countdownRef, setError, setIsErrorAlertOpen, setIsOpenComparison, setVersionCompare })} /> {isOpenComparison && ( - + )} diff --git a/components/versions/version-comparison.js b/components/versions/version-comparison.js index 7fd4615..7b89b67 100644 --- a/components/versions/version-comparison.js +++ b/components/versions/version-comparison.js @@ -11,21 +11,22 @@ import {useSession} from 'next-auth/react' import Snackbar from '@mui/material/Snackbar' import Alert from '@mui/material/Alert' import {handleVote, getUserVote} from '../../lib/directus.js' +import {formatDate} from '@/lib/format.js' -export default function VersionComparison({versionData}) { - const {current, main, outdated} = versionData +export default function VersionComparison({versionData, versionCompare}) { + const {current, main, outdated} = versionCompare const {data: session} = useSession() const [snackbar, setSnackbar] = useState({open: false, message: '', severity: 'success'}) const [currentVote, setCurrentVote] = useState(null) useEffect(() => { const fetchVote = async () => { - if (session?.user && versionData.versionId) { + if (session?.user && versionCompare.versionId) { try { const vote = await getUserVote({ accessToken: session.user.accessToken, userId: session.user.userId, - versionId: versionData.versionId + versionId: versionCompare.versionId }) setCurrentVote(vote) } catch (error) { @@ -35,14 +36,14 @@ export default function VersionComparison({versionData}) { } fetchVote() - }, [session, versionData.versionId]) + }, [session, versionCompare.versionId]) const handleVoteClick = async voteValue => { try { const newVoteValue = await handleVote({ accessToken: session.user.accessToken, userId: session.user.userId, - versionId: versionData.versionId, + versionId: versionCompare.versionId, voteValue }) setCurrentVote(newVoteValue) @@ -80,24 +81,41 @@ export default function VersionComparison({versionData}) { {current.contenu} {!outdated && session?.user && ( - - handleVoteClick(1)} + <> + + @{versionData.user_created.split('-')[0]} + + - - - handleVoteClick(-1)} - > - - - + + {versionData && ( + + {formatDate(versionData.date_created)} + + )} + + + handleVoteClick(1)} + > + + + handleVoteClick(-1)} + > + + + + + )} @@ -170,7 +188,8 @@ export default function VersionComparison({versionData}) { } VersionComparison.propTypes = { - versionData: PropTypes.shape({ + versionData: PropTypes.object, + versionCompare: PropTypes.shape({ outdated: PropTypes.bool.isRequired, mainHash: PropTypes.string.isRequired, current: PropTypes.object.isRequired, diff --git a/components/versions/version-dialog.js b/components/versions/version-dialog.js index 9b47f38..66ca437 100644 --- a/components/versions/version-dialog.js +++ b/components/versions/version-dialog.js @@ -8,7 +8,7 @@ import useMediaQuery from '@mui/material/useMediaQuery' import {useTheme} from '@mui/material/styles' import VersionComparison from './version-comparison.js' -export default function VersionDialog({versionData, isOpen, setIsOpen}) { +export default function VersionDialog({versionData, versionCompare, isOpen, setIsOpen}) { const theme = useTheme() const fullScreen = useMediaQuery(theme.breakpoints.down('md')) @@ -27,7 +27,7 @@ export default function VersionDialog({versionData, isOpen, setIsOpen}) { {'Comparaison des versions'} - +