Add & use HeadLayout

This commit is contained in:
2020-12-15 23:46:05 +01:00
parent 3a15fad116
commit 6cf85536d5
5 changed files with 61 additions and 15 deletions
+46
View File
@@ -0,0 +1,46 @@
import PropTypes from 'prop-types'
import Head from 'next/head'
import Navigasyon from './navigasyon'
export default function HeadLayout({
children,
title,
tab
}) {
return (
<div>
<Head>
<title>#OKi - {title ? title : 'Organisation KA Internationale'}</title>
<meta charSet='utf-8' />
<meta name='description' content='#OKi (Organisation KA Internationale) a pour but de promouvoir les langues et les productions afro-diasporiques.' />
<meta name='author' content='Ced' />
<meta name='viewport' content='minimum-scale=1, initial-scale=1, width=device-width' />
<meta property='og:url' content='https://o-k-i.net' />
<meta property='og:type' content='website' />
<meta property='og:site_name' content='#OKi' />
<meta property='og:title' content={`#OKi - ${title ? title : 'Organisation KA Internationale'}`} />
<meta property='og:description' content='#OKi (Organisation KA Internationale) a pour but de promouvoir les langues et les productions afro-diasporiques.' />
<meta property='og:locale' content='fr_FR' />
<meta property='og:image' content='http://o-k-i.net/logo.png' />
<meta property='og:image:secure_url' content='https://o-k-i.net/logo.png' />
<meta property='og:image:type' content='image/png' />
<meta property='og:image:width' content='551' />
<meta property='og:image:height' content='315' />
<meta property='og:image:alt' content='Logo #OKi - Organisation KA Internationale' />
</Head>
<Navigasyon selectedTab={tab} />
{children}
</div>
)
}
HeadLayout.propTypes = {
children: PropTypes.node.isRequired,
title: PropTypes.string,
tab: PropTypes.number.isRequired
}
HeadLayout.defaultProps = {
title: null
}
+3 -4
View File
@@ -3,23 +3,22 @@ import {Container, Grid} from '@material-ui/core'
import {jwennAwtisKantite, jwennAwtisPajinasyon} from '../lib/oki-api' import {jwennAwtisKantite, jwennAwtisPajinasyon} from '../lib/oki-api'
import Navigasyon from '../components/navigasyon'
import AwtisKat from '../components/awtis/awtis-kat' import AwtisKat from '../components/awtis/awtis-kat'
import Pajinasyon from '../components/awtis/pajinasyon' import Pajinasyon from '../components/awtis/pajinasyon'
import HeadLayout from '../components/head-layout'
const AWTIS_POU_CHAK_PAJ = process.env.NEXT_PUBLIC_AWTIS_POU_CHAK_PAJ || 6 const AWTIS_POU_CHAK_PAJ = process.env.NEXT_PUBLIC_AWTIS_POU_CHAK_PAJ || 6
export default function Awtis({pajTotal, awtisPouChakPaj, paj}) { export default function Awtis({pajTotal, awtisPouChakPaj, paj}) {
return ( return (
<> <HeadLayout title='Awtis' tab={1}>
<Navigasyon selectedTab={1} />
<Pajinasyon pajTotal={pajTotal} paj={paj} /> <Pajinasyon pajTotal={pajTotal} paj={paj} />
<Container> <Container>
<Grid container spacing={4}> <Grid container spacing={4}>
{awtisPouChakPaj.map(anAwtis => <AwtisKat key={anAwtis._id} anAwtis={anAwtis} />)} {awtisPouChakPaj.map(anAwtis => <AwtisKat key={anAwtis._id} anAwtis={anAwtis} />)}
</Grid> </Grid>
</Container> </Container>
</> </HeadLayout>
) )
} }
+6 -3
View File
@@ -1,10 +1,13 @@
import axios from 'axios' import axios from 'axios'
import HeadLayout from '../components/head-layout'
import Navigasyon from '../components/navigasyon'
export default function Home() { export default function Home() {
return ( return (
<Navigasyon selectedTab={0} /> <HeadLayout tab={0}>
<div>
Kay-la
</div>
</HeadLayout>
) )
} }
+3 -4
View File
@@ -2,15 +2,14 @@ import PropTypes from 'prop-types'
import {jwennMizikEpiSlug, jwennTeks} from '../../lib/oki-api' import {jwennMizikEpiSlug, jwennTeks} from '../../lib/oki-api'
import Navigasyon from '../../components/navigasyon'
import TeksDrawer from '../../components/teks/teks-drawer' import TeksDrawer from '../../components/teks/teks-drawer'
import HeadLayout from '../../components/head-layout'
export default function Mizik({miziks, mizik}) { export default function Mizik({miziks, mizik}) {
return ( return (
<> <HeadLayout title={`Tèks | ${mizik[0].titre}`} tab={2}>
<Navigasyon selectedTab={2} />
<TeksDrawer miziks={miziks} mizik={mizik} /> <TeksDrawer miziks={miziks} mizik={mizik} />
</> </HeadLayout>
) )
} }
+3 -4
View File
@@ -2,15 +2,14 @@ import PropTypes from 'prop-types'
import {jwennTeks} from '../../lib/oki-api' import {jwennTeks} from '../../lib/oki-api'
import Navigasyon from '../../components/navigasyon'
import TeksDrawer from '../../components/teks/teks-drawer' import TeksDrawer from '../../components/teks/teks-drawer'
import HeadLayout from '../../components/head-layout'
export default function Teks({miziks}) { export default function Teks({miziks}) {
return ( return (
<> <HeadLayout title='Tèks' tab={2}>
<Navigasyon selectedTab={2} />
<TeksDrawer miziks={miziks} /> <TeksDrawer miziks={miziks} />
</> </HeadLayout>
) )
} }