ORGANISATION-KA-INTERNATIONALE/pawol.nu
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: unifier la logique de choix de taille d'image via formatKuveti

Browse Source
This commit is contained in:
cedric
2026-07-04 01:20:53 +04:00
parent 24f4f65853
commit c4dca87b61
8 changed files with 58 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files
components/awtis/awtis-detay.js
+4 -4
View File
@@ -45,11 +45,11 @@ export default function AwtisDetay({anAwtis}) {
const hasStreaming = isExclusiveArtist && titrePhare?.streamAudio?.length > 0
const coverUrl = titrePhare?.couverture
? `${IMAGE_URL}${titrePhare.couverture.formats?.small?.url || titrePhare.couverture.formats?.thumbnail?.url || titrePhare.couverture.url}`
? `${IMAGE_URL}${formatKuveti(titrePhare.couverture, 'small')?.url}`
: null
const photoUrl = photo?.url
? `${IMAGE_URL}${photo.formats?.small?.url || photo.formats?.thumbnail?.url || photo.url}`
? `${IMAGE_URL}${formatKuveti(photo, 'small')?.url}`
: null
return (
@@ -193,7 +193,7 @@ export default function AwtisDetay({anAwtis}) {
<AccordionDetails sx={{paddingInline: 0}}>
{sortedTeks.map(anPawol => {
const {couverture} = anPawol
const kuvetiFormat = couverture?.formats?.thumbnail || formatKuveti(couverture, 'small')
const kuvetiFormat = formatKuveti(couverture, 'thumbnail')
return (
<Box key={anPawol.id} sx={{paddingBlock: 0.5}}>
<MizikLyen anPawol={anPawol} kuveti={kuvetiFormat} />
@@ -210,7 +210,7 @@ export default function AwtisDetay({anAwtis}) {
<Box>
<Typography gutterBottom variant='body1'><strong>Parole</strong></Typography>
<Paper sx={{paddingBlock: 2}}>
<MizikLyen anPawol={paroles[0]} kuveti={paroles[0].couverture?.formats?.thumbnail || formatKuveti(paroles[0].couverture, 'small')} />
<MizikLyen anPawol={paroles[0]} kuveti={formatKuveti(paroles[0].couverture, 'thumbnail')} />
</Paper>
</Box>
)}
components/awtis/awtis-kat.js
+2 -1
View File
@@ -15,6 +15,7 @@ import Chip from '@mui/material/Chip'
import {styled} from '@mui/material/styles'
import VerifiedIcon from '@mui/icons-material/Verified'
import {formatKuveti} from '../../lib/kuveti'
import AwtisBiyografi from './awtis-biyografi'
const PREFIX = 'awtis-kat'
@@ -82,7 +83,7 @@ export default function AwtisKat({artiste}) {
className={classes.media}
component='img'
alt={alias}
image={`${photo?.url ? `${IMAGE_URL}${photo?.formats?.thumbnail?.url || photo?.url}` : noImageUrl}`}
image={`${photo?.url ? `${IMAGE_URL}${formatKuveti(photo, 'thumbnail')?.url}` : noImageUrl}`}
loading='lazy'
title={alias}
/>
components/awtis/cheche-awtis.js
+2 -1
View File
@@ -9,6 +9,7 @@ import CircularProgress from '@mui/material/CircularProgress'
import Container from '@mui/material/Container'
import {jwennToutAwtis} from '../../lib/oki-api'
import {formatKuveti} from '../../lib/kuveti'
const IMAGE_URL = process.env.NEXT_PUBLIC_API_URL_ROOT || 'http://localhost:1337'
@@ -79,7 +80,7 @@ export default function ChecheAwtis() {
<Avatar
style={{ marginRight: 8 }}
alt={option?.alias}
src={`${IMAGE_URL}${option?.photo?.formats?.thumbnail?.url || option?.photo?.url || ''}`}
src={`${IMAGE_URL}${formatKuveti(option?.photo, 'thumbnail')?.url || ''}`}
/>
{option?.alias}
</li>
components/awtis/mizik-lis.js
+1 -1
View File
@@ -34,7 +34,7 @@ export default function MizikLis({niAwtis, paroles, meteEsMobilOuve}) {
itemContent={index => {
const anPawol = pawol[index]
const {couverture} = anPawol
const kuvetiFormat = couverture?.formats?.thumbnail || formatKuveti(couverture, 'small')
const kuvetiFormat = formatKuveti(couverture, 'thumbnail')
return (
<MizikLyen niAwtis={niAwtis} anPawol={anPawol} kuveti={kuvetiFormat} slug={params.slug} meteEsMobilOuve={meteEsMobilOuve} />
components/teks/lekte.js
+5 -3
View File
@@ -17,6 +17,7 @@ import {grey} from '@mui/material/colors'
import {Link} from '@mui/material'
import {getAlias} from '../../lib/utils/format'
import {formatKuveti} from '../../lib/kuveti'
const IMAGE_URL = process.env.NEXT_PUBLIC_API_URL_ROOT || 'http://localhost:1337'
@@ -187,9 +188,10 @@ export default function Lekte({audio, url, parole}) {
audioRef.current.volume = value / 100
}
const imagePath = parole?.couverture?.formats?.thumbnail?.url
const width = parole?.couverture?.formats?.thumbnail?.width || 192
const height = parole?.couverture?.formats?.thumbnail?.height || 192
const couvertureFormat = formatKuveti(parole?.couverture, 'thumbnail')
const imagePath = couvertureFormat?.url
const width = couvertureFormat?.width || 192
const height = couvertureFormat?.height || 192
const imageSrc = imagePath
? new URL(imagePath, IMAGE_URL).toString()
components/teks/teks-kat.js
+2 -1
View File
@@ -16,6 +16,7 @@ import ExplicitIcon from '@mui/icons-material/Explicit'
import {styled} from '@mui/material/styles'
import {getAlias} from '../../lib/utils/format'
import {formatKuveti} from '../../lib/kuveti'
const PREFIX = 'teks-kat'
const IMAGE_URL = process.env.NEXT_PUBLIC_API_URL_ROOT || 'http://localhost:1337'
@@ -50,7 +51,7 @@ export default function TeksKat({parole}) {
<Box sx={{position: 'relative', height: 240}}>
{couverture?.url ? (
<Image
src={`${IMAGE_URL}${couverture.formats?.thumbnail?.url || couverture.url}`}
src={`${IMAGE_URL}${formatKuveti(couverture, 'thumbnail')?.url}`}
alt={titre}
fill
placeholder='blur'
lib/__tests__/kuveti.test.js
+38
View File
@@ -0,0 +1,38 @@
import {describe, it, expect} from 'vitest'
import {formatKuveti} from '../kuveti'
const kuveti = {
url: '/uploads/original.jpg',
formats: {
thumbnail: {url: '/uploads/thumbnail.jpg', width: 156, height: 156},
small: {url: '/uploads/small.jpg', width: 500, height: 500},
medium: {url: '/uploads/medium.jpg', width: 750, height: 750},
large: {url: '/uploads/large.jpg', width: 1000, height: 1000},
}
}
describe('formatKuveti', () => {
it('returns null when there is no image', () => {
expect(formatKuveti(null)).toBeNull()
expect(formatKuveti(undefined)).toBeNull()
})
it('defaults to the large format', () => {
expect(formatKuveti(kuveti)).toBe(kuveti.formats.large)
})
it('prefers the thumbnail format when asked', () => {
expect(formatKuveti(kuveti, 'thumbnail')).toBe(kuveti.formats.thumbnail)
})
it('falls back to small then medium then large when thumbnail is missing', () => {
const {thumbnail, ...rest} = kuveti.formats
const withoutThumbnail = {...kuveti, formats: rest}
expect(formatKuveti(withoutThumbnail, 'thumbnail')).toBe(rest.small)
})
it('falls back to the original file when no format matches', () => {
const noFormats = {url: '/uploads/original.jpg', formats: {}}
expect(formatKuveti(noFormats, 'thumbnail')).toBe(noFormats)
})
})
lib/kuveti.js
+4 -3
View File
@@ -1,7 +1,8 @@
const SIZE_ORDER = {
large: ['large', 'medium', 'small'],
medium: ['medium', 'small', 'large'],
small: ['small', 'medium', 'large'],
large: ['large', 'medium', 'small'],
medium: ['medium', 'small', 'large'],
small: ['small', 'medium', 'large'],
thumbnail: ['thumbnail', 'small', 'medium', 'large'],
}
export const formatKuveti = (kuveti, preferred = 'large') => {