feat: generic <Data> type for onBeforePrerenderStart()

examples/react-full/pages/hello/+Page.tsx

@@ -1,8 +1,11 @@
 export default Page
 
 import React from 'react'
+import { useData } from '../../renderer/useData'
+import type { Data } from './+data'
 
-function Page({ name }: { name: string }) {
+function Page() {
+  const { name } = useData<Data>()
   return (
     <>
       <h1>Hello</h1>

examples/react-full/pages/star-wars/@id/+Page.tsx

@@ -1,9 +1,11 @@
 export default Page
 
 import React from 'react'
-import type { MovieDetails } from '../types'
+import { useData } from '../../../renderer/useData'
+import type { Data } from './+data'
 
-function Page({ movie }: { movie: MovieDetails }) {
+function Page() {
+  const { movie } = useData<Data>()
   return (
     <>
       <h1>{movie.title}</h1>

examples/react-full/pages/star-wars/@id/+data.tsx

@@ -1,6 +1,6 @@
 // https://vike.dev/data
 export { data }
-export type Data = ReturnType<typeof data>
+export type Data = Awaited<ReturnType<typeof data>>
 
 import fetch from 'cross-fetch'
 import { filterMovieData } from '../filterMovieData'

examples/react-full/pages/star-wars/index/+Page.tsx

@@ -1,9 +1,11 @@
 export default Page
 
 import React from 'react'
-import type { Movie } from '../types'
+import { useData } from '../../../renderer/useData'
+import type { Data } from './+data'
 
-function Page({ movies }: { movies: Movie[] }) {
+function Page() {
+  const { movies } = useData<Data>()
   return (
     <>
       <h1>Star Wars Movies</h1>

examples/react-full/pages/star-wars/index/+data.ts

@@ -1,5 +1,6 @@
 // https://vike.dev/data
 export { data }
+export type Data = Awaited<ReturnType<typeof data>>
 
 import { filterMoviesData, getStarWarsMovies, getTitle } from './getStarWarsMovies'
 

examples/react-full/pages/star-wars/index/+onBeforePrerenderStart.ts

@@ -2,10 +2,14 @@
 export { onBeforePrerenderStart }
 
 import type { OnBeforePrerenderStartAsync } from 'vike/types'
+import type { Data as DataMovies } from './+data'
+import type { Data as DataMovie } from '../@id/+data'
 import { filterMovieData } from '../filterMovieData'
 import { filterMoviesData, getStarWarsMovies, getTitle } from './getStarWarsMovies'
 
-const onBeforePrerenderStart: OnBeforePrerenderStartAsync = async (): ReturnType<OnBeforePrerenderStartAsync> => {
+const onBeforePrerenderStart: OnBeforePrerenderStartAsync<DataMovie | DataMovies> = async (): ReturnType<
+  OnBeforePrerenderStartAsync<DataMovie | DataMovies>
+> => {
   const movies = await getStarWarsMovies()
 
   return [

examples/react-full/renderer/+onRenderClient.tsx

@@ -10,10 +10,10 @@ import type { OnRenderClientAsync } from 'vike/types'
 
 let root: ReactDOM.Root
 const onRenderClient: OnRenderClientAsync = async (pageContext): ReturnType<OnRenderClientAsync> => {
-  const { Page, data } = pageContext
+  const { Page } = pageContext
   const page = (
     <PageShell pageContext={pageContext}>
-      <Page {...data} />
+      <Page />
     </PageShell>
   )
   const container = document.getElementById('page-view')!

examples/react-full/renderer/+onRenderHtml.tsx

@@ -9,11 +9,11 @@ import { getPageTitle } from './getPageTitle'
 import type { OnRenderHtmlAsync } from 'vike/types'
 
 const onRenderHtml: OnRenderHtmlAsync = async (pageContext): ReturnType<OnRenderHtmlAsync> => {
-  const { Page, data } = pageContext
+  const { Page } = pageContext
 
   const stream = await renderToStream(
     <PageShell pageContext={pageContext}>
-      <Page {...data} />
+      <Page />
     </PageShell>,
     // We don't need react-streaming for this app. (We use it merely to showcase that Vike can handle react-streaming with a pre-rendered app. Note that using react-streaming with pre-rendering can make sense if we want to be able to use React's latest <Suspsense> techniques.)
     { disable: true }

examples/react-full/renderer/PageContext.ts

@@ -3,7 +3,10 @@ declare global {
   namespace Vike {
     interface PageContext {
       Page: Page
-      data?: Data
+      data?: {
+        // Needed by getPageTitle() and onBeforePrerenderStart()
+        title?: string
+      }
       config: {
         /** Title defined statically by /pages/some-page/+title.js (or by `export default { title }` in /pages/some-page/+config.js) */
         title?: string
@@ -14,8 +17,7 @@ declare global {
   }
 }
 
-type Page = (data: Data) => React.ReactElement
-type Data = Record<string, unknown> & { title?: string }
+type Page = () => React.ReactElement
 
 // Tell TypeScript that this file isn't an ambient module
 export {}

examples/react-full/renderer/useData.tsx

@@ -0,0 +1,9 @@
+// https://vike.dev/useData
+export { useData }
+
+import { usePageContext } from './usePageContext'
+
+function useData<Data>() {
+  const { data } = usePageContext()
+  return data as Data
+}

vike/shared/page-configs/Config.ts

@@ -97,24 +97,24 @@ type GuardSync = (pageContext: PageContextServer) => void
  *
  * https://vike.dev/onBeforePrerenderStart
  */
-type OnBeforePrerenderStartAsync = () => Promise<
+type OnBeforePrerenderStartAsync<Data = unknown> = () => Promise<
   (
     | string
     | {
         url: string
-        pageContext: Partial<Vike.PageContext>
+        pageContext: Partial<Vike.PageContext & { data: Data }>
       }
   )[]
 >
 /** Global Hook called before the whole pre-rendering process starts.
  *
  * https://vike.dev/onBeforePrerenderStart
  */
-type OnBeforePrerenderStartSync = () => (
+type OnBeforePrerenderStartSync<Data = unknown> = () => (
   | string
   | {
       url: string
-      pageContext: Partial<Vike.PageContext>
+      pageContext: Partial<Vike.PageContext & { data: Data }>
     }
 )[]
 /** Hook called before the page is rendered.
@@ -259,10 +259,6 @@ type RouteAsync = (
 type RouteSync = (
   pageContext: PageContextServer | PageContextClient
 ) => { routeParams?: Record<string, string>; precedence?: number } | boolean
-/** The page's URL(s).
- *
- *  https://vike.dev/route
- */
 
 // TODO: write docs of links below