From 1c6f99423212c99c9445426f1aa8e8636969b75f Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?C=C3=A9dric=20FAMIBELLE-PRONZOLA?= <c.pronzola@live.fr>
Date: Wed, 11 May 2022 03:10:16 +0400
Subject: [PATCH] Create dyanamic page awtis

---
 pages/awtis/[slug].js | 75 +++++++++++++++++++++++++++++++++++++++++++
 1 file changed, 75 insertions(+)
 create mode 100644 pages/awtis/[slug].js

diff --git a/pages/awtis/[slug].js b/pages/awtis/[slug].js
new file mode 100644
index 0000000..8b44848
--- /dev/null
+++ b/pages/awtis/[slug].js
@@ -0,0 +1,75 @@
+import PropTypes from 'prop-types'
+import {Box} from '@mui/material'
+
+import AwtisDetay from '../../components/awtis/awtis-detay'
+import Footer from '../../components/footer'
+import HeadLayout from '../../components/head-layout'
+import {jwennAwtisEpiSlug} from '../../lib/oki-api'
+
+import Custom404 from '../404'
+
+export default function SlugAwtis({error, anAwtis}) {
+  if (error) {
+    return <Custom404 statusCode={error} />
+  }
+
+  const {foto} = anAwtis
+
+  const formatKouveti = () => {
+    if (foto.length === 0) {
+      return null
+    }
+
+    const [anFoto] = foto
+
+    if (anFoto && anFoto.formats && anFoto.formats.large) {
+      return anFoto.formats.large
+    }
+
+    if (anFoto && anFoto.formats && anFoto.formats.medium) {
+      return anFoto.formats.medium
+    }
+
+    if (anFoto && anFoto.formats && anFoto.formats.small) {
+      return anFoto.formats.small
+    }
+
+    return anFoto
+  }
+
+  return (
+    <HeadLayout
+      imageUrl={formatKouveti() ? formatKouveti().url : null}
+      imageWidth={formatKouveti() ? formatKouveti().width : null}
+      imageHeight={formatKouveti() ? formatKouveti().height : null}
+      imageMime={formatKouveti() ? formatKouveti().mime : null}
+      title={`${anAwtis.alias} - Paroles et Traductions`} tab={2} slug={`awtis/${anAwtis.slug}`}
+    >
+      <Box sx={{display: 'flex', flexDirection: 'column', minHeight: '100vh'}}>
+        <AwtisDetay anAwtis={anAwtis} />
+      </Box>
+      <Footer />
+    </HeadLayout>
+  )
+}
+
+export async function getServerSideProps({query}) {
+  const {slug} = query
+  const anAwtis = await jwennAwtisEpiSlug(slug)
+
+  return {
+    props: {
+      error: Boolean(!anAwtis),
+      anAwtis: anAwtis ? anAwtis : null
+    }
+  }
+}
+
+SlugAwtis.defaultProps = {
+  anAwtis: null
+}
+
+SlugAwtis.propTypes = {
+  error: PropTypes.bool.isRequired,
+  anAwtis: PropTypes.object
+}