Early return for certain input parameter for queryFn

import { useSuspenseQuery } from "@tanstack/react-query";
import { useParams } from "next/navigation";

type ChatMessage = { text: string; userName: string };

type ChatHistory = Array<ChatMessage>;

export const useChatHistory = () => {
  const { id } = useParams<{ id: string | undefined }>();

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

      const result = await fetch("/api/chat-history/" + id);

      const data = await result.json();

      return data as ChatHistory;
    },
  });
};

import { trpc } from "@/lib/trpc/client";
import { useParams } from "next/navigation";

export const useChatHistory = () => {
  const { id } = useParams<{ id: string | undefined }>();

  if (!id) return [];
  const [chatHistory] = trpc.getChatHistory.useSuspenseQuery(id);

  return chatHistory;
};