Infer component names/location and invert InferPageProps contract.

[seivan]

Right now the idea is that the controller defines the output and the component conforms to the prop requirements.
It should be inverted.

Instead of

import { InferPageProps } from '@adonisjs/inertia'
import type { UsersController } from '../../controllers/users_controller.ts'

export function UsersPage(
  // 👇 It will be correctly typed based
  // on what you passed to inertia.render
  // in your controller
  props: InferPageProps<UsersController, 'index'>
) {
  return (
    // ...
  )
}

It should be the controller importing the component type, and reading its normal props but when the render call is executed each prop key value type is a union if X | () => X | Lazy<X> - Not sure what type Lazy is now but can get there later.

// Only defining a straight up array, and not a function. 
export function UsersPage(
  props: {users: Array<{id: number, name: string}>]
) {
  return (
    // ...
  )
}


import type { UsersPage } from 'inertia/pages/users/index.tsx'

// Any of these would work 
declare users: Array<{id: number, name: string}> | () => Array<{id: number, name: string}> | Lazy<Array<{id: number, name: string}>>

export class UsersController {
  index() {
    return inertia.render<UsersPage>({
      users: users
    }
  }
}

Name of the component, lookup path in the filesystem and the types should all be inferred by the render call.

This removes stringly bits, and it's usually the components that have a requirement of data for presentation purposes, not the controller.

Now I understand there are some issues here. You need the component name for matching the headers and other stuff, but also for doing the pages lookup on the glob.
There has to be a way to manage that without passing in a string and making the component conform to the requirements.

[Xstoudi]

Personnally I prefer Adonis having the lead on what are the props and their type.

[seivan]

Turns out what I wanted is possible.