Infer TRoot and TProcedure for specific procedures (polymorphism)

"use client"

import { MutationLike, QueryLike } from "@trpc/react-query/shared"
import { AnyProcedure, AnyRootTypes } from "@trpc/server/unstable-core-do-not-import"
import { trpc } from "@/trpc/client"

type RequiredProcedures<TRoot extends AnyRootTypes, TProcedure extends AnyProcedure> = {
    create: MutationLike<TRoot, TProcedure>
    edit: MutationLike<TRoot, TProcedure>
    list: QueryLike<TRoot, TProcedure>
    details: QueryLike<TRoot, TProcedure>
}

export function useApi<T extends RequiredProcedures<any, any>>(
    getRouter: (
        router: typeof trpc
    ) => T extends RequiredProcedures<infer TRoot, infer TProcedure> ? RequiredProcedures<TRoot, TProcedure> : never
) {
    const router = getRouter(trpc)

    return {
        create: router.create,
        edit: router.edit,
        list: router.list,
        details: router.details,
    }
}

function Component() {
    const { create, edit } = useApi((router) => router.admin.product)

    const mut = create.useMutation()

    async function handleCreate() {
        await mut.mutateAsync({})
    }
}

"use client"

import { MutationLike, QueryLike } from "@trpc/react-query/shared"
import { AnyProcedure, AnyRootTypes } from "@trpc/server/unstable-core-do-not-import"
import { trpc } from "@/trpc/client"

type RequiredProcedures<TRoot extends AnyRootTypes, TProcedure extends AnyProcedure> = {
    create: MutationLike<TRoot, TProcedure>
    edit: MutationLike<TRoot, TProcedure>
    list: QueryLike<TRoot, TProcedure>
    details: QueryLike<TRoot, TProcedure>
}

export function useApi<T extends RequiredProcedures<any, any>>(
    getRouter: (
        router: typeof trpc
    ) => T extends RequiredProcedures<infer TRoot, infer TProcedure> ? RequiredProcedures<TRoot, TProcedure> : never
) {
    const router = getRouter(trpc)

    return {
        create: router.create,
        edit: router.edit,
        list: router.list,
        details: router.details,
    }
}

function Component() {
    const { create, edit } = useApi((router) => router.admin.product)

    const mut = create.useMutation()

    async function handleCreate() {
        await mut.mutateAsync({})
    }
}