134 lines
3.6 KiB
JavaScript
134 lines
3.6 KiB
JavaScript
'use client'
|
|
|
|
import {useState, useRef, useEffect} from 'react'
|
|
import PropTypes from 'prop-types'
|
|
import Grid from '@mui/material/Grid'
|
|
import Typography from '@mui/material/Typography'
|
|
import HomeIcon from '@mui/icons-material/Home'
|
|
import Box from '@mui/material/Box'
|
|
import AuthAlert from '../auth-form/auth-alert.js'
|
|
import SessionExpired from '../session/session-expired.js'
|
|
import {Loading} from '../loading.js'
|
|
import ListVersions from './list-versions.js'
|
|
import {listVersions} from '@/lib/directus.js'
|
|
import Sign from '@/components/session/sign.js'
|
|
|
|
const navButton = {
|
|
title: 'Accueil',
|
|
path: '/',
|
|
color: 'success',
|
|
icon: <HomeIcon fontSize='large' />
|
|
}
|
|
|
|
export default function GetVersions({session}) {
|
|
const {accessToken, userId} = session.user
|
|
|
|
const [versions, setVersions] = useState(null)
|
|
const [isErrorAlertOpen, setIsErrorAlertOpen] = useState(false)
|
|
const [error, setError] = useState('')
|
|
const countdownRef = useRef()
|
|
|
|
useEffect(() => {
|
|
async function fetchVersions() {
|
|
const data = await listVersions({
|
|
accessToken, userId, countdownRef, setError, setIsErrorAlertOpen
|
|
})
|
|
setVersions(data)
|
|
}
|
|
|
|
fetchVersions()
|
|
}, [accessToken, userId])
|
|
|
|
if (!versions) {
|
|
return (
|
|
<>
|
|
{error && <AuthAlert
|
|
isOpen={isErrorAlertOpen}
|
|
setIsOpen={setIsErrorAlertOpen}
|
|
message={error}
|
|
severity='error'
|
|
/>}
|
|
<Loading />
|
|
<SessionExpired ref={countdownRef} setError={setError} setIsErrorAlertOpen={setIsErrorAlertOpen} />
|
|
</>
|
|
)
|
|
}
|
|
|
|
const titres = versions?.filter(({collection}) => collection === 'titres')
|
|
const articles = versions?.filter(({collection}) => collection === 'articles')
|
|
|
|
return (
|
|
<>
|
|
{error && <AuthAlert
|
|
isOpen={isErrorAlertOpen}
|
|
setIsOpen={setIsErrorAlertOpen}
|
|
message={error}
|
|
severity='error'
|
|
/>}
|
|
|
|
<Sign session={session} navButton={navButton} />
|
|
|
|
<Box
|
|
sx={{
|
|
border: '2px solid #ccc',
|
|
borderRadius: '8px',
|
|
padding: 1,
|
|
my: 4
|
|
}}
|
|
>
|
|
|
|
<Typography
|
|
gutterBottom
|
|
variant='h5'
|
|
component='h2'
|
|
textAlign='center'
|
|
sx={{display: 'block', fontWeight: 'bold', textTransform: 'uppercase'}}
|
|
>
|
|
Liste des versions
|
|
</Typography>
|
|
|
|
<Grid
|
|
container
|
|
spacing={2}
|
|
justifyContent={
|
|
(titres.length > 0 && articles.length === 0) || (articles.length > 0 && titres.length === 0)
|
|
? 'center'
|
|
: 'flex-start'
|
|
}
|
|
>
|
|
{titres.length > 0 && (
|
|
<Grid size={{xs: 12, md: articles.length > 0 ? 6 : 12}}>
|
|
<ListVersions
|
|
collection='Titres'
|
|
data={titres}
|
|
accessToken={accessToken}
|
|
userId={userId}
|
|
setError={setError}
|
|
setIsErrorAlertOpen={setIsErrorAlertOpen}
|
|
/>
|
|
</Grid>
|
|
)}
|
|
|
|
{articles.length > 0 && (
|
|
<Grid size={{xs: 12, md: titres.length > 0 ? 6 : 12}}>
|
|
<ListVersions
|
|
collection='Articles'
|
|
data={articles}
|
|
accessToken={accessToken}
|
|
userId={userId}
|
|
setError={setError}
|
|
setIsErrorAlertOpen={setIsErrorAlertOpen}
|
|
/>
|
|
</Grid>
|
|
)}
|
|
</Grid>
|
|
</Box>
|
|
<SessionExpired ref={countdownRef} setError={setError} setIsErrorAlertOpen={setIsErrorAlertOpen} />
|
|
</>
|
|
)
|
|
}
|
|
|
|
GetVersions.propTypes = {
|
|
session: PropTypes.object.isRequired
|
|
}
|