chore: codify React component style

src/shared/api/authenticated-query.test.tsx

@@ -2,7 +2,7 @@ import { MantineProvider } from "@mantine/core";
 import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
 import { renderHook, waitFor } from "@testing-library/react";
 import { HttpResponse, http } from "msw";
-import type { ReactNode } from "react";
+import type { FC, PropsWithChildren } from "react";
 import { afterEach, describe, expect, it, vi } from "vitest";
 import { server } from "@/test/server";
 import { useAuthenticatedQuery } from "./authenticated-query";
@@ -10,11 +10,17 @@ import { apiQueryClient, configureAuthClient } from "./client";
 
 function createWrapper() {
 	const client = new QueryClient();
-	return ({ children }: { children: ReactNode }) => (
-		<MantineProvider>
-			<QueryClientProvider client={client}>{children}</QueryClientProvider>
-		</MantineProvider>
-	);
+	const TestWrapper: FC<PropsWithChildren> = (props) => {
+		const { children } = props;
+
+		return (
+			<MantineProvider>
+				<QueryClientProvider client={client}>{children}</QueryClientProvider>
+			</MantineProvider>
+		);
+	};
+
+	return TestWrapper;
 }
 
 describe("useAuthenticatedQuery", () => {