Jokcy•2y ago

Demo code `trpc.infinitePosts.add` on infinitedQuery not working

Doc here: https://trpc.io/docs/useInfiniteQuery#getinfinitedata, I created an my query like this:

infinitePosts: protectedProcedure
        .input(
            z.object({
                limit: z.number().min(1).max(100).nullish(),
                cursor: z.string().nullish(), // <-- "cursor" needs to exist, but can be any type
            })
        )
        .query(async ({ ctx, input }) => {
            const limit = input.limit ?? 20;
            const { cursor } = input;
            const items = await ctx.prisma.post.findMany({
                take: limit + 1, // get an extra item at the end which we'll use as next cursor
                cursor: cursor ? { id: cursor } : undefined,
                orderBy: {
                    updatedAt: 'asc',
                },
            });
            let nextCursor: typeof cursor | undefined = undefined;
            if (items.length > limit) {
                const nextItem = items.pop();
                nextCursor = nextItem!.id;
            }
            return {
                items,
                nextCursor,
            };
        }),

infinitePosts: protectedProcedure
        .input(
            z.object({
                limit: z.number().min(1).max(100).nullish(),
                cursor: z.string().nullish(), // <-- "cursor" needs to exist, but can be any type
            })
        )
        .query(async ({ ctx, input }) => {
            const limit = input.limit ?? 20;
            const { cursor } = input;
            const items = await ctx.prisma.post.findMany({
                take: limit + 1, // get an extra item at the end which we'll use as next cursor
                cursor: cursor ? { id: cursor } : undefined,
                orderBy: {
                    updatedAt: 'asc',
                },
            });
            let nextCursor: typeof cursor | undefined = undefined;
            if (items.length > limit) {
                const nextItem = items.pop();
                nextCursor = nextItem!.id;
            }
            return {
                items,
                nextCursor,
            };
        }),

Then on my client: api.post.infinitePosts, but there is no .add or .delete on it, am I miss something or is there any detail doc?

useInfiniteQuery | tRPC

- Your procedure needs to accept a cursor input of any type (string, number, etc)

0 Replies

No replies yetBe the first to reply to this messageJoin