refactor: centralize frontend auth query gating

src/shared/api/authenticated-query.ts

@@ -0,0 +1,34 @@
+import {
+	type QueryKey,
+	type UseQueryOptions,
+	type UseQueryResult,
+	useQuery,
+} from "@tanstack/react-query";
+import { useSyncExternalStore } from "react";
+import {
+	getAuthenticatedSessionSnapshot,
+	subscribeAuthenticatedSession,
+} from "./client";
+
+export function useAuthenticatedQuery<
+	TQueryFnData = unknown,
+	TError = Error,
+	TData = TQueryFnData,
+	TQueryKey extends QueryKey = QueryKey,
+>(
+	options: UseQueryOptions<TQueryFnData, TError, TData, TQueryKey>,
+): UseQueryResult<TData, TError> {
+	const hasSession = useSyncExternalStore(
+		subscribeAuthenticatedSession,
+		getAuthenticatedSessionSnapshot,
+		getAuthenticatedSessionSnapshot,
+	);
+	const enabled = options.enabled;
+
+	return useQuery({
+		...options,
+		enabled: (query) =>
+			hasSession &&
+			(typeof enabled === "function" ? enabled(query) : (enabled ?? true)),
+	});
+}