97 lines
3.4 KiB
JavaScript
97 lines
3.4 KiB
JavaScript
|
/* eslint-disable import/extensions */
|
||
|
|
|
||
|
|
import Image from 'next/image'
|
||
|
|
import PropTypes from 'prop-types'
|
||
|
|
import Typography from '@mui/material/Typography'
|
||
|
|
import Box from '@mui/material/Box'
|
||
|
|
import List from '@mui/material/List'
|
||
|
|
import ListItem from '@mui/material/ListItem'
|
||
|
|
import ListItemText from '@mui/material/ListItemText'
|
||
|
|
import Button from '@mui/material/Button'
|
||
|
|
import Link from '@mui/material/Link'
|
||
|
|
import OpenInNewIcon from '@mui/icons-material/OpenInNew'
|
||
|
|
|
||
|
|
import licencesData from './data.json'
|
||
|
|
import licensesConditions from './conditions.json'
|
||
|
|
|
||
|
|
export default function LicensesInfo({license}) {
|
||
|
|
const licenseInfo = licencesData.find(item => item.license === license)
|
||
|
|
const licenseList = licenseInfo.license.split('-')
|
||
|
|
|
||
|
|
const conditions = licenseList.map(license => licensesConditions[license])
|
||
|
|
|
||
|
|
return (
|
||
|
|
<Box>
|
||
|
|
<Box sx={{marginBottom: 1, textAlign: 'center', display: 'flex', justifyContent: 'center'}}>
|
||
|
|
<Box marginRight={0.5}>
|
||
|
|
<Image
|
||
|
|
width={46}
|
||
|
|
height={46}
|
||
|
|
alt={license}
|
||
|
|
src='/images/cc/icons/cc.svg'
|
||
|
|
/>
|
||
|
|
</Box>
|
||
|
|
{licenseList.map(license => (
|
||
|
|
<Box key={license} marginRight={0.5}>
|
||
|
|
<Image
|
||
|
|
width={46}
|
||
|
|
height={46}
|
||
|
|
alt={license}
|
||
|
|
src={`/images/cc/icons/${license}.svg`}
|
||
|
|
/>
|
||
|
|
</Box>
|
||
|
|
))}
|
||
|
|
</Box>
|
||
|
|
<Typography gutterBottom textAlign='center' variant='h4' fontWeight='bold'>{licenseInfo.title}</Typography>
|
||
|
|
<Typography gutterBottom textAlign='center' marginBottom={3} variant='h6'>{licenseInfo.subtitle}</Typography>
|
||
|
|
<Typography fontWeight='bold' variant='h5'>Vous êtes autorisé à :</Typography>
|
||
|
|
<List sx={{marginBottom: 3}}>
|
||
|
|
{Object.entries(licenseInfo.allowed).map(([action, description]) => (
|
||
|
|
<ListItem key={action} alignItems='flex-start'>
|
||
|
|
<Box marginRight={2}>
|
||
|
|
<Image
|
||
|
|
width={46}
|
||
|
|
height={46}
|
||
|
|
alt={action}
|
||
|
|
src={`/images/cc/icons/${action}.svg`}
|
||
|
|
/>
|
||
|
|
</Box>
|
||
|
|
<ListItemText
|
||
|
|
primary={<Typography sx={{textDecoration: 'underline'}} fontWeight='bold' variant='h5'>{action}</Typography>}
|
||
|
|
secondary={<Typography variant='h6'>{description}</Typography>}
|
||
|
|
/>
|
||
|
|
</ListItem>
|
||
|
|
))}
|
||
|
|
</List>
|
||
|
|
<Typography gutterBottom fontWeight='bold' variant='h5'>Conditions :</Typography>
|
||
|
|
<List sx={{marginBottom: 3}}>
|
||
|
|
{conditions.map(({name, description}, index) => (
|
||
|
|
<ListItem key={name} alignItems='flex-start'>
|
||
|
|
<Box marginRight={2}>
|
||
|
|
<Image
|
||
|
|
width={46}
|
||
|
|
height={46}
|
||
|
|
alt={licenseList[index]}
|
||
|
|
src={`/images/cc/icons/${licenseList[index]}.svg`}
|
||
|
|
/>
|
||
|
|
</Box>
|
||
|
|
<ListItemText
|
||
|
|
primary={<Typography sx={{textDecoration: 'underline'}} fontWeight='bold' variant='h5'>{name}</Typography>}
|
||
|
|
secondary={<Typography variant='h6'>{description}</Typography>}
|
||
|
|
/>
|
||
|
|
</ListItem>
|
||
|
|
))}
|
||
|
|
</List>
|
||
|
|
<Link target='_blank' rel='noreferrer' underline='none' href={licenseInfo.link}>
|
||
|
|
<Button variant='text' endIcon={<OpenInNewIcon />}>
|
||
|
|
Lien vers la licence
|
||
|
|
</Button>
|
||
|
|
</Link>
|
||
|
|
</Box>
|
||
|
|
)
|
||
|
|
}
|
||
|
|
|
||
|
|
LicensesInfo.propTypes = {
|
||
|
|
license: PropTypes.string.isRequired
|
||
|
|
}
|