React Native GraphQL Apollo Boost in FlatList

gistfile1.js

import React from 'react';
import { Text, View, SafeAreaView, FlatList } from 'react-native';
import ApolloClient from "apollo-boost";
import gql from "graphql-tag";
import { ApolloProvider } from "react-apollo";
import { Query } from "react-apollo";

const client = new ApolloClient({
  uri: "https://www.fedry.net/graphql"
});

const App = () => (
  <ApolloProvider client={client}>
        <Text>My first Apollo app ??</Text>
        <ExchangeRates />
  </ApolloProvider>
);

export default App;

const ExchangeRates = () => (
  <Query
    query={gql`
{
  posts(first: 6) {
    edges {
      node {
        title
        id
      }
    }
  }
}
`}
  >
    {({ loading, error, data }) => {
      if (loading) return <Text>Loading...</Text>;
      if (error) return <Text>Error </Text>;
        
        return <FlatList
        data={data.posts.edges}
        renderItem={({item}) => <Text>{`${item.node.title}`}</Text>}
        keyExtractor={(item, index) => index.toString()}
        
/>

    }}
  </Query>
);