CodeWithAntonio•12mo ago

Reuseable query hook

Hi everyone 👋 Looking into some best practices for reusing mutations and queries. Primarily so I don't have to import from _generated/api every time I need a query/mutation, but also to reuse some states like loading or reuse some toast notifications on mutations. Saw this message as an example of what folks do: https://discord.com/channels/1019350475847499849/1151937233616646286/1151960378486566962 So I am sharing my simple example here, is this OK, is there any new practice you would recommend for creating reuseable queries? 🙂

import { useQuery } from "convex/react";

import { api } from "@/convex/_generated/api";

interface UseQueryBoardsProps {
  orgId: string;
};

export const useQueryBoards = ({
  orgId,
}: UseQueryBoardsProps) => {
  const data = useQuery(api.boards.getBoards, { orgId });

  const loading = data === undefined;

  return {
    data,
    loading,
  };
};

import { useQuery } from "convex/react";

import { api } from "@/convex/_generated/api";

interface UseQueryBoardsProps {
  orgId: string;
};

export const useQueryBoards = ({
  orgId,
}: UseQueryBoardsProps) => {
  const data = useQuery(api.boards.getBoards, { orgId });

  const loading = data === undefined;

  return {
    data,
    loading,
  };
};

3 Replies

ian•12mo ago

One such example is in this post: https://stack.convex.dev/help-my-app-is-overreacting

Help, my app is overreacting!

Reactive backends like Convex make building live-updating apps a cinch, but default behavior might be too reactive for some use cases. Not to worry! L...

ian•12mo ago

And I have some custom hooks I’m working on in convex-helpers for a query that passes up a session id as an argument. There’s an older post linking to older code on session wrappers too For wrapping functions server-side, I have made that much easier with the customFunction stuff but haven’t made a client-side version- mostly to make the types easier. When making it generic, there’s some typescript nuance

winsoroaks•12mo ago

is this for Miro 😛

Reuseable query hook

Did you find this page helpful?