import useAppStateAwareFocusEffect from 'react-navigation-app-state-aware-focus-effect';

const req = fetch('https://example.com/dummy.json');

// make sure you memoize the effect
useAppStateAwareFocusEffect(
  useCallback(() => {
    req();
  }, [])
);

import React, { useCallback } from 'react';
import { View, Text } from 'react-native';
import { gql, useQuery } from '@apollo/client';
import useAppStateAwareFocusEffect from 'react-navigation-app-state-aware-focus-effect';

const GET_DOGS = gql`
  query GetDogs {
    dogs {
      id
      breed
    }
  }
`;

const Dogs = () => {
  const { loading, error, data, refetch } = useQuery(GET_DOGS, {
    fetchPolicy: 'cache-and-network',
  });

  useAppStateAwareFocusEffect(
    useCallback(() => {
      refetch();
    }, [])
  );

  if (loading) return 'Loading...';
  if (error) return `Error! ${error.message}`;

  return (
    <View>
      {data.dogs.map(({ id, breed }) => (
        <Text key={id}>{breed}</Text>
      ))}
    </View>
  );
};