kitten.sh
1import { useQuery } from 'urql';
2import { useMemo } from 'react';
3import { graphql } from './gql';
4
5const PokemonsQuery = graphql(
6 `
7 query Pok {
8 pokemons {
9 name
10 maxCP
11 maxHP
12 fleeRate
13 }
14 }
15 `
16);
17
18const Pokemons = () => {
19 const [result] = useQuery({
20 query: PokemonsQuery,
21 });
22
23 const results = useMemo(() => {
24 if (!result.data?.pokemons) return [];
25 return (
26 result.data.pokemons
27 .filter(i => i?.name === 'Pikachu')
28 .map(p => ({
29 x: p?.maxCP,
30 y: p?.maxHP,
31 })) ?? []
32 );
33 }, [result.data?.pokemons]);
34
35 // @ts-ignore
36 return results;
37};