Joe•2y ago

usePaginatedQuery in next.js api route -- cannot read properties of null (reading 'useMemo')

Hello, I'm trying to test out paginated queries in a next.js api route, but I'm running into an error using an example function. Is there any advice for how to debug or is this not an appropriate use of usePaginatedQuery, if so, is there a way to use pagination in an api route? Thanks!

4 Replies

ballingt•2y ago

@Joe ah yeah, using usePaginatedQuery on the server (in an API route) won't work. That hook only works inside React components. What's your use case for a paginated query in an API route? You can use paginated queries from an API route, but I'd be curious about your motivation.

JoeOP•2y ago

Ah ok -- how would I go about that? Re: motivation: basically I need to get a bunch of data from a table. The problem is if I do .collect() that's greater than 8 MB, so I think I need to use pagination ? I tried doing that directly with the Python client for convex, but I failed, so I was trying to figure out a workaround. I figured maybe it's better to have some sort of NextJS server that could handle ingesting / sharing data from convex and then just use python (interacting with the NextJS server to get data) for more complicated calculations.

ballingt•2y ago

Got it, yeah pagination sounds like the way to go here. There's no helper provided to do this from Python yet, in either JavaScript or Python it just requires a loop. Let me put an example together. Oops! I posted a JavaScript example, but it's using new syntax that doesn't work yet. Just a minute. Here's a JavaScript pagination example as you'd use it in an API route.

const { ConvexHttpClient } = require("convex/browser");

const url = "https://lovely-spoonbill-470.convex.cloud";
const client = new ConvexHttpClient(url);

async function getAllMessages() {
  let continueCursor = undefined;
  let isDone = false;

  const results = [];

  while (!isDone) {
    ({ continueCursor, isDone, page } = await client.query("listMessages")({
      numItems: 5,
      cursor: continueCursor,
    }));
    console.log("got", page.length);
    results.push(...page);
  }

  console.log(results);
}

getAllMessages();

const { ConvexHttpClient } = require("convex/browser");

const url = "https://lovely-spoonbill-470.convex.cloud";
const client = new ConvexHttpClient(url);

async function getAllMessages() {
  let continueCursor = undefined;
  let isDone = false;

  const results = [];

  while (!isDone) {
    ({ continueCursor, isDone, page } = await client.query("listMessages")({
      numItems: 5,
      cursor: continueCursor,
    }));
    console.log("got", page.length);
    results.push(...page);
  }

  console.log(results);
}

getAllMessages();

and here's a Python example

import convex
client = convex.ConvexClient('https://lovely-spoonbill-470.convex.cloud')

done = False
cursor = None
data = []

while not done:
    result = client.query('listMessages', {"numItems": 5, "cursor": cursor})
    cursor = result['continueCursor']
    done = result["isDone"]
    data.extend(result['page'])
    print('got', len(result['page']), 'results')

# OUT: got 5 results
# OUT: got 5 results
# OUT: got 5 results
# OUT: got 4 results
print('collected', len(data), 'results')
# OUT: collected 19 results

import convex
client = convex.ConvexClient('https://lovely-spoonbill-470.convex.cloud')

done = False
cursor = None
data = []

while not done:
    result = client.query('listMessages', {"numItems": 5, "cursor": cursor})
    cursor = result['continueCursor']
    done = result["isDone"]
    data.extend(result['page'])
    print('got', len(result['page']), 'results')

# OUT: got 5 results
# OUT: got 5 results
# OUT: got 5 results
# OUT: got 4 results
print('collected', len(data), 'results')
# OUT: collected 19 results

JoeOP•2y ago

ah thanks!

usePaginatedQuery in next.js api route -- cannot read properties of null (reading 'useMemo')

Did you find this page helpful?