WS-200: Migrate LiveRadio pages to NextJS - Simorgh changes#13928
WS-200: Migrate LiveRadio pages to NextJS - Simorgh changes#13928Isabella-Mitchell wants to merge 36 commits intolatestfrom
Conversation
There was a problem hiding this comment.
Pull request overview
Enables rendering of World Service Live Radio pages in the Next.js app by adding page-type derivation, a server-side route handler, and updating BFF/local fetch URL construction to support the Live Radio route shape.
Changes:
- Add
LIVE_RADIO_PAGEdetection in Next.jsderivePageTypeand corresponding unit test. - Introduce a Next.js
getServerSidePropsroute handler for Live Radio, including schedule-toggle handling and caching headers (with tests). - Update fetch URL construction for Live Radio in local/Next.js mode and plumb a
disableRadioScheduleflag throughgetPageData.
Reviewed changes
Copilot reviewed 11 out of 11 changed files in this pull request and generated 3 comments.
Show a summary per file
| File | Description |
|---|---|
| ws-nextjs-app/utilities/pageRequests/getPageData.ts | Adds disableRadioSchedule to the page-data request pipeline to BFF fetch. |
| ws-nextjs-app/utilities/derivePageType/index.ts | Derives LIVE_RADIO_PAGE from /bbc_*_radio/liveradio paths. |
| ws-nextjs-app/utilities/derivePageType/index.test.ts | Adds coverage for Live Radio page-type derivation. |
| ws-nextjs-app/pages/[service]/liveRadio/handleLiveRadioRoute.ts | Implements Next.js SSR handler for Live Radio, including toggle-based schedule behaviour and cache headers. |
| ws-nextjs-app/pages/[service]/liveRadio/handleLiveRadioRoute.test.ts | Adds unit tests for the Live Radio SSR handler. |
| ws-nextjs-app/pages/[service]/[[...]].page.tsx | Wires LIVE_RADIO_PAGE into the route handler map and render switch. |
| src/app/routes/utils/constructPageFetchUrl/index.ts | Adjusts local Live Radio fetch URL behaviour when running under Next.js. |
| src/app/routes/utils/constructPageFetchUrl/index.test.ts | Updates expected local Live Radio URL for Next.js mode. |
| src/app/pages/LiveRadioPage/types.ts | Renames the Live Radio page-data type export. |
| src/app/pages/LiveRadioPage/index.test.tsx | Updates tests to use the renamed Live Radio type. |
| src/app/pages/LiveRadioPage/LiveRadioPage.tsx | Updates component typing to use the renamed Live Radio type. |
| const { service, variant } = parseRoute(resolvedUrl); | ||
|
|
||
| const toggles = await getToggles(service); | ||
| const { enabled: scheduleIsEnabled } = toggles.liveRadioSchedule; | ||
| const disableRadioSchedule = !scheduleIsEnabled; |
There was a problem hiding this comment.
getToggles(service) is called before validating that service is present. When parseRoute returns null (e.g. invalid service), this can result in constructing an invalid toggles URL or other runtime errors before the handler returns the intended 404 props. Move the if (!service) early-return above the getToggles call (or guard getToggles behind the check).
| export type LiveRadioPageProps = { | ||
| language: string; | ||
| name: string; | ||
| summary: string; |
There was a problem hiding this comment.
The exported type name LiveRadioPageProps describes the shape of pageData (language/name/summary/etc), not the React component props object. This is already causing confusion in the Next.js catch-all route types. Consider renaming this back to something like LiveRadioPageData (and, if needed, introducing a separate LiveRadioPageProps type that wraps { pageData: LiveRadioPageData }).
| HomePageProps & | ||
| OnDemandAudioProps & | ||
| OnDemandTVProps; | ||
| OnDemandTVProps & | ||
| LiveRadioPageProps; |
There was a problem hiding this comment.
PageProps is intersected with LiveRadioPageProps, but that type currently represents the inner pageData fields (e.g. language, name, summary) rather than the page’s top-level props. This makes the Next.js page props type inaccurate and likely to mislead future changes. Define a wrapper type for the route (e.g. { pageData: LiveRadioPageData }) and use that in PageProps instead.
…live-radio-e2es
Resolves JIRA: Subtask https://bbc.atlassian.net/browse/WS-200 (Simorgh updates) of parent https://bbc.atlassian.net/browse/WS-2518 (Move all WS Live Radio pages to NextJS)
Summary
Sets up routing so that LiveRadioPage can be rendered on NextJS app
Code changes
Testing
Useful Links