Merge pull request 'feat: rendre le dépôt configurable via variables d'env' (#2) from feat/improve-custom into master

Reviewed-on: #2

.env.sample

@@ -6,6 +6,16 @@ SITE_URL=http://localhost:3001
 NEXT_PUBLIC_READ_TOKEN=
 NEXT_PUBLIC_ADMIN_JWT_SECRET=
 
+# IDENTITÉ DU SITE (branding)
+NEXT_PUBLIC_SITE_NAME=PAWÒL-NU. Paroles et traductions.
+NEXT_PUBLIC_SITE_SHORT_NAME=PAWÒL-NU
+NEXT_PUBLIC_SITE_DESCRIPTION=PAWÒL-NU a pour but de promouvoir le Medukam (ou Wanni Wannan) et les productions afro-diasporiques.
+NEXT_PUBLIC_ORG_NAME=OKI
+NEXT_PUBLIC_ORG_FULL_NAME=ORGANISATION KA INTERNATIONALE
+NEXT_PUBLIC_ORG_EMAIL=kontak@o-k-i.net
+NEXT_PUBLIC_ORG_LOCATION=Guadeloupe
+NEXT_PUBLIC_EXCLUSIVE_ARTIST_LABEL=OKI Exclusif
+
 # FUNKWHALE VARIABLE
 NEXT_PUBLIC_OKI_MIZIK_URL=https://funkwhale-server.com
 NEXT_PUBLIC_MIZIK_API_USER=user
@@ -14,9 +24,11 @@ NEXT_PUBLIC_MIZIK_API_PASSWORD=password
 NEXT_PUBLIC_AWTIS_POU_CHAK_PAJ=6
 NEXT_PUBLIC_SITE_URL=$SITE_URL
 
-# NEXT AUTH
+# Auth
 
 NEXTAUTH_URL=http://localhost:3000
+BETTER_AUTH_URL=http://localhost:3000
+BETTER_AUTH_SECRET=
 
 # TWITTER VARIABLE
 
@@ -32,6 +44,12 @@ GOOGLE_CLIENT_SECRET=
 
 NEXT_PUBLIC_CGU_DOWNLOAD_LINK=
 
+# Debug (mettre YES pour afficher les emails dans les logs en développement)
+SHOW_EMAILS=
+
+# Analytique (Plausible — laisser vide pour désactiver)
+NEXT_PUBLIC_PLAUSIBLE_URL=
+
 # Menu
 
 NEXT_PUBLIC_PROD_DOMAIN=
@@ -62,6 +80,8 @@ NEXT_PUBLIC_YOUTUBE_USERNAME=
 NEXT_PUBLIC_TELEGRAM_GROUP=
 NEXT_PUBLIC_XMPP=
 NEXT_PUBLIC_GIT=
+NEXT_PUBLIC_CODEBERG=
+NEXT_PUBLIC_BLUESKY_URL=
 
 # DOMAIN IMAGE
 NEXT_PUBLIC_DOMAINS_IMAGE="localhost:1337 strapi.mondomaine.com"
@@ -85,8 +105,11 @@ SMTP_PASSWORD=
 SMTP_FROM=
 SMTP_REPLY_TO=
 SMTP_SEND_TO=
+SMTP_BCC=
+SMTP_SECURE=
 
 # Twitter Authentification
 
 NEXT_PUBLIC_TWITTER_API_KEY=
 NEXT_PUBLIC_TWITTER_API_KEY_SECRET=
+NEXT_PUBLIC_TWITTER_BEARER_TOKEN=

.gitea/workflows/deploy-beta.yml

@@ -2,8 +2,6 @@ name: Déploiement FRONT BETA
 run-name: ${{ gitea.actor }} déploie FRONT BETA
 on:
   push:
-    branches:
-    - dev
 
 jobs:
   check:
@@ -36,7 +34,8 @@ jobs:
           export NVM_DIR="$HOME/.nvm"
           [ -s "$NVM_DIR/nvm.sh" ] && \. "$NVM_DIR/nvm.sh"
           cd ${{ secrets.FRONT_DEPLOY_PATH }}
-          git pull --ff-only origin dev
+          git fetch origin
+          git checkout -B ${{ gitea.ref_name }} origin/${{ gitea.ref_name }}
           corepack enable
           yarn install --frozen-lockfile
           yarn build

app/awtis/[slug]/page.js

