react query ftw

components/providers/ReactQueryProvider.tsx

@@ -0,0 +1,22 @@
+"use client";
+
+import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
+import { ReactQueryDevtools } from "@tanstack/react-query-devtools";
+import { useState } from "react";
+
+export function ReactQueryProvider({
+	children
+}: {
+	children: React.ReactNode;
+}) {
+	const [queryClient] = useState(() => new QueryClient());
+
+	return (
+		<QueryClientProvider client={queryClient}>
+			{children}
+			{process.env.NODE_ENV === "development" && (
+				<ReactQueryDevtools initialIsOpen={false} />
+			)}
+		</QueryClientProvider>
+	);
+}