OreQr
OreQr
TtRPC
Created by thomasplayschess on 9/13/2023 in #❓-help
Wrapping useQuery into a custom hook
bump
67 replies
TtRPC
Created by 7up on 9/12/2024 in #❓-help
NextJS App Routers with tRPC: can't call query on server component
3 replies
TtRPC
Created by thomasplayschess on 9/13/2023 in #❓-help
Wrapping useQuery into a custom hook
67 replies
TtRPC
Created by thomasplayschess on 9/13/2023 in #❓-help
Wrapping useQuery into a custom hook
67 replies
TtRPC
Created by thomasplayschess on 9/13/2023 in #❓-help
Wrapping useQuery into a custom hook
67 replies
TtRPC
Created by thomasplayschess on 9/13/2023 in #❓-help
Wrapping useQuery into a custom hook
bump
67 replies
TtRPC
Created by thomasplayschess on 9/13/2023 in #❓-help
Wrapping useQuery into a custom hook
I got it to this point but input and output data is any
/* eslint-disable @typescript-eslint/no-explicit-any */
import { type TRPCClientErrorLike } from "@trpc/client"
import {
type DecorateProcedure,
type UseTRPCQueryResult,
} from "@trpc/react-query/shared"
import {
type AnyTRPCQueryProcedure,
type inferProcedureInput,
} from "@trpc/server"

type ExtendedProcedure<T extends AnyTRPCQueryProcedure> = {
_def: {
$values: {
input: T["_def"]["$types"]["input"]
output: T["_def"]["$types"]["output"]
transformer: any
errorShape: any
}
}
} & T

export function useLazySuspenseQuery<
T extends ExtendedProcedure<AnyTRPCQueryProcedure>,
TDef extends T["_def"]["$values"],
>(
path: DecorateProcedure<"query", T["_def"]["$values"]>,
input: inferProcedureInput<T>
): UseTRPCQueryResult<TDef["output"], TRPCClientErrorLike<TDef>> {
return path.useQuery(input)
}
/* eslint-disable @typescript-eslint/no-explicit-any */
import { type TRPCClientErrorLike } from "@trpc/client"
import {
type DecorateProcedure,
type UseTRPCQueryResult,
} from "@trpc/react-query/shared"
import {
type AnyTRPCQueryProcedure,
type inferProcedureInput,
} from "@trpc/server"

type ExtendedProcedure<T extends AnyTRPCQueryProcedure> = {
_def: {
$values: {
input: T["_def"]["$types"]["input"]
output: T["_def"]["$types"]["output"]
transformer: any
errorShape: any
}
}
} & T

export function useLazySuspenseQuery<
T extends ExtendedProcedure<AnyTRPCQueryProcedure>,
TDef extends T["_def"]["$values"],
>(
path: DecorateProcedure<"query", T["_def"]["$values"]>,
input: inferProcedureInput<T>
): UseTRPCQueryResult<TDef["output"], TRPCClientErrorLike<TDef>> {
return path.useQuery(input)
}
Versions: - Typescript: 5.5.3 - tRPC: 11.0.0-rc.477
67 replies
TtRPC
Created by thomasplayschess on 9/13/2023 in #❓-help
Wrapping useQuery into a custom hook
How to make it work with tRPC v11?
67 replies
TtRPC
Created by thomasplayschess on 9/13/2023 in #❓-help
Wrapping useQuery into a custom hook
+1
67 replies