Xata•4mo ago

how to show all results in react app?

im trying const response = await axios.post( 'https://alexis-gaitan-s-workspace-r0aiag.us-east-1.xata.sh/db/dbsnetworkdb:main/tables/usuarios/query', but its showing only max 1000 results, but i have like 10000

4 Replies

agaitan026OP•4mo ago

i know it have a limit of 1000 const response = await axios.post( 'https://alexis-gaitan-s-workspace-r0aiag.us-east-1.xata.sh/db/dbsnetworkdb:main/tables/usuarios/query', {"columns":["xata_id","nombre"],"page":{"size":1000}}, for example but how i do with my react app to paginate correctly using xata?

agaitan026OP•4mo ago

https://pastebin.com/s9d7Vbe4

Pastebin

import React, { useEffect, useState } from 'react';import axios fro...

Pastebin.com is the number one paste tool since 2002. Pastebin is a website where you can store text online for a set period of time.

agaitan026OP•4mo ago

this is my code

kostas•4mo ago

The best way to go so that you're not limited no matter how many results there are, is using cursor-based pagination: https://xata.io/docs/sdk/get#cursor-based-pagination The response contains a "meta" section with a "more" indicator telling you whether there is another page of results, and a "cursor" which is a pointer to the next page of results.

  "meta": {
    "page": {
      "cursor": "VMoxDsIwDAXQnWP8OUPSASFfAnZUoZDWtSEEyTFT1bujion9PdKK_",
      "more": true
    }
  }

  "meta": {
    "page": {
      "cursor": "VMoxDsIwDAXQnWP8OUPSASFfAnZUoZDWtSEEyTFT1bujion9PdKK_",
      "more": true
    }
  }

You'll need to wite a loop that reads the response, checks if "meta.page.more" is true and if so, gets the meta.page.cursor and uses it in the next request in "page.after". You can see an example with Python using the requests library to the rest API here: https://github.com/xataio/xtools/blob/main/xreplay/threads.py#L43 That script is a bit complicated but it all boils down to:

# query_payload={...my query in json ...}

more = True
while more == True:
  raw_query_response, errors = post(...,payload=query_payload) # this is equivalent to your axios.post
  query_response = raw_query_response.json()
  # ... do query processing stuff here
  if query_response["meta"]["page"]["more"] == True:
    # add page.after to the next query payload that will be send out by this loop
    query_payload["page"]["after"] = query_response["meta"]["page"]["cursor"]
  else:
    more = False

# query_payload={...my query in json ...}

more = True
while more == True:
  raw_query_response, errors = post(...,payload=query_payload) # this is equivalent to your axios.post
  query_response = raw_query_response.json()
  # ... do query processing stuff here
  if query_response["meta"]["page"]["more"] == True:
    # add page.after to the next query payload that will be send out by this loop
    query_payload["page"]["after"] = query_response["meta"]["page"]["cursor"]
  else:
    more = False

Similar logic would need be added in your code.

Gaming

Programming

how to show all results in react app?