Brainlaq Comments

Brainlaq

•Created by Brainlaq on 2/20/2025 in #❓-help

Early return for certain input parameter for queryFn

for anyone interested. For now i am using this

import { trpc } from "@/lib/trpc/client";
import { getQueryKey } from "@trpc/react-query";
import { useParams } from "next/navigation";

export const useChatHistoryOptions = () => {
  const utils = trpc.useUtils();
  const { id } = useParams<{ id: string | undefined }>();

  const queryKey = getQueryKey(trpc.getChatHistory, id);

  return {
    queryKey,
    queryFn: async () => {
      if (!id) return [];

      const chatHistory = await utils.getChatHistory.fetch(id);

      return chatHistory;
    },
  };
};

import { trpc } from "@/lib/trpc/client";
import { getQueryKey } from "@trpc/react-query";
import { useParams } from "next/navigation";

export const useChatHistoryOptions = () => {
  const utils = trpc.useUtils();
  const { id } = useParams<{ id: string | undefined }>();

  const queryKey = getQueryKey(trpc.getChatHistory, id);

  return {
    queryKey,
    queryFn: async () => {
      if (!id) return [];

      const chatHistory = await utils.getChatHistory.fetch(id);

      return chatHistory;
    },
  };
};

// inside a component
  const chatHistoryOptions = useChatHistoryOptions();
  const chatHistory = useSuspenseQuery(chatHistoryOptions); // imported from react query itself

// inside a component
  const chatHistoryOptions = useChatHistoryOptions();
  const chatHistory = useSuspenseQuery(chatHistoryOptions); // imported from react query itself

It does feel wrong tho.

2 replies