1import React from 'react';
2import { Client, fetchExchange, Provider } from 'urql';
3import { retryExchange } from '@urql/exchange-retry';
4
5import Color from './Color';
6
7const client = new Client({
8 url: 'https://trygql.formidable.dev/graphql/intermittent-colors',
9 exchanges: [
10 retryExchange({
11 maxNumberAttempts: 10,
12 maxDelayMs: 500,
13 retryIf: error => {
14 // NOTE: With this deemo schema we have a specific random error to look out for:
15 return (
16 error.graphQLErrors.some(x => x.extensions?.code === 'NO_SOUP') ||
17 !!error.networkError
18 );
19 },
20 }),
21 fetchExchange,
22 ],
23});
24
25function App() {
26 return (
27 <Provider value={client}>
28 <Color />
29 </Provider>
30 );
31}
32
33export default App;