Proposal: Better typescript support with an additional props interface for usePage function

[mergehez]

I propose adding a new interface (e.g., CommonProps) to the existing TypeScript structure of Page to improve both type flexibility and autocomplete functionality. The new interface will allow a clear separation between page-specific properties and globally shared ones.

By adding this new interface, we can cleanly separate these global properties from the more dynamic PageProps and SharedProps. This will make the structure cleaner and more organized.

By using TypeScript's declaration merging, the interface can be extended in .d.ts files. This enables developers to globally add project-specific properties without the need for additional middleware types or workarounds.

Here's how the interface would be added to the Page interface:

export interface PageProps {
  [key: string]: unknown;
}

+export interface CommonProps { }

export interface Page<SharedProps extends PageProps = PageProps> {
  component: string;
-  props: PageProps &
+  props: PageProps & CommonProps &
    SharedProps & {
      errors: Errors & ErrorBag;
      deferred?: Record<string, VisitOptions['only']>;
    };
  url: string;
  version: string | null;
  scrollRegions: Array<{
    top: number;
    left: number;
  }>;
  rememberedState: Record<string, unknown>;
}

In a consuming project, the interface can be extended globally using a .d.ts file:

// global.d.ts
declare module '@inertia/core' {
    export interface CommonProps {
        locales: string[];
        currentLocale: string;
    }
}