Type augmentation on Inertia types

[rrmesquita]

Hi, I want to augment Inertia types in order to achieve two things:

• simply use PageProps from the inertia package whenever I need to access all shared props
• be able to merge current page props with the global shared props when using usePage<CurrentPageProps>. right now, instead of merging, this code would make CurrentPageProps override the generic TPageProps in usePage, making global props not available

To do so, I've tried the following:

// resources/js/types/inertia.d.ts

import { type Page, type PageProps } from '@inertiajs/core'

// these are the global shared props
// stored in a separate file to maintain this file's readability
import { type PageProps as AppPageProps } from '.'

// todo: open issue to check if they can be shared
declare module '@inertiajs/core' {
  interface PageProps<TProps extends Record<string, any> = Record<string, any>>
    extends AppPageProps,
      TProps {}
}

declare module '@inertiajs/inertia' {
  interface PageProps<TProps extends Record<string, any> = Record<string, any>>
    extends AppPageProps,
      TProps {}
}

declare module '@inertiajs/react' {
  function usePage<T = Record<string, unknown>>(): Page<T & PageProps>
}

It's working decently, but with some caveats, like for example, my vscode can no longer auto-import the usePage hook, instead I need to manually go up in the file and do it myself. I've tried fixing it by my own but I can't get it to work.

With that said, I'm posting this to get to know from you guys, how would go about achieving those needs? Augment (and if so, how would you do it) or use custom defined types everywhere?

Thanks.