From 78519f69b278b6ac9bd1fbcbac2131d66bd3a0dd Mon Sep 17 00:00:00 2001 From: James St-Pierre Date: Sat, 31 Aug 2024 15:42:18 -0400 Subject: [PATCH] [All] Pass the full page object to resolveComponent #1864 --- packages/core/src/router.ts | 4 ++-- packages/core/src/types.ts | 2 +- packages/react/src/createInertiaApp.ts | 4 ++-- packages/svelte/src/lib/components/SSR.svelte | 2 +- packages/svelte/src/lib/createInertiaApp.ts | 4 ++-- packages/svelte/src/lib/types.ts | 3 ++- packages/vue2/src/app.ts | 2 +- packages/vue2/src/createInertiaApp.ts | 6 +++--- packages/vue3/src/app.ts | 2 +- packages/vue3/src/createInertiaApp.ts | 6 +++--- 10 files changed, 18 insertions(+), 17 deletions(-) diff --git a/packages/core/src/router.ts b/packages/core/src/router.ts index 9b143e0e3..7d8a87f6d 100644 --- a/packages/core/src/router.ts +++ b/packages/core/src/router.ts @@ -462,7 +462,7 @@ export class Router { preserveState?: PreserveStateOption } = {}, ): Promise { - return Promise.resolve(this.resolveComponent(page.component)).then((component) => { + return Promise.resolve(this.resolveComponent(page.component, page)).then((component) => { if (visitId === this.visitId) { page.scrollRegions = page.scrollRegions || [] page.rememberedState = page.rememberedState || {} @@ -494,7 +494,7 @@ export class Router { if (event.state !== null) { const page = event.state const visitId = this.createVisitId() - Promise.resolve(this.resolveComponent(page.component)).then((component) => { + Promise.resolve(this.resolveComponent(page.component, page)).then((component) => { if (visitId === this.visitId) { this.page = page this.swapComponent({ component, page, preserveState: false }).then(() => { diff --git a/packages/core/src/types.ts b/packages/core/src/types.ts index 1f77ddbdd..1eebbfb5d 100644 --- a/packages/core/src/types.ts +++ b/packages/core/src/types.ts @@ -43,7 +43,7 @@ export interface Page { rememberedState: Record } -export type PageResolver = (name: string) => Component +export type PageResolver = (name: string, page: Page) => Component export type PageHandler = ({ component, diff --git a/packages/react/src/createInertiaApp.ts b/packages/react/src/createInertiaApp.ts index c287fca1a..6acd19046 100644 --- a/packages/react/src/createInertiaApp.ts +++ b/packages/react/src/createInertiaApp.ts @@ -78,11 +78,11 @@ export default async function createInertiaApp Promise.resolve(resolve(name)).then((module) => module.default || module) + const resolveComponent = (name, page) => Promise.resolve(resolve(name, page)).then((module) => module.default || module) let head = [] - const reactApp = await resolveComponent(initialPage.component).then((initialComponent) => { + const reactApp = await resolveComponent(initialPage.component, initialPage).then((initialComponent) => { return setup({ // @ts-expect-error el, diff --git a/packages/svelte/src/lib/components/SSR.svelte b/packages/svelte/src/lib/components/SSR.svelte index f056a30a2..319980a88 100644 --- a/packages/svelte/src/lib/components/SSR.svelte +++ b/packages/svelte/src/lib/components/SSR.svelte @@ -1,5 +1,5 @@ diff --git a/packages/svelte/src/lib/createInertiaApp.ts b/packages/svelte/src/lib/createInertiaApp.ts index 60833d4da..f33547a47 100644 --- a/packages/svelte/src/lib/createInertiaApp.ts +++ b/packages/svelte/src/lib/createInertiaApp.ts @@ -40,9 +40,9 @@ export default async function createInertiaApp({ const isServer = typeof window === 'undefined' const el = isServer ? null : document.getElementById(id) const initialPage: Page = page || JSON.parse(el?.dataset?.page || '{}') - const resolveComponent = (name: string) => Promise.resolve(resolve(name)) + const resolveComponent = (name: string, page: Page) => Promise.resolve(resolve(name, page)) - await resolveComponent(initialPage.component).then((initialComponent) => { + await resolveComponent(initialPage.component, initialPage).then((initialComponent) => { store.set({ component: initialComponent, page: initialPage, diff --git a/packages/svelte/src/lib/types.ts b/packages/svelte/src/lib/types.ts index 147ee2901..4cc4c998e 100644 --- a/packages/svelte/src/lib/types.ts +++ b/packages/svelte/src/lib/types.ts @@ -1,6 +1,7 @@ +import type { Page } from '@jamesst20/inertia-core' import type { ComponentType } from 'svelte' -export type ComponentResolver = (name: string) => ResolvedComponent | Promise +export type ComponentResolver = (name: string, page: Page) => ResolvedComponent | Promise export type ResolvedComponent = { default?: ComponentType diff --git a/packages/vue2/src/app.ts b/packages/vue2/src/app.ts index e7ca66923..9a046f418 100755 --- a/packages/vue2/src/app.ts +++ b/packages/vue2/src/app.ts @@ -8,7 +8,7 @@ import useForm from './useForm' export interface InertiaProps { initialPage: Page initialComponent?: object - resolveComponent?: (name: string) => Component + resolveComponent?: (name: string, page: Page) => Component titleCallback?: (title: string) => string onHeadUpdate?: (elements: string[]) => void } diff --git a/packages/vue2/src/createInertiaApp.ts b/packages/vue2/src/createInertiaApp.ts index 05ca365c1..6e8c752f4 100644 --- a/packages/vue2/src/createInertiaApp.ts +++ b/packages/vue2/src/createInertiaApp.ts @@ -4,7 +4,7 @@ import App, { InertiaApp, InertiaProps, plugin } from './app' interface CreateInertiaAppProps { id?: string - resolve: (name: string) => Component | Promise | { default: Component } + resolve: (name: string, page: Page) => Component | Promise | { default: Component } setup: (props: { el: Element App: InertiaApp @@ -40,11 +40,11 @@ export default async function createInertiaApp({ const el = isServer ? null : document.getElementById(id) const initialPage = page || JSON.parse(el.dataset.page) // @ts-expect-error - const resolveComponent = (name) => Promise.resolve(resolve(name)).then((module) => module.default || module) + const resolveComponent = (name, page) => Promise.resolve(resolve(name, page)).then((module) => module.default || module) let head = [] - const vueApp = await resolveComponent(initialPage.component).then((initialComponent) => { + const vueApp = await resolveComponent(initialPage.component, initialPage).then((initialComponent) => { return setup({ el, App, diff --git a/packages/vue3/src/app.ts b/packages/vue3/src/app.ts index e8f35067e..9a7015cd3 100755 --- a/packages/vue3/src/app.ts +++ b/packages/vue3/src/app.ts @@ -18,7 +18,7 @@ import useForm from './useForm' export interface InertiaAppProps { initialPage: Page initialComponent?: object - resolveComponent?: (name: string) => DefineComponent | Promise + resolveComponent?: (name: string, page: Page) => DefineComponent | Promise titleCallback?: (title: string) => string onHeadUpdate?: (elements: string[]) => void } diff --git a/packages/vue3/src/createInertiaApp.ts b/packages/vue3/src/createInertiaApp.ts index 6de9e493d..e5516d894 100644 --- a/packages/vue3/src/createInertiaApp.ts +++ b/packages/vue3/src/createInertiaApp.ts @@ -4,7 +4,7 @@ import App, { InertiaApp, InertiaAppProps, plugin } from './app' interface CreateInertiaAppProps { id?: string - resolve: (name: string) => DefineComponent | Promise | { default: DefineComponent } + resolve: (name: string, page: Page) => DefineComponent | Promise | { default: DefineComponent } setup: (props: { el: Element; App: InertiaApp; props: InertiaAppProps; plugin: Plugin }) => void | VueApp title?: (title: string) => string progress?: @@ -31,11 +31,11 @@ export default async function createInertiaApp({ const isServer = typeof window === 'undefined' const el = isServer ? null : document.getElementById(id) const initialPage = page || JSON.parse(el.dataset.page) - const resolveComponent = (name) => Promise.resolve(resolve(name)).then((module) => module.default || module) + const resolveComponent = (name, page) => Promise.resolve(resolve(name, page)).then((module) => module.default || module) let head = [] - const vueApp = await resolveComponent(initialPage.component).then((initialComponent) => { + const vueApp = await resolveComponent(initialPage.component, initialPage).then((initialComponent) => { return setup({ el, App,