1import { FragmentOf, graphql, readFragment } from './graphql';
2
3export const Fields = { Pokemon: graphql(`
4 fragment Pok on Pokemon {
5 resistant
6 types
7 }`)
8}
9
10export const PokemonFields = graphql(/* GraphQL */`
11 fragment pokemonFields on Pokemon {
12 name
13 weight {
14 minimum
15 }
16 }
17`);
18
19interface Props {
20 data: (FragmentOf<typeof PokemonFields> & FragmentOf<typeof Fields.Pokemon>) | null;
21}
22
23export const Pokemon = ({ data }: Props) => {
24 const pokemon = readFragment(PokemonFields, data);
25 const resistant = readFragment(Fields.Pokemon, data);
26 if (!pokemon || !resistant) {
27 return null;
28 }
29
30 return (
31 <li>
32 {pokemon.name}
33 {resistant.resistant}
34 </li>
35 );
36};