ibrahimyaacob
ibrahimyaacob2mo ago

convex helper: How to combine cache query with richer useQuery and usePaginatedQuery

i need to: 1. cache usePaginatedQuery 2. cache richer usePaginated query i dont see any docs mentioning how to set this up https://www.npmjs.com/package/convex-helpers
npm
convex-helpers
A collection of useful code to complement the official convex package.. Latest version: 0.1.95, last published: 2 days ago. Start using convex-helpers in your project by running npm i convex-helpers. There are 16 other projects in the npm registry using convex-helpers.
2 Replies
Convex Bot
Convex Bot2mo ago
Thanks for posting in <#1088161997662724167>. Reminder: If you have a Convex Pro account, use the Convex Dashboard to file support tickets. - Provide context: What are you trying to achieve, what is the end-user interaction, what are you seeing? (full error message, command output, etc.) - Use search.convex.dev to search Docs, Stack, and Discord all at once. - Additionally, you can post your questions in the Convex Community's <#1228095053885476985> channel to receive a response from AI. - Avoid tagging staff unless specifically instructed. Thank you!
erquhart
erquhart2mo ago
The richer useQuery takes in useQueries, which the cache helper also exports along with usePaginatedQuery, so it seems like it would just work:
import { useQueries } from "convex-helpers/react/cache";
// For Next.js, import from "convex-helpers/react/cache/hooks"; instead

import { makeUseQueryWithStatus } from "convex-helpers/react";

// Do this once somewhere, name it whatever you want.
export const useQueryWithStatus = makeUseQueryWithStatus(useQueries);

const { status, data, error, isSuccess, isPending, isError } =
useQueryWithStatus(api.foo.bar, { myArg: 123 });
import { useQueries } from "convex-helpers/react/cache";
// For Next.js, import from "convex-helpers/react/cache/hooks"; instead

import { makeUseQueryWithStatus } from "convex-helpers/react";

// Do this once somewhere, name it whatever you want.
export const useQueryWithStatus = makeUseQueryWithStatus(useQueries);

const { status, data, error, isSuccess, isPending, isError } =
useQueryWithStatus(api.foo.bar, { myArg: 123 });
Disclaimer: haven't actually tried it

Did you find this page helpful?