2020-12-15 23:46:05 +01:00
import PropTypes from 'prop-types'
import Head from 'next/head'
import Navigasyon from './navigasyon'
2020-12-24 13:40:04 +01:00
const siteUrl = process . env . NEXT_PUBLIC_SITE_URL || 'http://localhost:3000'
2022-05-20 04:40:17 +04:00
const apiUrl = process . env . NEXT_PUBLIC_API_URL_ROOT || 'http://localhost:1337'
2026-06-26 00:34:04 +04:00
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' } `
2020-12-24 13:40:04 +01:00
2020-12-15 23:46:05 +01:00
export default function HeadLayout ({
children ,
2021-05-28 18:29:15 +02:00
imageUrl ,
imageWidth ,
imageHeight ,
2021-05-28 20:15:26 +02:00
imageMime ,
2020-12-15 23:46:05 +01:00
title ,
2020-12-24 13:39:07 +01:00
tab ,
2022-11-11 20:01:42 +04:00
slug ,
summary
2020-12-15 23:46:05 +01:00
}) {
return (
< div >
2023-03-04 15:45:11 +04:00
< Head prefix = 'website: https://ogp.me/ns/website#' >
2026-06-26 00:34:04 +04:00
< title > { ` ${ title ? ` ${ siteName } | ${ title } ` : siteName } ` } < /title>
2020-12-24 13:40:04 +01:00
< link rel = 'canonical' href = { ` ${ slug ? ` ${ siteUrl } / ${ slug } ` : siteUrl } ` } />
2020-12-23 00:08:43 +01:00
< link rel = 'manifest' href = '/manifest.json' />
2024-01-14 14:10:03 +04:00
< link rel = 'icon' type = 'image/x-icon' sizes = '32x32' href = '/favicon.ico' />
2023-03-20 22:57:10 +04:00
< link rel = 'apple-touch-icon' href = '/favicon.ico' />
2022-06-12 20:02:36 +04:00
< meta name = 'monetization' content = '$ilp.uphold.com/q7MFmYWNpwnr' />
2026-06-26 00:34:04 +04:00
< meta name = 'application-name' content = { siteName } />
2022-11-11 20:56:07 +04:00
< meta name = 'twitter:card' content = 'summary_large_image' />
2020-12-24 13:40:04 +01:00
< meta name = 'twitter:url' content = { ` ${ slug ? ` ${ siteUrl } / ${ slug } ` : siteUrl } ` } />
2026-06-26 00:34:04 +04:00
< 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.' } ` } />
2023-03-20 20:12:20 +04:00
< meta name = 'twitter:image' content = { ` ${ imageUrl ? ` ${ apiUrl }${ imageUrl } ` : ` ${ siteUrl } /logo-192x192.png` } ` } />
2026-06-26 00:34:04 +04:00
< meta name = 'twitter:creator' content = { twitterHandle } />
< meta name = 'twitter:site' content = { twitterHandle } />
2020-12-23 00:08:43 +01:00
< meta name = 'theme-color' content = '#303030' />
< meta name = 'apple-mobile-web-app-status-bar' content = '#303030' />
2020-12-15 23:46:05 +01:00
< meta charSet = 'utf-8' />
2026-06-26 00:34:04 +04:00
< 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 } />
2020-12-15 23:46:05 +01:00
< meta name = 'viewport' content = 'minimum-scale=1, initial-scale=1, width=device-width' />
2020-12-24 13:40:04 +01:00
< meta property = 'og:url' content = { ` ${ slug ? ` ${ siteUrl } / ${ slug } ` : siteUrl } ` } />
2020-12-15 23:46:05 +01:00
< meta property = 'og:type' content = 'website' />
2026-06-26 00:34:04 +04:00
< 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.' } ` } />
2020-12-15 23:46:05 +01:00
< meta property = 'og:locale' content = 'fr_FR' />
2023-03-20 20:12:20 +04:00
< 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` } ` } />
2021-05-28 20:15:26 +02:00
< meta property = 'og:image:type' content = { imageMime ? imageMime : 'image/png' } />
2022-01-28 10:28:53 +04:00
< meta property = 'og:image:width' content = { imageWidth ? imageWidth : '512' } />
< meta property = 'og:image:height' content = { imageHeight ? imageHeight : '512' } />
2026-06-26 00:34:04 +04:00
< meta property = 'og:image:alt' content = { ` ${ title && imageUrl ? title : ` ${ siteName } Logo` } | ${ siteName } ` } />
2020-12-15 23:46:05 +01:00
< /Head>
< Navigasyon selectedTab = { tab } />
{ children }
< /div>
)
}
HeadLayout . propTypes = {
children : PropTypes . node . isRequired ,
2021-05-28 18:29:15 +02:00
imageUrl : PropTypes . string ,
imageWidth : PropTypes . number ,
imageHeight : PropTypes . number ,
2021-05-28 20:15:26 +02:00
imageMime : PropTypes . string ,
2020-12-15 23:46:05 +01:00
title : PropTypes . string ,
2020-12-24 13:39:07 +01:00
tab : PropTypes . number . isRequired ,
2022-11-11 20:01:42 +04:00
slug : PropTypes . string ,
summary : PropTypes . string
2020-12-15 23:46:05 +01:00
}
HeadLayout . defaultProps = {
2021-05-28 18:29:15 +02:00
imageUrl : null ,
imageWidth : null ,
imageHeight : null ,
2021-05-28 20:15:26 +02:00
imageMime : null ,
2020-12-24 13:39:07 +01:00
title : null ,
2022-11-11 20:01:42 +04:00
slug : null ,
summary : null
2020-12-15 23:46:05 +01:00
}