@@ -50,11 +50,11 @@ export async function generateMetadata(props) {
       type: 'website'
     },
     twitter: {
-      site: '@OrganisationKA',
+      site: `@${process.env.NEXT_PUBLIC_TWITTER_USERNAME || 'OrganisationKA'}`,
       card: 'summary_large_image',
       title,
       description,
-      creator: '@OrganisationKA',
+      creator: `@${process.env.NEXT_PUBLIC_TWITTER_USERNAME || 'OrganisationKA'}`,
       images: {
         url: `${apiUrl}${kuvetiFormat?.url}`,
         alt: `Photo de ${anAwtis.alias}`,

app/awtis/page.js

@@ -10,17 +10,21 @@ import Pajinasyon from '../../components/awtis/pajinasyon'
 import {jwennAwtisPajinasyon} from '../../lib/oki-api'
 import Footer from '../../components/footer'
 
+const siteName = process.env.NEXT_PUBLIC_SITE_NAME || 'PAWÒL-NU. Paroles et traductions.'
+const siteUrl = process.env.NEXT_PUBLIC_SITE_URL || 'https://pawol.nu'
+const twitterHandle = `@${process.env.NEXT_PUBLIC_TWITTER_USERNAME || 'OrganisationKA'}`
+
 export const metadata = {
-  title: 'PAWÒL-NU | Artistes',
+  title: `${siteName} | Artistes`,
   description: 'Liste des artistes ayant une ou plusieurs œuvres présentes sur le site.',
   openGraph: {
-    title: 'PAWÒL-NU | Artistes',
+    title: `${siteName} | Artistes`,
     description: 'Liste des artistes ayant une ou plusieurs œuvres présentes sur le site.',
-    url: 'https://pawol.nu/sipote',
-    siteName: 'PAWÒL-NU. Paroles et traductions.',
+    url: `${siteUrl}/awtis`,
+    siteName,
     images: [
       {
-        url: 'https://pawol.nu/logo-512x512.png',
+        url: `${siteUrl}/logo-512x512.png`,
         width: 512,
         height: 512
       }
@@ -29,14 +33,14 @@ export const metadata = {
     type: 'website'
   },
   twitter: {
-    site: '@OrganisationKA',
+    site: twitterHandle,
     card: 'summary_large_image',
-    title: 'PAWÒL-NU | Artistes',
+    title: `${siteName} | Artistes`,
     description: 'Liste des artistes ayant une ou plusieurs œuvres présentes sur le site.',
-    creator: '@OrganisationKA',
+    creator: twitterHandle,
     images: {
-      url: 'https://pawol.nu/logo-512x512.png',
-      alt: 'OKI Logo',
+      url: `${siteUrl}/logo-512x512.png`,
+      alt: `${siteName} Logo`,
     }
   }
 }

app/layout.js

@@ -3,24 +3,33 @@ import TopLoader from '../components/top-loader'
 import Navigasyon from '../components/navigasyon'
 import ThemeRegistry from './theme-registy'
 
+const siteName = process.env.NEXT_PUBLIC_SITE_NAME || 'PAWÒL-NU. Paroles et traductions.'
+const siteDescription = process.env.NEXT_PUBLIC_SITE_DESCRIPTION || 'PAWÒL-NU a pour but de promouvoir le Medukam (ou Wanni Wannan) et les productions afro-diasporiques.'
+const siteUrl = process.env.NEXT_PUBLIC_SITE_URL || 'https://pawol.nu'
+const orgName = process.env.NEXT_PUBLIC_ORG_NAME || 'OKI'
+const orgEmail = process.env.NEXT_PUBLIC_ORG_EMAIL || 'kontak@o-k-i.net'
+const orgLocation = process.env.NEXT_PUBLIC_ORG_LOCATION || 'Guadeloupe'
+const twitterHandle = `@${process.env.NEXT_PUBLIC_TWITTER_USERNAME || 'OrganisationKA'}`
+const plausibleUrl = process.env.NEXT_PUBLIC_PLAUSIBLE_URL || null
+
 export const metadata = {
-  metadataBase: new URL('https://pawol.nu'),
-  manifest: '/manifest.json',
-  title: 'PAWÒL-NU. Paroles et traductions.',
-  description: 'PAWÒL-NU a pour but de promouvoir le Medukam (ou Wanni Wannan) et les productions afro-diasporiques.',
-  author: 'OKI',
+  metadataBase: new URL(siteUrl),
+  manifest: '/manifest.webmanifest',
+  title: siteName,
+  description: siteDescription,
+  author: orgName,
   category: 'music',
-  creator: 'OKI',
-  publisher: 'OKI',
-  applicationName: 'PAWÒL-NU. Paroles et traductions.',
+  creator: orgName,
+  publisher: orgName,
+  applicationName: siteName,
   openGraph: {
-    title: 'PAWÒL-NU. Paroles et traductions.',
-    description: 'PAWÒL-NU a pour but de promouvoir le Medukam (ou Wanni Wannan) et les productions afro-diasporiques.',
-    url: 'https://pawol.nu',
-    siteName: 'PAWÒL-NU. Paroles et traductions.',
+    title: siteName,
+    description: siteDescription,
+    url: siteUrl,
+    siteName,
     images: [
       {
-        url: 'https://pawol.nu/logo-512x512.png',
+        url: `${siteUrl}/logo-512x512.png`,
         width: 512,
         height: 512
       }
@@ -29,14 +38,14 @@ export const metadata = {
     type: 'website'
   },
   twitter: {
-    site: '@OrganisationKA',
+    site: twitterHandle,
     card: 'summary_large_image',
-    title: 'PAWÒL-NU. Paroles et traductions.',
-    description: 'PAWÒL-NU a pour but de promouvoir le Medukam (ou Wanni Wannan) et les productions afro-diasporiques.',
-    creator: '@OrganisationKA',
+    title: siteName,
+    description: siteDescription,
+    creator: twitterHandle,
     images: {
-      url: 'https://pawol.nu/logo-512x512.png',
-      alt: 'PAWÒL-NU Logo',
+      url: `${siteUrl}/logo-512x512.png`,
+      alt: `${siteName} Logo`,
     },
   }
 }
@@ -44,30 +53,36 @@ export const metadata = {
 const jsonLd = {
   '@context': 'https://schema.org',
   '@type': 'Organization',
-  url: 'https://pawol.nu',
-  email: 'kontak@o-k-i.net',
-  keywords: ['OKI', 'PAWÒL-NU', 'Paroles', 'Pawol', 'Medukam', 'Wanni Wannan'],
-  legalName: 'PAWÒL-NU',
-  location: 'Guadeloupe'
+  url: siteUrl,
+  email: orgEmail,
+  keywords: [orgName, siteName, 'Paroles', 'Pawol'],
+  legalName: siteName,
+  location: orgLocation,
 }
 
 export default async function RootLayout({children}) {
+  const inner = (
+    <>
+      <TopLoader color='#ffeb3b' />
+      <ThemeRegistry>
+        <Navigasyon />
+        {children}
+      </ThemeRegistry>
+      <section>
+        <script
+          type='application/ld+json'
+          dangerouslySetInnerHTML={{__html: JSON.stringify(jsonLd)}}
+        />
+      </section>
+    </>
+  )
+
   return (
     <html lang='fr' suppressHydrationWarning>
       <body>
-        <PlausibleProvider src='https://plausible.io/js/pa-3sQidCSfiSOXQUh-4La0T.js'>
-          <TopLoader color='#ffeb3b' />
-          <ThemeRegistry>
-            <Navigasyon />
-            {children}
-          </ThemeRegistry>
-          <section>
-            <script
-              type='application/ld+json'
-              dangerouslySetInnerHTML={{__html: JSON.stringify(jsonLd)}}
-            />
-          </section>
-        </PlausibleProvider>
+        {plausibleUrl
+          ? <PlausibleProvider src={plausibleUrl}>{inner}</PlausibleProvider>
+          : inner}
       </body>
     </html>
   )

app/manifest.js

@@ -0,0 +1,25 @@
+export default function manifest() {
+  return {
+    name: process.env.NEXT_PUBLIC_SITE_NAME || 'PAWÒL-NU',
+    short_name: process.env.NEXT_PUBLIC_SITE_SHORT_NAME || 'PAWÒL-NU',
+    description: process.env.NEXT_PUBLIC_SITE_DESCRIPTION || 'PAWÒL-NU a pour but de promouvoir le Medukam (ou Wanni Wannan) et les productions afro-diasporiques.',
+    scope: '/',
+    start_url: '/',
+    display: 'standalone',
+    background_color: '#303030',
+    theme_color: '#303030',
+    orientation: 'portrait-primary',
+    icons: [
+      {src: '/logo-72x72.png', type: 'image/png', sizes: '72x72'},
+      {src: '/logo-96x96.png', type: 'image/png', sizes: '96x96'},
+      {src: '/logo-128x128.png', type: 'image/png', sizes: '128x128'},
+      {src: '/logo-144x144.png', type: 'image/png', sizes: '144x144'},
+      {src: '/logo-152x152.png', type: 'image/png', sizes: '152x152'},
+      {src: '/logo-192x192.png', type: 'image/png', sizes: '192x192'},
+      {src: '/logo-256x256.png', type: 'image/png', sizes: '256x256'},
+      {src: '/logo-384x384.png', type: 'image/png', sizes: '384x384'},
+      {src: '/logo-512x512.png', type: 'image/png', sizes: '512x512'},
+      {src: '/maskable.png', type: 'image/png', sizes: '192x192', purpose: 'maskable'},
+    ],
+  }
+}

app/paroles/[slug]/page.js

@@ -53,11 +53,11 @@ export async function generateMetadata(props) {
       type: 'website'
     },
     twitter: {
-      site: '@OrganisationKA',
+      site: `@${process.env.NEXT_PUBLIC_TWITTER_USERNAME || 'OrganisationKA'}`,
       card: 'summary_large_image',
       title,
       description,
-      creator: '@OrganisationKA',
+      creator: `@${process.env.NEXT_PUBLIC_TWITTER_USERNAME || 'OrganisationKA'}`,
       images: {
         url: `${apiUrl}${kuvetiFormat?.url}`,
         alt: `Couverture ${title}`,

app/paroles/layout.js

@@ -4,17 +4,21 @@ import {jwennTeks} from '../../lib/oki-api'
 import TeksDrawer from '../../components/teks/teks-drawer'
 import Loading from './loading'
 
+const siteName = process.env.NEXT_PUBLIC_SITE_NAME || 'PAWÒL-NU. Paroles et traductions.'
+const siteUrl = process.env.NEXT_PUBLIC_SITE_URL || 'https://pawol.nu'
+const twitterHandle = `@${process.env.NEXT_PUBLIC_TWITTER_USERNAME || 'OrganisationKA'}`
+
 export const metadata = {
-  title: 'PAWÒL-NU. Paroles et traductions.',
+  title: siteName,
   description: 'Retrouvez les paroles et les traductions de vos chansons préférées.',
   openGraph: {
-    title: 'PAWÒL-NU. Paroles et traductions.',
+    title: siteName,
     description: 'Retrouvez les paroles et les traductions de vos chansons préférées.',
-    url: 'https://pawol.nu/paroles',
-    siteName: 'PAWÒL-NU. Paroles et traductions.',
+    url: `${siteUrl}/paroles`,
+    siteName,
     images: [
       {
-        url: 'https://pawol.nu/logo-512x512.png',
+        url: `${siteUrl}/logo-512x512.png`,
         width: 512,
         height: 512
       }
@@ -23,14 +27,14 @@ export const metadata = {
     type: 'website'
   },
   twitter: {
-    site: '@OrganisationKA',
+    site: twitterHandle,
     card: 'summary_large_image',
-    title: 'PAWÒL-NU. Paroles et traductions.',
+    title: siteName,
     description: 'Retrouvez les paroles et les traductions de vos chansons préférées.',
-    creator: '@OrganisationKA',
+    creator: twitterHandle,
     images: {
-      url: 'https://pawol.nu/logo-512x512.png',
-      alt: 'OKI Logo',
+      url: `${siteUrl}/logo-512x512.png`,
+      alt: `${siteName} Logo`,
     },
   }
 }

app/paroles/page.js

@@ -8,6 +8,8 @@ import Footer from '../../components/footer'
 
 const apiUrl = process.env.NEXT_PUBLIC_API_URL_ROOT || 'http://localhost:1337'
 const siteUrl = process.env.NEXT_PUBLIC_SITE_URL || 'http://localhost:3000'
+const siteName = process.env.NEXT_PUBLIC_SITE_NAME || 'PAWÒL-NU. Paroles et traductions.'
+const twitterHandle = `@${process.env.NEXT_PUBLIC_TWITTER_USERNAME || 'OrganisationKA'}`
 
 async function jwennDone() {
   const denyeTeks = await jwennDenyeTeks()
@@ -29,23 +31,23 @@ export async function generateMetadata() {
   const description = `Derniers morceaux : ${songList}…`
 
   return {
-    title: 'PAWÒL-NU | Derniers morceaux',
+    title: `${siteName} | Derniers morceaux`,
     description,
     openGraph: {
-      title: 'PAWÒL-NU | Derniers morceaux',
+      title: `${siteName} | Derniers morceaux`,
       description,
       url: `${siteUrl}/paroles`,
-      siteName: 'PAWÒL-NU. Paroles et traductions.',
+      siteName,
       images: [{url: imageUrl, width: imageWidth, height: imageHeight}],
       locale: 'fr_FR',
       type: 'website',
     },
     twitter: {
-      site: '@OrganisationKA',
+      site: twitterHandle,
       card: 'summary_large_image',
-      title: 'PAWÒL-NU | Derniers morceaux',
+      title: `${siteName} | Derniers morceaux`,
       description,
-      creator: '@OrganisationKA',
+      creator: twitterHandle,
       images: {url: imageUrl, alt: 'Couverture du dernier morceau publié'},
     },
   }

app/robots.js

@@ -15,6 +15,6 @@ export default function robots() {
       userAgent: '*',
       allow: '/',
     },
-    sitemap: 'https://pawol.nu/sitemap.xml',
+    sitemap: `${process.env.NEXT_PUBLIC_SITE_URL || 'https://pawol.nu'}/sitemap.xml`,
   }
 }

app/sipote/layout.js

@@ -1,14 +1,20 @@
+const siteName = process.env.NEXT_PUBLIC_SITE_NAME || 'PAWÒL-NU. Paroles et traductions.'
+const siteUrl = process.env.NEXT_PUBLIC_SITE_URL || 'https://pawol.nu'
+const orgFullName = process.env.NEXT_PUBLIC_ORG_FULL_NAME || process.env.NEXT_PUBLIC_ORG_NAME || 'ORGANISATION KA INTERNATIONALE'
+const twitterHandle = `@${process.env.NEXT_PUBLIC_TWITTER_USERNAME || 'OrganisationKA'}`
+const sipoteTitle = `${siteName} | Soutenir ${orgFullName} !`
+
 export const metadata = {
-  title: 'PAWÒL-NU | Soutenir ORGANISATION KA INTERNATIONALE !',
+  title: sipoteTitle,
   description: 'Vous pouvez nous soutenir via Liberapay ou PayPal',
   openGraph: {
-    title: 'PAWÒL-NU | Soutenir ORGANISATION KA INTERNATIONALE !',
+    title: sipoteTitle,
     description: 'Vous pouvez nous soutenir via Liberapay ou PayPal.',
-    url: 'https://pawol.nu/sipote',
-    siteName: 'PAWÒL-NU | Paroles et traductions.',
+    url: `${siteUrl}/sipote`,
+    siteName,
     images: [
       {
-        url: 'https://pawol.nu/sipote.png',
+        url: `${siteUrl}/sipote.png`,
         width: 500,
         height: 500
       }
@@ -17,14 +23,14 @@ export const metadata = {
     type: 'website'
   },
   twitter: {
-    site: '@OrganisationKA',
+    site: twitterHandle,
     card: 'summary_large_image',
-    title: 'PAWÒL-NU | Soutenir ORGANISATION KA INTERNATIONALE !',
+    title: sipoteTitle,
     description: 'Vous pouvez nous soutenir via Liberapay ou PayPal.',
-    creator: '@OrganisationKA',
+    creator: twitterHandle,
     images: {
-      url: 'https://pawol.nu/sipote.png',
-      alt: 'Sipòte OKI',
+      url: `${siteUrl}/sipote.png`,
+      alt: `Sipòte ${process.env.NEXT_PUBLIC_ORG_NAME || 'OKI'}`,
     },
   }
 }

components/awtis/awtis-detay.js

@@ -28,18 +28,19 @@ import AwtisBiyografi from './awtis-biyografi'
 import MizikLyen from './mizik-lyen'
 
 const IMAGE_URL = process.env.NEXT_PUBLIC_API_URL_ROOT || 'http://localhost:1337'
+const EXCLUSIVE_LABEL = process.env.NEXT_PUBLIC_EXCLUSIVE_ARTIST_LABEL || 'OKI Exclusif'
 const BLUR_DATA_URL = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAQAAAC1HAwCAAAAC0lEQVR42mNsYAAAAAYAAjCB0C8AAAAASUVORK5CYII='
 
 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, isOKIAwtis, titrePhare} = anAwtis
+  const {alias, biographie, paroles, photo, isExclusiveArtist, titrePhare} = anAwtis
   const sortedTeks = sortTeks(paroles)
   const gwanBiyo = biographie && biographie.length > 100
   const biyo = gwanBiyo ? `${biographie.slice(0, 100)}...` : biographie
 
-  const hasStreaming = isOKIAwtis && titrePhare?.streamAudio?.length > 0
+  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}`
     : null
@@ -81,11 +82,11 @@ export default function AwtisDetay({anAwtis}) {
         </Box>
       </Box>
 
-      {isOKIAwtis && (
+      {isExclusiveArtist && (
         <Box sx={{display: 'flex', flexDirection: 'column', alignItems: 'center', gap: 0.75, mb: 2}}>
           <Chip
             icon={<VerifiedIcon sx={{fontSize: 16}} />}
-            label='Artiste OKI Exclusif'
+            label={`Artiste ${EXCLUSIVE_LABEL}`}
             size='small'
             sx={{bgcolor: '#FFD700', color: '#000', fontWeight: 700, '& .MuiChip-icon': {color: '#000'}}}
           />

components/awtis/awtis-kat.js

@@ -20,6 +20,7 @@ import AwtisBiyografi from './awtis-biyografi'
 const PREFIX = 'awtis-kat'
 const SITE_URL = process.env.NEXT_PUBLIC_SITE_URL || 'http://localhost:3001'
 const IMAGE_URL = process.env.NEXT_PUBLIC_API_URL_ROOT || 'http://localhost:1337'
+const EXCLUSIVE_LABEL = process.env.NEXT_PUBLIC_EXCLUSIVE_ARTIST_LABEL || 'OKI Exclusif'
 
 const classes = {
   root: `${PREFIX}-root`,
@@ -57,16 +58,16 @@ export default function AwtisKat({artiste}) {
   const router = useRouter()
   const [esByografiOuve, meteEsByografiOuve] = useState(false)
 
-  const {alias, biographie, paroles, photo, slug, isOKIAwtis} = artiste
+  const {alias, biographie, paroles, photo, slug, isExclusiveArtist} = artiste
 
   return (
     <Grid size={{xs: 12, sm: 6, md: 4}}>
       <Kat>
-        <Card sx={{maxWidth: 340, position: 'relative', ...(isOKIAwtis && {outline: '2px solid #FFD700'})}}>
-          {isOKIAwtis && (
+        <Card sx={{maxWidth: 340, position: 'relative', ...(isExclusiveArtist && {outline: '2px solid #FFD700'})}}>
+          {isExclusiveArtist && (
             <Chip
               icon={<VerifiedIcon sx={{fontSize: 14}} />}
-              label='OKI Exclusif'
+              label={EXCLUSIVE_LABEL}
               size='small'
               sx={{
                 position: 'absolute', top: 8, left: 8, zIndex: 1,

components/cgu/cgu-dialog.js

@@ -2,7 +2,6 @@ import {useRef, useEffect} from 'react'
 import {styled, useTheme} from '@mui/material/styles'
 import PropTypes from 'prop-types'
 import {Button, Dialog, DialogActions, DialogContent, DialogTitle, Typography} from '@mui/material'
-import {useRouter} from 'next/navigation'
 import useMediaQuery from '@mui/material/useMediaQuery'
 import Cgu from '.'
 
@@ -23,17 +22,11 @@ const CGU_DOWNLOAD_LINK = process.env.NEXT_PUBLIC_CGU_DOWNLOAD_LINK
 export default function CGUDialog({open, setOpen}) {
   const theme = useTheme()
   const fullScreen = useMediaQuery(theme.breakpoints.down('md'))
-  const router = useRouter()
 
   const handleClose = () => {
     setOpen(false)
   }
 
-  const handleClick = event => {
-    event.preventDefault()
-    router.push(CGU_DOWNLOAD_LINK)
-  }
-
   const descriptionElementRef = useRef(null)
   useEffect(() => {
     if (open) {
@@ -64,7 +57,24 @@ export default function CGUDialog({open, setOpen}) {
             id='scroll-dialog-description'
             tabIndex={-1}
           >
-            <Cgu />
+            {CGU_DOWNLOAD_LINK ? (
+              <div style={{textAlign: 'center', padding: '2rem'}}>
+                <Typography paragraph>
+                  Consultez nos CGU et notre politique de confidentialité :
+                </Typography>
+                <Button
+                  variant='contained'
+                  component='a'
+                  href={CGU_DOWNLOAD_LINK}
+                  target='_blank'
+                  rel='noopener noreferrer'
+                >
+                  Consulter les CGU
+                </Button>
+              </div>
+            ) : (
+              <Cgu />
+            )}
           </Typography>
         </DialogContent>
         <DialogActions>

components/head-layout.js

@@ -5,6 +5,9 @@ import Navigasyon from './navigasyon'
 
 const siteUrl = process.env.NEXT_PUBLIC_SITE_URL || 'http://localhost:3000'
 const apiUrl = process.env.NEXT_PUBLIC_API_URL_ROOT || 'http://localhost:1337'
+const siteName = process.env.NEXT_PUBLIC_SITE_NAME || 'PAWÒL-NU. Paroles et traductions.'
+const orgName = process.env.NEXT_PUBLIC_ORG_NAME || 'OKI'
+const twitterHandle = `@${process.env.NEXT_PUBLIC_TWITTER_USERNAME || 'OrganisationKA'}`
 
 export default function HeadLayout({
   children,
@@ -20,38 +23,38 @@ export default function HeadLayout({
   return (
     <div>
       <Head prefix='website: https://ogp.me/ns/website#'>
-        <title>{`${title ? `PAWÒL-NU | ${title}` : 'PAWÒL-NU. Paroles et traductions.'}`}</title>
+        <title>{`${title ? `${siteName} | ${title}` : siteName}`}</title>
         <link rel='canonical' href={`${slug ? `${siteUrl}/${slug}` : siteUrl}`} />
         <link rel='manifest' href='/manifest.json' />
         <link rel='icon' type='image/x-icon' sizes='32x32' href='/favicon.ico' />
         <link rel='apple-touch-icon' href='/favicon.ico' />
         <meta name='monetization' content='$ilp.uphold.com/q7MFmYWNpwnr' />
-        <meta name='application-name' content='PAWÒL-NU. Paroles et traductions.' />
+        <meta name='application-name' content={siteName} />
         <meta name='twitter:card' content='summary_large_image' />
         <meta name='twitter:url' content={`${slug ? `${siteUrl}/${slug}` : siteUrl}`} />
-        <meta name='twitter:title' content={`${title ? title : 'PAWÒL-NU. Paroles et traductions.'}`} />
-        <meta name='twitter:description' content={`${summary ? summary : 'PAWÒL-NU a pour but de promouvoir les langues et les productions afro-diasporiques.'}`} />
+        <meta name='twitter:title' content={`${title ? title : siteName}`} />
+        <meta name='twitter:description' content={`${summary ? summary : process.env.NEXT_PUBLIC_SITE_DESCRIPTION || 'PAWÒL-NU a pour but de promouvoir les langues et les productions afro-diasporiques.'}`} />
         <meta name='twitter:image' content={`${imageUrl ? `${apiUrl}${imageUrl}` : `${siteUrl}/logo-192x192.png`}`} />
-        <meta name='twitter:creator' content='@OrganisationKA' />
-        <meta name='twitter:site' content='@OrganisationKA' />
+        <meta name='twitter:creator' content={twitterHandle} />
+        <meta name='twitter:site' content={twitterHandle} />
         <meta name='theme-color' content='#303030' />
         <meta name='apple-mobile-web-app-status-bar' content='#303030' />
         <meta charSet='utf-8' />
-        <meta name='description' content={`${summary ? summary : 'PAWÒL-NU a pour but de promouvoir les langues et les productions afro-diasporiques.'}`} />
-        <meta name='author' content='OKI' />
+        <meta name='description' content={`${summary ? summary : process.env.NEXT_PUBLIC_SITE_DESCRIPTION || 'PAWÒL-NU a pour but de promouvoir les langues et les productions afro-diasporiques.'}`} />
+        <meta name='author' content={orgName} />
         <meta name='viewport' content='minimum-scale=1, initial-scale=1, width=device-width' />
         <meta property='og:url' content={`${slug ? `${siteUrl}/${slug}` : siteUrl}`} />
         <meta property='og:type' content='website' />
-        <meta property='og:site_name' content={`${title ? title : 'PAWÒL-NU. Paroles et traductions.'}`} />
-        <meta property='og:title' content={`${title ? title : 'PAWÒL-NU. Paroles et traductions.'}`} />
-        <meta property='og:description' content={`${summary ? summary : 'PAWÒL-NU a pour but de promouvoir les langues et les productions afro-diasporiques.'}`} />
+        <meta property='og:site_name' content={`${title ? title : siteName}`} />
+        <meta property='og:title' content={`${title ? title : siteName}`} />
+        <meta property='og:description' content={`${summary ? summary : process.env.NEXT_PUBLIC_SITE_DESCRIPTION || 'PAWÒL-NU a pour but de promouvoir les langues et les productions afro-diasporiques.'}`} />
         <meta property='og:locale' content='fr_FR' />
         <meta property='og:image' content={`${imageUrl ? `${apiUrl}${imageUrl}` : `${siteUrl}/logo-512x512.png`}`} />
         <meta property='og:image:secure_url' content={`${imageUrl ? `${apiUrl}${imageUrl}` : `${siteUrl}/logo-512x512.png`}`} />
         <meta property='og:image:type' content={imageMime ? imageMime : 'image/png'} />
         <meta property='og:image:width' content={imageWidth ? imageWidth : '512'} />
         <meta property='og:image:height' content={imageHeight ? imageHeight : '512'} />
-        <meta property='og:image:alt' content={`${title && imageUrl ? title : 'PAWÒL-NU Logo'} | PAWÒL-NU. Paroles et traductions.`} />
+        <meta property='og:image:alt' content={`${title && imageUrl ? title : `${siteName} Logo`} | ${siteName}`} />
       </Head>
       <Navigasyon selectedTab={tab} />
       {children}

components/rezo/rezo-dialog.js

@@ -70,7 +70,7 @@ export default function RezoDialog() {
         onClose={handleClose}
       >
         <BootstrapDialogTitle id='rézo-dialog' onClose={handleClose}>
-          OKI sur le <strong>Fédiverse</strong>
+          {process.env.NEXT_PUBLIC_ORG_NAME || 'OKI'} sur le <strong>Fédiverse</strong>
         </BootstrapDialogTitle>
         <DialogContent>
           <Box>

components/soutyen/presantasyon.js

@@ -56,7 +56,7 @@ export default function Presantasyon() {
           </ListItem>
         </List>
         <Typography paragraph='true' variant='subtitle1' component='div'>
-          Pour toute question, n’hésitez pas à nous contacter par courriel <Link href='mailto:kontak@o-k-i.net'><strong>kontak@o-k-i.net</strong></Link>.
+          Pour toute question, n’hésitez pas à nous contacter par courriel <Link href={`mailto:${process.env.NEXT_PUBLIC_ORG_EMAIL || 'kontak@o-k-i.net'}`}><strong>{process.env.NEXT_PUBLIC_ORG_EMAIL || 'kontak@o-k-i.net'}</strong></Link>.
         </Typography>
         <Typography paragraph='true' variant='subtitle1' component='div'>
           <strong>Merci par avance pour votre soutien 🥰</strong>

lib/emails/payment-succeeded.js

@@ -1,5 +1,8 @@
 const {template} = require('lodash')
 
+const ORG_NAME = process.env.NEXT_PUBLIC_ORG_NAME || 'OKI'
+const SITE_URL = process.env.SITE_URL || process.env.NEXT_PUBLIC_SITE_URL || 'https://pawol.nu'
+
 const bodyTemplate = template(`
 <!DOCTYPE html>
 <html lang="fr">
@@ -65,18 +68,18 @@ const bodyTemplate = template(`
 
 <body>
   <div>
-    <img src="https://pawol.nu/logo-72x72.png" alt="Logo OKI">
+    <img src="${SITE_URL}/logo-72x72.png" alt="Logo ${ORG_NAME}">
   </div>
   <div class="title">
     <h2 style="margin:0; mso-line-height-rule:exactly;">Merci !</h2><br>
-    <h3 style="margin:0; mso-line-height-rule:exactly;">Votre soutien à OKI est important et nous vous en sommes très reconnaissant ❤️</h3>
+    <h3 style="margin:0; mso-line-height-rule:exactly;">Votre soutien à ${ORG_NAME} est important et nous vous en sommes très reconnaissant ❤️</h3>
   </div>
 
   <div class="container">
     <section>
       <h4>Une aide indispensable</h4>
       <p>
-        En effet, ce sont les dons qui nous permettent de maintenir tous les services liés à OKI.
+        En effet, ce sont les dons qui nous permettent de maintenir tous les services liés à ${ORG_NAME}.
       </p>
       <p>
         Toute contribution, aussi modeste soit-elle, nous permet d’augmenter nos capacités.<br />
@@ -94,7 +97,7 @@ const bodyTemplate = template(`
     <p>Pour toute question, n’hésitez pas à nous contacter en répondant à ce courriel.</p>
     <p>Merci infiniment pour votre soutien.</p>
 
-    <span><i><span class="forceWhiteLink"><button><a href="https://pawol.nu" target="blank">PAWÒL-NU</a></button></span></i></span>
+    <span><i><span class="forceWhiteLink"><button><a href="${SITE_URL}" target="blank">${ORG_NAME}</a></button></span></i></span>
   </footer>
 </html>
 `)

lib/oki-api.js

@@ -111,7 +111,7 @@ export async function jwennAwtisPajinasyon(paj) {
   const start = AWTIS_POU_CHAK_PAJ * (paj - 1)
   const query = qs.stringify({
     populate: ['paroles', 'photo'],
-    sort: ['isOKIAwtis:desc', 'createdAt:desc'],
+    sort: ['isExclusiveArtist:desc', 'createdAt:desc'],
     pagination: {
       start,
       limit: AWTIS_POU_CHAK_PAJ

next.config.js

@@ -5,6 +5,22 @@ const withPWA = require('next-pwa')({
   skipWaiting: true
 })
 
+function buildRemotePatterns() {
+  const raw = process.env.NEXT_PUBLIC_DOMAINS_IMAGE || ''
+  const patterns = raw.split(' ').filter(Boolean).map(entry => {
+    const [hostname, port] = entry.split(':')
+    const isLocal = hostname === 'localhost' || hostname === '127.0.0.1'
+    const pattern = {protocol: isLocal ? 'http' : 'https', hostname, pathname: '/uploads/**'}
+    if (port) pattern.port = port
+    return pattern
+  })
+  if (!raw.includes('localhost'))
+    patterns.push({protocol: 'http', hostname: 'localhost', port: '1337', pathname: '/uploads/**'})
+  if (!raw.includes('127.0.0.1'))
+    patterns.push({protocol: 'http', hostname: '127.0.0.1', port: '1337', pathname: '/uploads/**'})
+  return patterns
+}
+
 module.exports = (withPWA({
   turbopack: {},
   webpack: config => {
@@ -16,29 +32,6 @@ module.exports = (withPWA({
     return config
   },
   images: {
-    remotePatterns: [
-      {
-        protocol: 'https',
-        hostname: 'api.pawol.nu',
-        pathname: '/uploads/**',
-      },
-      {
-        protocol: 'https',
-        hostname: 'pawol.nu',
-      },
-      {
-        protocol: 'http',
-        hostname: '127.0.0.1',
-        port: '1337',
-        pathname: '/uploads/**',
-      },
-      {
-        protocol: 'http',
-        hostname: 'localhost',
-        port: '1337',
-        pathname: '/uploads/**',
-      },
-    ]
-
+    remotePatterns: buildRemotePatterns()
   }
 }))

public/manifest.json

@@ -1,64 +0,0 @@
-{
-  "name": "PAWÒL-NU",
-  "short_name": "PAWÒL-NU",
-  "description": "PAWÒL-NU a pour but de promouvoir le Medukam (ou Wanni Wannan) et les productions afro-diasporiques.",
-  "scope": "/",
-  "start_url": "/",
-  "display": "standalone",
-  "background_color": "#303030",
-  "theme_color": "#303030",
-  "orientation": "portrait-primary",
-  "icons": [
-    {
-      "src": "/logo-72x72.png",
-      "type": "image/png",
-      "sizes": "72x72"
-    },
-    {
-      "src": "/logo-96x96.png",
-      "type": "image/png",
-      "sizes": "96x96"
-    },
-    {
-      "src": "/logo-128x128.png",
-      "type": "image/png",
-      "sizes": "128x128"
-    },
-    {
-      "src": "/logo-144x144.png",
-      "type": "image/png",
-      "sizes": "144x144"
-    },
-    {
-      "src": "/logo-152x152.png",
-      "type": "image/png",
-      "sizes": "152x152"
-    },
-    {
-      "src": "/logo-192x192.png",
-      "type": "image/png",
-      "sizes": "192x192"
-    },
-    {
-      "src": "/logo-256x256.png",
-      "type": "image/png",
-      "sizes": "256x256"
-    },
-    {
-      "src": "/logo-384x384.png",
-      "type": "image/png",
-      "sizes": "384x384"
-    },
-    {
-      "src": "/logo-512x512.png",
-      "type": "image/png",
-      "sizes": "512x512"
-    },
-    {
-      "src": "maskable_oki.png",
-      "type": "image/png",
-      "sizes": "192x192",
-      "purpose": "maskable"
-    }
-  ]
-}