Adapt components with API response

app/awtis/[slug]/page.js

@@ -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>

app/awtis/page.js

@@ -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 />