How to infer type of a nested object from app router output?

I have a tRPC router than returns a nested object through a db query. It looks like this:
ILessonCommentProps.comments: ({
_count: {
likes: number;
comments: number;
bookmarks: number;
};
comments: ({
user: GetResult<{
id: string;
displayName: string | null;
email: string | null;
emailVerified: Date | null;
... 17 more ...;
updatedAt: Date;
}, unknown>;
subComments: GetResult<...>[];
} & GetResult<...>)[];
bookmarks: {
...;
}[];
likes: {
...;
}[];
} & GetResult<...>) | null
ILessonCommentProps.comments: ({
_count: {
likes: number;
comments: number;
bookmarks: number;
};
comments: ({
user: GetResult<{
id: string;
displayName: string | null;
email: string | null;
emailVerified: Date | null;
... 17 more ...;
updatedAt: Date;
}, unknown>;
subComments: GetResult<...>[];
} & GetResult<...>)[];
bookmarks: {
...;
}[];
likes: {
...;
}[];
} & GetResult<...>) | null
I'd like to infer the type of the comments property to use as an interface for props on a component. I tried doing this but this doesn't work:
interface ILessonCommentProps {
comments: AppRouterOutputs['lessonBuilder']['getLessonLikesCommentsBookmarks']['comments'];
}
interface ILessonCommentProps {
comments: AppRouterOutputs['lessonBuilder']['getLessonLikesCommentsBookmarks']['comments'];
}
I was wondering if this is even possible?
3 Replies
Nick
Nick15mo ago
type InnerType = OuterType['innerKey'] and for an array element type InnerType = OuterType['innerKey'][number] So it looks like you are on the right track, more info on the error you've facing might be helpful
haardik | LearnWeb3
It simply doesn't want to do that. It says comments is not a key in OuterType['innerKey']
Nick
Nick15mo ago
If you do keyof what keys are returned? You just need to investigate what the actual type is as you’re probably just navigating it wrong Unions and intersections can make this more complicated though, it does look like a complex type
More Posts
What's the type of errorFormatter parameterI wanna know how could i get the type of the errorFormatter parameter, so i can move the errorFormattRPC works only for monoliths environment?How can I works if typesafe in real time with a remote server? 🤔How to use createCaller() with lambda for testing?Has anyone successfully mocked a trpc caller that uses the AWS Lambda integration? trying to write sis there a way to call useQuery() from a callback and get the return value within that callback?I have a generic component that is effectively an autocomplete that fills in options from a web requUsing Response with the Next App RouterThe route handlers in the App Router, only receive the Request object, requiring you to use a ResponThe only way to access useQuery options without input is passing undefined to it?Is there any other way? seems strange pass undefined to the input queryHow can I access the trpc context in zod's refine function?To do something like ```ts create: myProcedure .input(myInputSchema.refine(async ({ slug }, ctx)Set Request Headers for individual requests?Hello everyone, I have a simple question, can you somehow add headers to the individual requests insGet undefined when the refetch function has successfully workedIn my use case, I first disabled the useQuery function because I want it only fetch when I want to. Having trouble to import my AppRouter in my react clientEnvironment: Node v18.15.0 I created my TRPC router in my express app and exported it how -docume