kitten.sh
1import { createClient, useQuery } from 'urql';
2import { graphql } from './gql';
3import { Pokemon } from './Pokemon';
4
5const PokemonQuery = graphql(`
6 query Po($id: ID!) {
7 pokemon(id: $id) {
8 id
9 fleeRate
10 ...pokemonFields
11 attacks {
12 special {
13 name
14 damage
15 }
16 }
17 weight {
18 minimum
19 maximum
20 }
21 name
22 __typename
23 }
24 }
25`);
26
27const Pokemons = () => {
28 const [result] = useQuery({
29 query: PokemonQuery,
30 variables: { id: '' }
31 });
32
33 // Works
34 console.log(result.data?.pokemon?.attacks && result.data?.pokemon?.attacks.special && result.data?.pokemon?.attacks.special[0] && result.data?.pokemon?.attacks.special[0].name)
35
36 // Works
37 const { fleeRate } = result.data?.pokemon || {};
38 console.log(fleeRate)
39 // Works
40 const po = result.data?.pokemon;
41 // @ts-expect-error
42 const { pokemon: { weight: { minimum } } } = result.data || {};
43 console.log(po?.name, minimum)
44
45 // Works
46 const { pokemon } = result.data || {};
47 console.log(pokemon?.weight?.maximum)
48
49 return <Pokemon data={result.data?.pokemon} />;
50}
51