Move paroles pages to app directory

2023-07-22 13:28:30 +04:00
parent 6f48dadbe6
commit ff992e04ed
6 changed files with 215 additions and 150 deletions
@@ -0,0 +1,105 @@
+import {notFound} from 'next/navigation'
+import Box from '@mui/material/Box'
+
+import {jwennTeksEpiSlug} from '../../../lib/oki-api'
+import AnTeks from '../../../components/teks/an-teks'
+import {getAlias} from '../../../lib/utils/format'
+import {formatKuveti} from '../../../lib/kuveti'
+
+const apiUrl = process.env.NEXT_PUBLIC_API_URL_ROOT || 'http://localhost:1337'
+const siteUrl = process.env.NEXT_PUBLIC_SITE_URL || 'http://localhost:3000'
+const drawerWidth = 340
+
+async function jwennAnTeks(slug) {
+  const teks = await jwennTeksEpiSlug(slug)
+
+  if (!teks) {
+    notFound()
+  }
+
+  return teks
+}
+
+export async function generateMetadata({params}) {
+  const {slug} = params
+
+  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 url = `${siteUrl}/${slug}`
+
+  const {couverture} = anTeks.attributes
+  const kuvetiFormat = formatKuveti(couverture)
+
+  return {
+    title,
+    description,
+    openGraph: {
+      title,
+      description,
+      url,
+      siteName: title,
+      images: [
+        {
+          url: `${apiUrl}${kuvetiFormat?.url}`,
+          width: kuvetiFormat?.width,
+          height: kuvetiFormat?.height
+        }
+      ],
+      locale: 'fr_FR',
+      type: 'website'
+    },
+    twitter: {
+      site: '@OrganisationKA',
+      card: 'summary_large_image',
+      title,
+      description,
+      creator: '@OrganisationKA',
+      images: {
+        url: `${apiUrl}${kuvetiFormat?.url}`,
+        alt: `Couverture ${title}`,
+      }
+    }
+  }
+}
+
+export default async function AnPawolPaj({params}) {
+  const {slug} = params
+
+  const anTeks = await jwennAnTeks(slug)
+
+  const jsonLd = {
+    '@context': 'http://schema.org',
+    '@type': 'MusicRecording',
+    name: anTeks.attributes.titre,
+    url: `${siteUrl}/paroles/${slug}`,
+    byArtist: anTeks.attributes.artistes.data.map(({attributes}) => ({
+      '@type': 'Person',
+      name: attributes.alias,
+      url: `${siteUrl}/awtis/${attributes.slug}`
+    })),
+    datePublished: anTeks.attributes?.annee
+  }
+
+  return (
+    <>
+      <Box sx={{display: 'flex'}}>
+        <Box
+          component='main'
+          sx={{flexGrow: 1, p: 2, mt: 2, width: {sm: `calc(100% - ${drawerWidth}px)`}}}
+        >
+          <AnTeks parole={anTeks.attributes} paroleId={anTeks.id} />
+        </Box>
+      </Box>
+
+      <section>
+        <script
+          type='application/ld+json'
+          dangerouslySetInnerHTML={{__html: JSON.stringify(jsonLd)}}
+        />
+      </section>
+    </>
+  )
+}