Compare commits
2
Commits
96b7a601c8
...
7234c1408f
| Author | SHA1 | Date | |
|---|---|---|---|
|
|
7234c1408f
|
||
|
|
e4d31b0243
|
@@ -1,7 +1,8 @@
|
|||||||
import {Suspense} from 'react'
|
import {Suspense} from 'react'
|
||||||
import {notFound} from 'next/navigation'
|
import {notFound} from 'next/navigation'
|
||||||
import {jwennTeks, jwennTeksEpiSlug} from '../../lib/oki-api'
|
import {jwennTeks} from '../../lib/oki-api'
|
||||||
import TeksDrawer from '../../components/teks/teks-drawer'
|
import TeksDrawer from '../../components/teks/teks-drawer'
|
||||||
|
import {CurrentTrackProvider} from '../../components/teks/current-track-context'
|
||||||
import Loading from './loading'
|
import Loading from './loading'
|
||||||
|
|
||||||
const siteName = process.env.NEXT_PUBLIC_SITE_NAME || 'PAWÒL-NU. Paroles et traductions.'
|
const siteName = process.env.NEXT_PUBLIC_SITE_NAME || 'PAWÒL-NU. Paroles et traductions.'
|
||||||
@@ -49,19 +50,17 @@ async function jwennDotDone() {
|
|||||||
return teks
|
return teks
|
||||||
}
|
}
|
||||||
|
|
||||||
export default async function PawolLayout({children, params}) {
|
export default async function PawolLayout({children}) {
|
||||||
const {slug} = await params
|
|
||||||
const teks = await jwennDotDone()
|
const teks = await jwennDotDone()
|
||||||
const parole = slug ? await jwennTeksEpiSlug(slug) : null
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<>
|
<CurrentTrackProvider>
|
||||||
<Suspense fallback={<Loading />}>
|
<Suspense fallback={<Loading />}>
|
||||||
<TeksDrawer paroles={teks} parole={parole} />
|
<TeksDrawer paroles={teks} />
|
||||||
</Suspense>
|
</Suspense>
|
||||||
<section>
|
<section>
|
||||||
{children}
|
{children}
|
||||||
</section>
|
</section>
|
||||||
</>
|
</CurrentTrackProvider>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -0,0 +1,24 @@
|
|||||||
|
'use client'
|
||||||
|
|
||||||
|
import {createContext, useContext, useState} from 'react'
|
||||||
|
import PropTypes from 'prop-types'
|
||||||
|
|
||||||
|
const CurrentTrackContext = createContext([null, () => {}])
|
||||||
|
|
||||||
|
export function CurrentTrackProvider({children}) {
|
||||||
|
const state = useState(null)
|
||||||
|
|
||||||
|
return (
|
||||||
|
<CurrentTrackContext.Provider value={state}>
|
||||||
|
{children}
|
||||||
|
</CurrentTrackContext.Provider>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
export function useCurrentTrack() {
|
||||||
|
return useContext(CurrentTrackContext)
|
||||||
|
}
|
||||||
|
|
||||||
|
CurrentTrackProvider.propTypes = {
|
||||||
|
children: PropTypes.node.isRequired
|
||||||
|
}
|
||||||
@@ -18,6 +18,7 @@ import VweKouteAchte from './vwe-koute-achte'
|
|||||||
import DrawerBar from './drawer-bar'
|
import DrawerBar from './drawer-bar'
|
||||||
import Pataje from './pataje'
|
import Pataje from './pataje'
|
||||||
import KaraokeModal from './karaoke-modal'
|
import KaraokeModal from './karaoke-modal'
|
||||||
|
import {useCurrentTrack} from './current-track-context'
|
||||||
|
|
||||||
const drawerWidth = 240
|
const drawerWidth = 240
|
||||||
|
|
||||||
@@ -25,7 +26,8 @@ const Alert = forwardRef(function Alert(props, ref) {
|
|||||||
return <MuiAlert ref={ref} elevation={6} variant='filled' {...props} />
|
return <MuiAlert ref={ref} elevation={6} variant='filled' {...props} />
|
||||||
})
|
})
|
||||||
|
|
||||||
export default function TeksDrawer({paroles, parole}) {
|
export default function TeksDrawer({paroles}) {
|
||||||
|
const [parole] = useCurrentTrack()
|
||||||
const [mobileOpen, setMobileOpen] = useState(false)
|
const [mobileOpen, setMobileOpen] = useState(false)
|
||||||
const [open, setOpen] = useState(false)
|
const [open, setOpen] = useState(false)
|
||||||
const [error, setError] = useState('')
|
const [error, setError] = useState('')
|
||||||
@@ -157,5 +159,4 @@ export default function TeksDrawer({paroles, parole}) {
|
|||||||
|
|
||||||
TeksDrawer.propTypes = {
|
TeksDrawer.propTypes = {
|
||||||
paroles: PropTypes.array,
|
paroles: PropTypes.array,
|
||||||
parole: PropTypes.object,
|
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -28,6 +28,7 @@ import {StreamButton} from '../streaming-buttons'
|
|||||||
import EntegreMizik from './entegre-mizik'
|
import EntegreMizik from './entegre-mizik'
|
||||||
import OkiMizik from './oki-mizik'
|
import OkiMizik from './oki-mizik'
|
||||||
import DiferansDialog from './diferans-dialog'
|
import DiferansDialog from './diferans-dialog'
|
||||||
|
import {useCurrentTrack} from './current-track-context'
|
||||||
|
|
||||||
const IMAGE_URL = process.env.NEXT_PUBLIC_API_URL_ROOT || 'http://localhost:1337'
|
const IMAGE_URL = process.env.NEXT_PUBLIC_API_URL_ROOT || 'http://localhost:1337'
|
||||||
|
|
||||||
@@ -116,6 +117,7 @@ export default function Teks({parole}) {
|
|||||||
const enhancedAliases = getAlias(parole.artistes, parole.prioriteArtistes, true)
|
const enhancedAliases = getAlias(parole.artistes, parole.prioriteArtistes, true)
|
||||||
const coverFmt = formatKuveti(parole.couverture)
|
const coverFmt = formatKuveti(parole.couverture)
|
||||||
const [tab, setTab] = useState(0)
|
const [tab, setTab] = useState(0)
|
||||||
|
const [, setCurrentTrack] = useCurrentTrack()
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
const isBrowser = () => typeof window !== 'undefined'
|
const isBrowser = () => typeof window !== 'undefined'
|
||||||
@@ -126,6 +128,11 @@ export default function Teks({parole}) {
|
|||||||
window.scrollTo({top: 0, behavior: 'smooth'})
|
window.scrollTo({top: 0, behavior: 'smooth'})
|
||||||
}, [])
|
}, [])
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
setCurrentTrack(parole)
|
||||||
|
return () => setCurrentTrack(null)
|
||||||
|
}, [parole, setCurrentTrack])
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<Root className={classes.container}>
|
<Root className={classes.container}>
|
||||||
<Box sx={{textAlign: 'center', marginTop: 12}}>
|
<Box sx={{textAlign: 'center', marginTop: 12}}>
|
||||||
|
|||||||
+4
-4
@@ -133,7 +133,7 @@ export async function jwennToutAwtis() {
|
|||||||
populate: ['photo'],
|
populate: ['photo'],
|
||||||
sort: ['alias:asc'],
|
sort: ['alias:asc'],
|
||||||
pagination: {
|
pagination: {
|
||||||
pageSize: 100
|
pageSize: 200
|
||||||
}
|
}
|
||||||
}, {
|
}, {
|
||||||
encodeValuesOnly: true
|
encodeValuesOnly: true
|
||||||
@@ -155,7 +155,7 @@ export async function jwennTeks() {
|
|||||||
},
|
},
|
||||||
sort: ['titre:asc'],
|
sort: ['titre:asc'],
|
||||||
pagination: {
|
pagination: {
|
||||||
pageSize: 100
|
pageSize: 200
|
||||||
}
|
}
|
||||||
}, {
|
}, {
|
||||||
encodeValuesOnly: true
|
encodeValuesOnly: true
|
||||||
@@ -169,7 +169,7 @@ export async function jwennAwtisSlug() {
|
|||||||
const query = qs.stringify({
|
const query = qs.stringify({
|
||||||
sort: ['createdAt:desc'],
|
sort: ['createdAt:desc'],
|
||||||
pagination: {
|
pagination: {
|
||||||
pageSize: 100
|
pageSize: 200
|
||||||
}
|
}
|
||||||
}, {
|
}, {
|
||||||
encodeValuesOnly: true
|
encodeValuesOnly: true
|
||||||
@@ -183,7 +183,7 @@ export async function jwennTeksSlug() {
|
|||||||
const query = qs.stringify({
|
const query = qs.stringify({
|
||||||
sort: ['createdAt:desc'],
|
sort: ['createdAt:desc'],
|
||||||
pagination: {
|
pagination: {
|
||||||
pageSize: 100
|
pageSize: 200
|
||||||
}
|
}
|
||||||
}, {
|
}, {
|
||||||
encodeValuesOnly: true
|
encodeValuesOnly: true
|
||||||
|
|||||||
Reference in New Issue
Block a user