diff --git a/app/paroles/layout.js b/app/paroles/layout.js
index 6831fa7..3ee017d 100644
--- a/app/paroles/layout.js
+++ b/app/paroles/layout.js
@@ -1,7 +1,8 @@
import {Suspense} from 'react'
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 {CurrentTrackProvider} from '../../components/teks/current-track-context'
import Loading from './loading'
const siteName = process.env.NEXT_PUBLIC_SITE_NAME || 'PAWÒL-NU. Paroles et traductions.'
@@ -49,19 +50,17 @@ async function jwennDotDone() {
return teks
}
-export default async function PawolLayout({children, params}) {
- const {slug} = await params
+export default async function PawolLayout({children}) {
const teks = await jwennDotDone()
- const parole = slug ? await jwennTeksEpiSlug(slug) : null
return (
- <>
+
}>
-
+
- >
+
)
}
diff --git a/components/teks/current-track-context.js b/components/teks/current-track-context.js
new file mode 100644
index 0000000..3c2774e
--- /dev/null
+++ b/components/teks/current-track-context.js
@@ -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 (
+
+ {children}
+
+ )
+}
+
+export function useCurrentTrack() {
+ return useContext(CurrentTrackContext)
+}
+
+CurrentTrackProvider.propTypes = {
+ children: PropTypes.node.isRequired
+}
diff --git a/components/teks/teks-drawer.js b/components/teks/teks-drawer.js
index 845c530..4c5f1a8 100644
--- a/components/teks/teks-drawer.js
+++ b/components/teks/teks-drawer.js
@@ -18,6 +18,7 @@ import VweKouteAchte from './vwe-koute-achte'
import DrawerBar from './drawer-bar'
import Pataje from './pataje'
import KaraokeModal from './karaoke-modal'
+import {useCurrentTrack} from './current-track-context'
const drawerWidth = 240
@@ -25,7 +26,8 @@ const Alert = forwardRef(function Alert(props, ref) {
return
})
-export default function TeksDrawer({paroles, parole}) {
+export default function TeksDrawer({paroles}) {
+ const [parole] = useCurrentTrack()
const [mobileOpen, setMobileOpen] = useState(false)
const [open, setOpen] = useState(false)
const [error, setError] = useState('')
@@ -157,5 +159,4 @@ export default function TeksDrawer({paroles, parole}) {
TeksDrawer.propTypes = {
paroles: PropTypes.array,
- parole: PropTypes.object,
}
diff --git a/components/teks/teks.js b/components/teks/teks.js
index 1ac8dd4..3828e0b 100644
--- a/components/teks/teks.js
+++ b/components/teks/teks.js
@@ -28,6 +28,7 @@ import {StreamButton} from '../streaming-buttons'
import EntegreMizik from './entegre-mizik'
import OkiMizik from './oki-mizik'
import DiferansDialog from './diferans-dialog'
+import {useCurrentTrack} from './current-track-context'
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 coverFmt = formatKuveti(parole.couverture)
const [tab, setTab] = useState(0)
+ const [, setCurrentTrack] = useCurrentTrack()
useEffect(() => {
const isBrowser = () => typeof window !== 'undefined'
@@ -126,6 +128,11 @@ export default function Teks({parole}) {
window.scrollTo({top: 0, behavior: 'smooth'})
}, [])
+ useEffect(() => {
+ setCurrentTrack(parole)
+ return () => setCurrentTrack(null)
+ }, [parole, setCurrentTrack])
+
return (