sir, can you please explain, how to add Tanstack Query in this code:

// React Router v7
import type { Route } from "./+types/home";
import { prisma } from "../db";

export function meta({}: Route.MetaArgs) {
  return [
    { title: "New React Router App" },
    { name: "description", content: "Welcome to React Router!" },
  ];
}

export const loader = async ({ params }: Route.LoaderArgs) => {
  return await prisma.user.findFirst()
}

export function Home({ loaderData }: Route.ComponentProps) {
  const user = loaderData;
  return (
    <>
      <div className="flex flex-col justify-center items-center min-h-screen">
        <p>User name: {user?.name}</p>
        <p>User email: {user?.email}</p>
      </div>
    </>
  );
}

Here the loader is server fucntion, all works great. But without caching/revalidate on page reload, etc