Adapt components with API response
This commit is contained in:
+11
-11
@@ -10,13 +10,13 @@ const apiUrl = process.env.NEXT_PUBLIC_API_URL_ROOT || 'http://localhost:1337'
|
||||
const siteUrl = process.env.NEXT_PUBLIC_SITE_URL || 'http://localhost:3000'
|
||||
|
||||
async function jwennAwtis(slug) {
|
||||
const awtis = await jwennAwtisEpiSlug(slug)
|
||||
const {data} = await jwennAwtisEpiSlug(slug)
|
||||
|
||||
if (!awtis) {
|
||||
if (!data) {
|
||||
notFound()
|
||||
}
|
||||
|
||||
return awtis
|
||||
return data
|
||||
}
|
||||
|
||||
export async function generateMetadata(props) {
|
||||
@@ -24,11 +24,11 @@ export async function generateMetadata(props) {
|
||||
const {slug} = params
|
||||
const anAwtis = await jwennAwtis(slug)
|
||||
|
||||
const title = `OKI | ${anAwtis.attributes.alias} - Paroles et Traductions`
|
||||
const description = `${anAwtis.attributes.alias}${anAwtis?.attributes?.biographie ? ` : ${anAwtis?.attributes?.biographie.slice(0, 100)}...` : ''}`
|
||||
const title = `OKI | ${anAwtis.alias} - Paroles et Traductions`
|
||||
const description = `${anAwtis.alias}${anAwtis?.biographie ? ` : ${anAwtis?.biographie.slice(0, 100)}...` : ''}`
|
||||
const url = `${siteUrl}/awtis/${slug}`
|
||||
|
||||
const {photo} = anAwtis.attributes
|
||||
const {photo} = anAwtis
|
||||
const kuvetiFormat = formatKuveti(photo)
|
||||
|
||||
return {
|
||||
@@ -57,7 +57,7 @@ export async function generateMetadata(props) {
|
||||
creator: '@OrganisationKA',
|
||||
images: {
|
||||
url: `${apiUrl}${kuvetiFormat?.url}`,
|
||||
alt: `Photo de ${anAwtis.attributes.alias}`,
|
||||
alt: `Photo de ${anAwtis.alias}`,
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -68,14 +68,14 @@ export default async function AwtisPajSlug(props) {
|
||||
const {slug} = params
|
||||
const anAwtis = await jwennAwtis(slug)
|
||||
|
||||
const {photo} = anAwtis.attributes
|
||||
const {photo} = anAwtis
|
||||
const kuvetiFormat = formatKuveti(photo)
|
||||
|
||||
const jsonLd = {
|
||||
'@context': 'http://schema.org',
|
||||
'@type': 'Person',
|
||||
'@id': anAwtis.attributes.musicBrainzUrl || undefined,
|
||||
name: anAwtis.attributes.alias,
|
||||
'@id': anAwtis.musicBrainzUrl || undefined,
|
||||
name: anAwtis.alias,
|
||||
url: `${siteUrl}/awtis/${slug}`,
|
||||
image: kuvetiFormat?.url ? `${apiUrl}${kuvetiFormat.url}` : undefined
|
||||
}
|
||||
@@ -84,7 +84,7 @@ export default async function AwtisPajSlug(props) {
|
||||
<>
|
||||
<Box sx={{display: 'flex', flexDirection: 'column', minHeight: '100vh'}}>
|
||||
<Box sx={{flexGrow: 1}}>
|
||||
<AwtisDetay anAwtis={anAwtis.attributes} />
|
||||
<AwtisDetay anAwtis={anAwtis} />
|
||||
</Box>
|
||||
<Footer />
|
||||
</Box>
|
||||
|
||||
+4
-4
@@ -48,14 +48,14 @@ async function jwennDone(paj) {
|
||||
notFound()
|
||||
}
|
||||
|
||||
const awtisPouChakPaj = await jwennAwtisPajinasyon(pajParsed)
|
||||
const pajTotal = Math.ceil(awtisPouChakPaj.meta.pagination.total / awtisPouChakPaj.meta.pagination.limit)
|
||||
const {data, meta} = await jwennAwtisPajinasyon(pajParsed)
|
||||
const pajTotal = Math.ceil(meta.pagination.total / meta.pagination.limit)
|
||||
|
||||
if (pajParsed > pajTotal || pajParsed < 1) {
|
||||
notFound()
|
||||
}
|
||||
|
||||
return {pajTotal, awtisPouChakPaj, pajParsed}
|
||||
return {pajTotal, awtisPouChakPaj: data, pajParsed}
|
||||
}
|
||||
|
||||
export default async function AwitsPaj(props) {
|
||||
@@ -69,7 +69,7 @@ export default async function AwitsPaj(props) {
|
||||
<ChecheAwtis />
|
||||
<Container sx={{marginBottom: 5, flexGrow: 100}}>
|
||||
<Grid container spacing={{xs: 2, md: 3}}>
|
||||
{awtisPouChakPaj.data.map(artiste => <AwtisKat key={artiste.id} artiste={artiste.attributes} />)}
|
||||
{awtisPouChakPaj.map(artiste => <AwtisKat key={artiste.id} artiste={artiste} />)}
|
||||
</Grid>
|
||||
</Container>
|
||||
<Footer />
|
||||
|
||||
+14
-15
@@ -26,12 +26,12 @@ export async function generateMetadata(props) {
|
||||
|
||||
const anTeks = await jwennAnTeks(slug)
|
||||
|
||||
const awtis = anTeks.attributes.artistes.length === 1 ? anTeks.attributes.artistes[0].data.attributes.alias : getAlias(anTeks.attributes.artistes, anTeks.attributes.prioriteArtistes)
|
||||
const title = `OKI | ${awtis} - ${anTeks.attributes.titre} | Paroles et Traductions`
|
||||
const description = `Paroles de « ${anTeks?.attributes?.titre} » : ${anTeks?.attributes?.transcription.slice(0, 100)}...`
|
||||
const awtis = anTeks?.artistes?.length === 1 ? anTeks?.artistes[0].alias : getAlias(anTeks.artistes, anTeks.prioriteArtistes)
|
||||
const title = `OKI | ${awtis} - ${anTeks.titre} | Paroles et Traductions`
|
||||
const description = `Paroles de « ${anTeks?.titre} » : ${anTeks?.transcription.slice(0, 100)}...`
|
||||
const url = `${siteUrl}/paroles/${slug}`
|
||||
|
||||
const {couverture} = anTeks.attributes
|
||||
const {couverture} = anTeks
|
||||
const kuvetiFormat = formatKuveti(couverture)
|
||||
|
||||
return {
|
||||
@@ -71,30 +71,29 @@ export default async function AnPawolPaj(props) {
|
||||
const {slug} = params
|
||||
|
||||
const anTeks = await jwennAnTeks(slug)
|
||||
const {couverture} = anTeks.attributes
|
||||
const {couverture} = anTeks
|
||||
const teksKuvetiFormat = formatKuveti(couverture)
|
||||
|
||||
const jsonLd = {
|
||||
'@context': 'http://schema.org',
|
||||
'@type': 'MusicRecording',
|
||||
'@id': anTeks.attributes.musicBrainzUrl || undefined,
|
||||
name: anTeks.attributes.titre,
|
||||
'@id': anTeks.musicBrainzUrl || undefined,
|
||||
name: anTeks.titre,
|
||||
url: `${siteUrl}/paroles/${slug}`,
|
||||
image: teksKuvetiFormat?.url ? `${apiUrl}${teksKuvetiFormat?.url}` : undefined,
|
||||
thumbnailUrl: couverture?.data?.attributes?.formats?.thumbnail?.url ? `${apiUrl}${couverture.data.attributes.formats.thumbnail.url}` : undefined,
|
||||
byArtist: anTeks.attributes.artistes.data.map(({attributes}) => {
|
||||
const {photo} = attributes
|
||||
thumbnailUrl: couverture?.formats?.thumbnail?.url ? `${apiUrl}${couverture.formats.thumbnail.url}` : undefined,
|
||||
byArtist: anTeks.artistes.map(({photo, musicBrainzUrl, alias, slug}) => {
|
||||
const kuvetiFormat = formatKuveti(photo)
|
||||
|
||||
return {
|
||||
'@type': 'Person',
|
||||
'@id': attributes.musicBrainzUrl || undefined,
|
||||
name: attributes.alias,
|
||||
url: `${siteUrl}/awtis/${attributes.slug}`,
|
||||
'@id': musicBrainzUrl || undefined,
|
||||
name: alias,
|
||||
url: `${siteUrl}/awtis/${slug}`,
|
||||
image: kuvetiFormat?.url ? `${apiUrl}${kuvetiFormat?.url}` : undefined
|
||||
}
|
||||
}),
|
||||
datePublished: anTeks.attributes?.annee
|
||||
datePublished: anTeks?.annee
|
||||
}
|
||||
|
||||
return (
|
||||
@@ -104,7 +103,7 @@ export default async function AnPawolPaj(props) {
|
||||
component='main'
|
||||
sx={{flexGrow: 1, p: 2, mt: 2}}
|
||||
>
|
||||
<AnTeks parole={anTeks.attributes} paroleId={anTeks.id} />
|
||||
<AnTeks parole={anTeks} paroleId={anTeks.id} />
|
||||
</Box>
|
||||
<Footer />
|
||||
</Box>
|
||||
|
||||
@@ -28,12 +28,12 @@ import MizikLyen from './mizik-lyen'
|
||||
const IMAGE_URL = process.env.NEXT_PUBLIC_API_URL_ROOT || 'http://localhost:1337'
|
||||
const noImageUrl = 'https://place-hold.it/140x140?text=Indisponible'
|
||||
|
||||
const sortTeks = paroles => paroles.sort((a, b) => a.attributes.titre.localeCompare(b.attributes.titre, 'fr', {sensitivity: 'base'}))
|
||||
const sortTeks = paroles => paroles.sort((a, b) => a.titre.localeCompare(b.titre, 'fr', {sensitivity: 'base'}))
|
||||
|
||||
export default function AwtisDetay({anAwtis}) {
|
||||
const [esByografiOuve, meteEsByografiOuve] = useState(false)
|
||||
const {alias, biographie, paroles, photo} = anAwtis
|
||||
const sortedTeks = sortTeks(paroles?.data)
|
||||
const sortedTeks = sortTeks(paroles)
|
||||
const gwanBiyo = biographie && biographie.length > 100
|
||||
|
||||
const biyo = gwanBiyo ? `${biographie.slice(0, 100)}...` : biographie
|
||||
@@ -51,7 +51,7 @@ export default function AwtisDetay({anAwtis}) {
|
||||
</Box>
|
||||
<Box sx={{justifyContent: 'center', display: 'flex', marginBottom: 2}}>
|
||||
<Avatar
|
||||
src={`${photo?.data?.attributes?.url ? `${IMAGE_URL}${photo?.data?.attributes?.url}` : noImageUrl}`}
|
||||
src={`${photo?.url ? `${IMAGE_URL}${photo?.url}` : noImageUrl}`}
|
||||
alt={`Photo ${alias}`}
|
||||
sx={{width: 200, height: 200, border: `2px solid ${green[500]}`}}
|
||||
/>
|
||||
@@ -99,13 +99,13 @@ export default function AwtisDetay({anAwtis}) {
|
||||
</AccordionDetails>
|
||||
</Accordion>
|
||||
) : (
|
||||
paroles.data.length === 0 ? (
|
||||
paroles.length === 0 ? (
|
||||
<Typography gutterBottom textAlign='center' variant='body1' component='h2'><strong>Aucune parole pour le moment</strong></Typography>
|
||||
) : (
|
||||
<Box>
|
||||
<Typography gutterBottom textAlign='center' variant='body1' component='h2'><strong>Parole</strong></Typography>
|
||||
<Paper sx={{height: '100%', paddingBlock: 2}}>
|
||||
<MizikLyen anPawol={paroles.data[0]} kuveti={formatKuveti(paroles.data[0].attributes.couverture)} />
|
||||
<MizikLyen anPawol={paroles[0]} kuveti={formatKuveti(paroles[0].couverture)} />
|
||||
</Paper>
|
||||
</Box>
|
||||
)
|
||||
@@ -123,7 +123,7 @@ export default function AwtisDetay({anAwtis}) {
|
||||
{esByografiOuve && (
|
||||
<AwtisBiyografi
|
||||
alias={alias}
|
||||
paroles={paroles.data}
|
||||
paroles={paroles}
|
||||
biographie={biographie}
|
||||
esByografiOuve={esByografiOuve}
|
||||
meteEsByografiOuve={meteEsByografiOuve}
|
||||
|
||||
@@ -66,7 +66,7 @@ export default function AwtisKat({artiste}) {
|
||||
className={classes.media}
|
||||
component='img'
|
||||
alt={alias}
|
||||
image={`${photo?.data?.attributes?.url ? `${IMAGE_URL}${photo?.data?.attributes?.url}` : noImageUrl}`}
|
||||
image={`${photo?.url ? `${IMAGE_URL}${photo?.url}` : noImageUrl}`}
|
||||
title={alias}
|
||||
/>
|
||||
<CardContent>
|
||||
@@ -74,7 +74,7 @@ export default function AwtisKat({artiste}) {
|
||||
{alias}
|
||||
</Typography>
|
||||
<Typography align='center' variant='body2' color='textSecondary' component='h5'>
|
||||
{`${paroles.data.length === 0 ? 'Aucune parole pour le moment' : `${paroles.data.length} ${paroles.data.length > 1 ? 'paroles' : 'parole'}`}`}
|
||||
{`${paroles.length === 0 ? 'Aucune parole pour le moment' : `${paroles.length} ${paroles.length > 1 ? 'paroles' : 'parole'}`}`}
|
||||
</Typography>
|
||||
</CardContent>
|
||||
</CardActionArea>
|
||||
@@ -82,7 +82,7 @@ export default function AwtisKat({artiste}) {
|
||||
{esByografiOuve && (
|
||||
<AwtisBiyografi
|
||||
alias={alias}
|
||||
paroles={paroles.data}
|
||||
paroles={paroles}
|
||||
biographie={biographie}
|
||||
esByografiOuve={esByografiOuve}
|
||||
meteEsByografiOuve={meteEsByografiOuve}
|
||||
|
||||
@@ -27,12 +27,13 @@ export default function ChecheAwtis() {
|
||||
|
||||
(async () => {
|
||||
try {
|
||||
const data = await jwennToutAwtis()
|
||||
const {data} = await jwennToutAwtis()
|
||||
|
||||
const filteredData = data.map(artiste => {
|
||||
const firstLetter = artiste.attributes.alias[0].toUpperCase()
|
||||
const firstLetter = artiste.alias[0].toUpperCase()
|
||||
return {
|
||||
firstLetter: /\d/.test(firstLetter) ? '0-9' : firstLetter,
|
||||
...artiste.attributes
|
||||
...artiste
|
||||
}
|
||||
})
|
||||
if (active) {
|
||||
|
||||
@@ -105,7 +105,7 @@ export default function MizikBadjMeni({paroles}) {
|
||||
<Paper>
|
||||
<ClickAwayListener onClickAway={handleClose}>
|
||||
<MenuList autoFocusItem={open} id='menu-list-grow' onKeyDown={() => handleListKeyDown()}>
|
||||
{sortedTeks.map(({id, attributes}) => <MenuItem key={id} onClick={() => handleClick(attributes.slug)}>{attributes.titre}</MenuItem>)}
|
||||
{sortedTeks.map(({id, slug, titre}) => <MenuItem key={id} onClick={() => handleClick(slug)}>{titre}</MenuItem>)}
|
||||
</MenuList>
|
||||
</ClickAwayListener>
|
||||
</Paper>
|
||||
|
||||
@@ -13,8 +13,8 @@ import {formatKuveti} from '../../lib/kuveti'
|
||||
import MizikLyen from './mizik-lyen'
|
||||
|
||||
function grupPawol(pawol) {
|
||||
const pawolTrie = pawol.sort((a, b) => a.attributes.titre.localeCompare(b.attributes.titre, 'fr', {sensitivity: 'base'}))
|
||||
const grupPawol = groupBy(pawol, anPawol => anPawol.attributes.titre[0].toUpperCase())
|
||||
const pawolTrie = pawol.sort((a, b) => a.titre.localeCompare(b.titre, 'fr', {sensitivity: 'base'}))
|
||||
const grupPawol = groupBy(pawol, anPawol => anPawol.titre[0].toUpperCase())
|
||||
const grupCounts = Object.values(grupPawol).map(anPawol => anPawol.length)
|
||||
const grup = Object.keys(grupPawol)
|
||||
grup.sort((a, b) => a[0].localeCompare(b[0], 'fr', {sensitivity: 'base'}))
|
||||
@@ -33,7 +33,7 @@ export default function MizikLis({niAwtis, paroles, meteEsMobilOuve}) {
|
||||
groupContent={index => <div>{grup[index]}</div>}
|
||||
itemContent={index => {
|
||||
const anPawol = pawol[index]
|
||||
const {couverture} = anPawol.attributes
|
||||
const {couverture} = anPawol
|
||||
const kuvetiFormat = formatKuveti(couverture)
|
||||
|
||||
return (
|
||||
|
||||
@@ -20,23 +20,23 @@ export default function MizikLyen({niAwtis, anPawol, kuveti, slug, meteEsMobilOu
|
||||
return (
|
||||
<Link
|
||||
passHref
|
||||
href={`/paroles/${anPawol.attributes.slug}#${anPawol.attributes.slug}`}
|
||||
href={`/paroles/${anPawol.slug}#${anPawol.slug}`}
|
||||
style={{textDecoration: 'none', width: '100%', display: 'flex', alignItems: 'center'}}
|
||||
onClick={() => meteEsMobilOuve(false)}
|
||||
>
|
||||
<ListItemButton
|
||||
sx={{padding: 0}}
|
||||
id={anPawol.attributes.slug}
|
||||
selected={slug === anPawol.attributes.slug}
|
||||
id={anPawol.slug}
|
||||
selected={slug === anPawol.slug}
|
||||
>
|
||||
<ListItemAvatar sx={{ml: 2.5}}>
|
||||
<Avatar alt={anPawol.attributes.titre} src={`${apiUrl}${kuveti?.url}`} />
|
||||
<Avatar alt={anPawol.titre} src={`${apiUrl}${kuveti?.url}`} />
|
||||
</ListItemAvatar>
|
||||
<ListItemText
|
||||
primary={<Typography sx={{fontWeight: 'bold'}} color='info.main'>{anPawol.attributes.titre}</Typography>}
|
||||
secondary={niAwtis ? getAlias(anPawol.attributes.artistes, anPawol.attributes.prioriteArtistes) : null} />
|
||||
primary={<Typography sx={{fontWeight: 'bold', color: 'info.main'}} >{anPawol.titre}</Typography>}
|
||||
secondary={niAwtis ? getAlias(anPawol.artistes, anPawol.prioriteArtistes) : null} />
|
||||
|
||||
{anPawol.attributes.creativeCommons && (
|
||||
{anPawol.creativeCommons && (
|
||||
<Box marginInline={1}>
|
||||
<Image
|
||||
width={24}
|
||||
@@ -48,14 +48,14 @@ export default function MizikLyen({niAwtis, anPawol, kuveti, slug, meteEsMobilOu
|
||||
</Box>
|
||||
)}
|
||||
|
||||
{esBrandNew(anPawol.attributes.publishedAt) && (
|
||||
{esBrandNew(anPawol.publishedAt) && (
|
||||
<FiberNewOutlinedIcon style={{fontSize: 30, marginRight: 5}} color='primary' />
|
||||
)}
|
||||
|
||||
{anPawol.attributes.explicitLyrics && (
|
||||
{anPawol.explicitLyrics && (
|
||||
<ExplicitIcon style={{marginRight: 5}} color='error' />
|
||||
)}
|
||||
{anPawol.attributes.okiMizikID && (
|
||||
{anPawol.okiMizikID && (
|
||||
<LibraryMusicIcon style={{fontSize: 30, marginRight: 5}} color='primary' />
|
||||
)}
|
||||
</ListItemButton>
|
||||
|
||||
@@ -50,8 +50,8 @@ export default function FilesList({files}) {
|
||||
const theme = useTheme()
|
||||
const {mode} = useColorScheme()
|
||||
|
||||
const musicFiles = files.filter(file => file.attributes.mime.startsWith('audio'))
|
||||
const pdfFiles = files.filter(file => file.attributes.mime === 'application/pdf')
|
||||
const musicFiles = files.filter(file => file.mime.startsWith('audio'))
|
||||
const pdfFiles = files.filter(file => file.mime === 'application/pdf')
|
||||
|
||||
const sortedMusicFiles = musicFiles.sort((a, b) => {
|
||||
const extensionOrder = {
|
||||
@@ -60,7 +60,7 @@ export default function FilesList({files}) {
|
||||
'.aac': 2,
|
||||
'.mp3': 3
|
||||
}
|
||||
return extensionOrder[a.attributes.ext.toLowerCase()] - extensionOrder[b.attributes.ext.toLowerCase()]
|
||||
return extensionOrder[a.ext.toLowerCase()] - extensionOrder[b.ext.toLowerCase()]
|
||||
})
|
||||
|
||||
const handleClick = (e, url, fileName) => {
|
||||
@@ -170,7 +170,7 @@ export default function FilesList({files}) {
|
||||
{sortedMusicFiles.map(file => (
|
||||
<StyledTableRow key={file.id}>
|
||||
<StyledTableCell>
|
||||
{getQuality(file.attributes.ext.toLowerCase(), file?.attributes?.caption?.toUpperCase())}
|
||||
{getQuality(file.ext.toLowerCase(), file?.caption?.toUpperCase())}
|
||||
</StyledTableCell>
|
||||
<StyledTableCell align='left'>
|
||||
<Link
|
||||
@@ -178,11 +178,11 @@ export default function FilesList({files}) {
|
||||
underline='hover'
|
||||
sx={{fontWeight: 'bold'}}
|
||||
aria-label='download'
|
||||
onClick={e => handleClick(e, `${apiUrl}${file.attributes.url}`, file.attributes.name)}
|
||||
onClick={e => handleClick(e, `${apiUrl}${file.url}`, file.name)}
|
||||
>
|
||||
{file.attributes.name}
|
||||
{file.name}
|
||||
</Link>
|
||||
<small style={{marginLeft: 3}}>({formatSize(file.attributes.size)})</small>
|
||||
<small style={{marginLeft: 3}}>({formatSize(file.size)})</small>
|
||||
</StyledTableCell>
|
||||
</StyledTableRow>
|
||||
))}
|
||||
@@ -217,7 +217,7 @@ export default function FilesList({files}) {
|
||||
<StyledTableRow key={file.id}>
|
||||
<StyledTableCell>
|
||||
<strong>
|
||||
{file.attributes.caption}
|
||||
{file.caption}
|
||||
</strong>
|
||||
</StyledTableCell>
|
||||
<StyledTableCell align='left'>
|
||||
@@ -226,11 +226,11 @@ export default function FilesList({files}) {
|
||||
underline='hover'
|
||||
sx={{fontWeight: 'bold'}}
|
||||
aria-label='download'
|
||||
onClick={e => handleClick(e, `${apiUrl}${file.attributes.url}`, file.attributes.name)}
|
||||
onClick={e => handleClick(e, `${apiUrl}${file.url}`, file.name)}
|
||||
>
|
||||
{file.attributes.name}
|
||||
{file.name}
|
||||
</Link>
|
||||
<small style={{marginLeft: 3}}>({formatSize(file.attributes.size)})</small>
|
||||
<small style={{marginLeft: 3}}>({formatSize(file.size)})</small>
|
||||
</StyledTableCell>
|
||||
</StyledTableRow>
|
||||
))}
|
||||
|
||||
@@ -38,20 +38,20 @@ const StyledList = styled(List)((
|
||||
export default function KomanteList({commentaires}) {
|
||||
return (
|
||||
<StyledList className={classes.root}>
|
||||
{commentaires.map(({id, attributes}) => (
|
||||
{commentaires.map(({id, user, contenu, datePublication}) => (
|
||||
<div key={id}>
|
||||
<ListItemText
|
||||
primary={
|
||||
<Typography gutterBottom style={{textDecoration: 'underline'}} variant='body1'>
|
||||
<small>{attributes.user.data.attributes.username}</small>
|
||||
<small>{user.username}</small>
|
||||
</Typography>
|
||||
}
|
||||
/>
|
||||
<ListItemText
|
||||
primary={formatJsonString(attributes.contenu)}
|
||||
primary={formatJsonString(contenu)}
|
||||
secondary={
|
||||
<Typography gutterBottom style={{marginBlock: 5, fontStyle: 'italic'}} variant='caption' display='block'>
|
||||
{format(new Date(attributes.datePublication), 'Pp', {locale: fr})}
|
||||
{format(new Date(datePublication), 'Pp', {locale: fr})}
|
||||
</Typography>
|
||||
}
|
||||
/>
|
||||
|
||||
@@ -191,7 +191,7 @@ function EkriTeks({canAutoTranslate, selectedTeks, setSelectedTeks}) {
|
||||
username: user.username,
|
||||
email: user.email
|
||||
},
|
||||
artistes: [artiste.data.id],
|
||||
artistes: [artiste.id],
|
||||
traductionAuto: tradiksyonOtomatik
|
||||
}
|
||||
}, {
|
||||
|
||||
@@ -8,7 +8,7 @@ export default function AnTeks({parole, paroleId}) {
|
||||
<Teks
|
||||
parole={parole}
|
||||
paroleId={paroleId}
|
||||
commentaires={parole?.commentaires.data}
|
||||
commentaires={parole?.commentaires}
|
||||
/>
|
||||
)
|
||||
}
|
||||
|
||||
@@ -49,7 +49,7 @@ export default function DiferansDialog({difference}) {
|
||||
<DialogTitle>Liste des modifications</DialogTitle>
|
||||
<List sx={{width: '100%', maxWidth: 360, bgcolor: 'background.paper'}}>
|
||||
{difference.map(({id, admin_user, date, jsonDiff}) => {
|
||||
const {firstname} = admin_user.data.attributes
|
||||
const {firstname} = admin_user
|
||||
const diferansDate = format(new Date(date), 'PPPppp', {locale: fr})
|
||||
|
||||
return (
|
||||
|
||||
@@ -17,13 +17,13 @@ import MizikLis from '../awtis/mizik-lis'
|
||||
|
||||
const getMizikFiltered = (paroles, filter) => {
|
||||
if (paroles) {
|
||||
const filteredTitre = paroles.filter(({attributes}) => {
|
||||
const deburredTit = deburr(attributes.titre)
|
||||
const filteredTitre = paroles.filter(({titre}) => {
|
||||
const deburredTit = deburr(titre)
|
||||
return deburredTit.toLowerCase().includes(deburr(filter.toLowerCase()))
|
||||
})
|
||||
|
||||
const filteredAlias = paroles.filter(({attributes}) => {
|
||||
const aliasLis = attributes.artistes.data.map(({attributes}) => deburr(attributes.alias)).join(', ')
|
||||
const filteredAlias = paroles.filter(({artistes}) => {
|
||||
const aliasLis = artistes.map(({alias}) => deburr(alias)).join(', ')
|
||||
return aliasLis.toLowerCase().includes(deburr(filter.toLowerCase()))
|
||||
})
|
||||
|
||||
|
||||
@@ -137,9 +137,9 @@ export default function Lekte({audio, url, parole}) {
|
||||
audioRef.current.volume = value / 100
|
||||
}
|
||||
|
||||
const imagePath = parole?.couverture?.data?.attributes?.formats?.thumbnail?.url
|
||||
const width = parole?.couverture?.data?.attributes?.formats?.thumbnail?.width || 192
|
||||
const height = parole?.couverture?.data?.attributes?.formats?.thumbnail?.height || 192
|
||||
const imagePath = parole?.couverture?.formats?.thumbnail?.url
|
||||
const width = parole?.couverture?.formats?.thumbnail?.width || 192
|
||||
const height = parole?.couverture?.formats?.thumbnail?.height || 192
|
||||
|
||||
const imageSrc = imagePath
|
||||
? new URL(imagePath, IMAGE_URL).toString()
|
||||
|
||||
@@ -50,10 +50,10 @@ export default function Pataje({parole, setError, setSuccess}) {
|
||||
const [open, setOpen] = useState(false)
|
||||
|
||||
const patajeUrl = `${SITE_URL}/paroles/${slug}`
|
||||
const alias = artistes.data.map(({attributes}) => attributes.alias)
|
||||
const alias = artistes.map(({alias}) => alias)
|
||||
const renderAwtis = new Intl.ListFormat('fr').format(alias)
|
||||
|
||||
const text = parole.user.data || parole.userAdmin.data ? `${renderAwtis} - ${titre} (Paroles et Traductions) - (parole soumise par ${parole?.user?.data?.attributes?.username || parole.userAdmin?.data?.attributes?.username || parole.userAdmin?.data?.attributes?.firstname})` : `${renderAwtis} - ${titre} (Paroles et Traductions)`
|
||||
const text = parole.user || parole.userAdmin ? `${renderAwtis} - ${titre} (Paroles et Traductions) - (parole soumise par ${parole?.user?.username || parole.userAdmin?.username || parole.userAdmin?.firstname})` : `${renderAwtis} - ${titre} (Paroles et Traductions)`
|
||||
|
||||
const handleClose = () => {
|
||||
setOpen(false)
|
||||
|
||||
@@ -32,7 +32,7 @@ export default function TeksDrawer({paroles}) {
|
||||
const [error, setError] = useState('')
|
||||
const [success, setSuccess] = useState('')
|
||||
|
||||
const parole = paroles.find(({attributes}) => attributes.slug === slug)
|
||||
const parole = paroles.find((parole) => parole.slug === slug)
|
||||
|
||||
useEffect(() => {
|
||||
if (error || success) {
|
||||
@@ -93,17 +93,17 @@ export default function TeksDrawer({paroles}) {
|
||||
{parole && (
|
||||
<Box sx={{display: 'flex', position: 'relative', top: '-20px'}}>
|
||||
<Box>
|
||||
<Pataje parole={parole.attributes} setError={setError} setSuccess={setSuccess} />
|
||||
<Pataje parole={parole} setError={setError} setSuccess={setSuccess} />
|
||||
</Box>
|
||||
|
||||
{parole.attributes.streamVideo && parole.attributes.streamVideo.length > 0 && (
|
||||
{parole.streamVideo && parole.streamVideo.length > 0 && (
|
||||
<Box>
|
||||
<VweKouteAchte niVideyo parole={parole.attributes} />
|
||||
<VweKouteAchte niVideyo parole={parole} />
|
||||
</Box>
|
||||
)}
|
||||
{parole.attributes.streamAudio && parole.attributes.streamAudio.length > 0 && (
|
||||
{parole.streamAudio && parole.streamAudio.length > 0 && (
|
||||
<Box>
|
||||
<VweKouteAchte niOdyo parole={parole.attributes} />
|
||||
<VweKouteAchte niOdyo parole={parole} />
|
||||
</Box>
|
||||
)}
|
||||
</Box>
|
||||
|
||||
@@ -40,11 +40,10 @@ const noImageUrl = 'https://place-hold.it/140x140?text=Indisponible'
|
||||
|
||||
export default function TeksKat({parole}) {
|
||||
const router = useRouter()
|
||||
const {attributes} = parole
|
||||
const {titre, artistes, annee, couverture, publishedAt, slug} = attributes
|
||||
const {titre, artistes, annee, couverture, publishedAt, slug} = parole
|
||||
|
||||
const datPiblikasyon = format(new Date(publishedAt), 'P', {locale: fr})
|
||||
const aliases = getAlias(artistes, attributes.prioriteArtistes)
|
||||
const aliases = getAlias(artistes, parole.prioriteArtistes)
|
||||
|
||||
const handleClick = slug => {
|
||||
router.push(`/paroles/${slug}`)?.then(() => window.scrollTo(0, 0))
|
||||
@@ -58,7 +57,7 @@ export default function TeksKat({parole}) {
|
||||
className={classes.media}
|
||||
component='img'
|
||||
alt={titre}
|
||||
image={couverture?.data?.attributes?.url ? `${IMAGE_URL}${couverture.data.attributes.url}` : noImageUrl}
|
||||
image={couverture?.url ? `${IMAGE_URL}${couverture.url}` : noImageUrl}
|
||||
title={titre}
|
||||
/>
|
||||
<CardContent>
|
||||
@@ -66,7 +65,7 @@ export default function TeksKat({parole}) {
|
||||
<Typography display='inline' style={{marginRight: 5}} variant='h6' component='h2'>
|
||||
{titre}
|
||||
</Typography>
|
||||
{attributes.creativeCommons && (
|
||||
{parole.creativeCommons && (
|
||||
<Box marginInline={1}>
|
||||
<Image
|
||||
width={24}
|
||||
@@ -78,7 +77,7 @@ export default function TeksKat({parole}) {
|
||||
</Box>
|
||||
)}
|
||||
|
||||
{attributes.explicitLyrics && (
|
||||
{parole.explicitLyrics && (
|
||||
<ExplicitIcon style={{marginRight: 5}} color='error' fontSize='small' />
|
||||
)}
|
||||
</Box>
|
||||
@@ -90,14 +89,14 @@ export default function TeksKat({parole}) {
|
||||
{annee}
|
||||
</Typography>
|
||||
<Typography sx={{fontStyle: 'italic'}} variant='caption'>
|
||||
{attributes.user && (
|
||||
{parole.user && (
|
||||
<>
|
||||
(<i>parole soumise par {attributes.user.username}</i>)
|
||||
(<i>parole soumise par {parole.user.username}</i>)
|
||||
</>
|
||||
)}
|
||||
{attributes.userAdmin && !attributes.user && (
|
||||
{parole.userAdmin && !parole.user && (
|
||||
<>
|
||||
(<i>parole soumise par {attributes.userAdmin}</i>)
|
||||
(<i>parole soumise par {parole.userAdmin}</i>)
|
||||
</>
|
||||
)}
|
||||
</Typography>
|
||||
|
||||
@@ -169,14 +169,14 @@ export default function Teks({parole}) {
|
||||
</Box>
|
||||
</Typography>
|
||||
|
||||
{parole?.user?.data && (
|
||||
{parole?.user && (
|
||||
<Typography style={{marginBottom: '1.5em'}} display='block' variant='caption'>
|
||||
<i>parole soumise par {parole.user.data.attributes.username}</i>
|
||||
<i>parole soumise par {parole.user.username}</i>
|
||||
</Typography>
|
||||
)}
|
||||
{parole?.userAdmin?.data && !parole.user.data && (
|
||||
{parole?.userAdmin&& !parole.user && (
|
||||
<Typography style={{marginBottom: '1.5em'}} display='block' variant='caption'>
|
||||
<i>parole soumise par {parole.userAdmin.data.attributes.firstname}</i>
|
||||
<i>parole soumise par {parole.userAdmin.firstname}</i>
|
||||
</Typography>
|
||||
)}
|
||||
{parole.creativeCommons && (
|
||||
@@ -184,8 +184,8 @@ export default function Teks({parole}) {
|
||||
<LicenseModal license={parole.creativeCommons.toLowerCase()} />
|
||||
</Box>
|
||||
)}
|
||||
{parole?.files?.data && (
|
||||
<FilesDialog files={parole.files.data} />
|
||||
{parole?.files && (
|
||||
<FilesDialog files={parole.files} />
|
||||
)}
|
||||
{(parole.okiMizikID || parole.streamAudio.length > 0 || parole.gadeEmbed) && (
|
||||
<Box sx={{textAlign: 'center'}}>
|
||||
|
||||
+8
-8
@@ -1,19 +1,19 @@
|
||||
export const formatKuveti = kuveti => {
|
||||
if (!kuveti?.data?.attributes) {
|
||||
if (!kuveti) {
|
||||
return null
|
||||
}
|
||||
|
||||
if (kuveti.data.attributes && kuveti.data.attributes.formats && kuveti.data.attributes.formats.large) {
|
||||
return kuveti.data.attributes.formats.large
|
||||
if (kuveti && kuveti.formats && kuveti.formats.large) {
|
||||
return kuveti.formats.large
|
||||
}
|
||||
|
||||
if (kuveti.data.attributes && kuveti.data.attributes.formats && kuveti.data.attributes.formats.medium) {
|
||||
return kuveti.data.attributes.formats.medium
|
||||
if (kuveti && kuveti.formats && kuveti.formats.medium) {
|
||||
return kuveti.formats.medium
|
||||
}
|
||||
|
||||
if (kuveti.data.attributes && kuveti.data.attributes.formats && kuveti.data.attributes.formats.small) {
|
||||
return kuveti.data.attributes.formats.small
|
||||
if (kuveti && kuveti.formats && kuveti.formats.small) {
|
||||
return kuveti.formats.small
|
||||
}
|
||||
|
||||
return kuveti.data.attributes
|
||||
return kuveti
|
||||
}
|
||||
|
||||
+8
-8
@@ -4,14 +4,14 @@ export const formatJsonString = stringToFormat =>
|
||||
stringToFormat.split('\n').map((string, index) => <div key={index}>{`${string}`}<br /></div>) // eslint-disable-line react/no-array-index-key
|
||||
|
||||
export const getAlias = (artistes, priorite = null, enhanced = false) => {
|
||||
if (artistes.data.length === 1 && !enhanced) {
|
||||
return artistes.data[0].attributes.alias
|
||||
if (artistes.length === 1 && !enhanced) {
|
||||
return artistes[0].alias
|
||||
}
|
||||
|
||||
if (artistes.data.length === 1 && enhanced) {
|
||||
if (artistes.length === 1 && enhanced) {
|
||||
return [{
|
||||
type: 'element',
|
||||
value: artistes.data[0].attributes.alias
|
||||
value: artistes[0].alias
|
||||
}]
|
||||
}
|
||||
|
||||
@@ -21,12 +21,12 @@ export const getAlias = (artistes, priorite = null, enhanced = false) => {
|
||||
|
||||
if (splittedPriority) {
|
||||
for (const element of splittedPriority) {
|
||||
const foundedArtistes = artistes.data.find(({id}) => id === element)
|
||||
alias.push(foundedArtistes.attributes.alias)
|
||||
const foundedArtistes = artistes.find(({id}) => id === element)
|
||||
alias.push(foundedArtistes.alias)
|
||||
}
|
||||
} else {
|
||||
for (const artiste of artistes.data) {
|
||||
alias.push(artiste.attributes.alias)
|
||||
for (const artiste of artistes) {
|
||||
alias.push(artiste.alias)
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user