1'use client';
2
3import { useMemo } from 'react';
4import {
5 UrqlProvider,
6 ssrExchange,
7 cacheExchange,
8 fetchExchange,
9 createClient,
10} from '@urql/next';
11
12export default function Layout({ children }: React.PropsWithChildren) {
13 const [client, ssr] = useMemo(() => {
14 const ssr = ssrExchange({
15 isClient: typeof window !== 'undefined',
16 });
17 const client = createClient({
18 url: 'https://graphql-pokeapi.graphcdn.app/',
19 exchanges: [cacheExchange, ssr, fetchExchange],
20 suspense: true,
21 });
22
23 return [client, ssr];
24 }, []);
25
26 return (
27 <UrqlProvider client={client} ssr={ssr}>
28 {children}
29 </UrqlProvider>
30 );
31}