Satou kuzuma Posts

Satou kuzuma

•Created by Satou kuzuma on 3/16/2024 in #❓-help

useInfiniteQuery does not exist on appRouter t3-Stack Prisma

I'm using appRouter and trying to do pagination with useInfiniteQuery() but i've got the next typescript error:

Property 'useInfiniteQuery' does not exist on type '{ query: Resolver<BuildProcedure<"query", { _config: RootConfig<{ ctx: { headers: Headers; db: PrismaClient<{ log: ("query" | "warn" | "error")[]; }, never, DefaultArgs>; session: Session | null; }; meta: object; errorShape: { ...; }; transformer: typeof SuperJSON; }>; ... 5 more ...; _output_out: unique symbol; }

and I can't find anything about it. This is my code

 const posts = await api.post.getAllPosts.useInfiniteQuery(
      {
        limit: 5,
      },

      {
        getNextPageParam(lastPage) {
          return lastPage.nextCursor;
        },
      },
    );

 const posts = await api.post.getAllPosts.useInfiniteQuery(
      {
        limit: 5,
      },

      {
        getNextPageParam(lastPage) {
          return lastPage.nextCursor;
        },
      },
    );

and on the server

 getAllPosts: publicProcedure
    .input(
      z.object({
        limit: z.number().min(1).max(100).nullish(),
        cursor: z.string().nullish(),
      }),
    )
    .query(async ({ ctx, input }) => {
      const limit = input.limit ?? 10; // Max number of posts allowed per page
      const { cursor } = input;
      const posts = await ctx.db.post.findMany({
        include: { createdBy: true },
        take: limit + 1, // fetch one more post than needed
        cursor: cursor ? { id: cursor } : undefined,
        orderBy: { createdAt: "desc" },
      });
      let nextCursor: typeof cursor | undefined = undefined;
      const hasMore = posts.length > limit;
      if (hasMore) {
        // Remove the last item and use it as next cursor
        const nextPost = posts.pop()!;
        nextCursor = nextPost.id;
      }
      return { success: true, posts, nextCursor };
    }),

 getAllPosts: publicProcedure
    .input(
      z.object({
        limit: z.number().min(1).max(100).nullish(),
        cursor: z.string().nullish(),
      }),
    )
    .query(async ({ ctx, input }) => {
      const limit = input.limit ?? 10; // Max number of posts allowed per page
      const { cursor } = input;
      const posts = await ctx.db.post.findMany({
        include: { createdBy: true },
        take: limit + 1, // fetch one more post than needed
        cursor: cursor ? { id: cursor } : undefined,
        orderBy: { createdAt: "desc" },
      });
      let nextCursor: typeof cursor | undefined = undefined;
      const hasMore = posts.length > limit;
      if (hasMore) {
        // Remove the last item and use it as next cursor
        const nextPost = posts.pop()!;
        nextCursor = nextPost.id;
      }
      return { success: true, posts, nextCursor };
    }),

1 replies

TtRPC

•Created by Satou kuzuma on 9/25/2022 in #❓-help

What does the WebSocketHandler do?

I'm not sure what this is doing on the background.

1 replies

TtRPC

•Created by Satou kuzuma on 9/21/2022 in #❓-help

Websocket connection failed.

I'm following the websocket's example and it works fine as it is, however I changed some things and it seems i broke it. The problem is located in the getinitialprops function in _myapp.tsx. The thing is I don't want to use authentication and so I don't need to return session as pageprops in the getInitialProps function so I tried returning an empty object but it gives me an error saying failed to connect to 'ws://localhost:3001/'. I should return something as pageProps so the problem goes away but I don't know what and I couldn't find anything in nextjs documentation. I'm not sure if this is related to tRPC and I'm not smart enough to solve it myself so if you have some idea what it's happening I'd appreciate the help. Thank you!

14 replies