Sometimes Apollo Client decides to fetch the data, sometimes it gives me undefined and it stays so - even though the query fully works on the backend and in the debugger I see the query is launched. Why? No errors in the console, all good.
EDIT: If I enable fast refresh and I change something in the component it will magically fetch the data, but almost never fetches the data on the first app render.
I use React-Native.
const TEST = gql`
query NotesFetch {
NotesFetch {
notes {
description
id
status
images {
filename
mimetype
encoding
uri
}
timestamp
username
}
}
}
`;
const { loading, error, data } = useQuery(TEST);
console.log(data) - sometimes okay, sometimes it stays undefined and doesn't change
Component:
<View style={styles.cards}>
{data && data.NotesFetch.notes &&
data.NotesFetch.notes.map((p: any) => <NotesCard archive={true} key={p.id} {...p} />
)
}
</View>
CodePudding user response:
The problem comes directly from the Apollo Client library and how it handles React Native's observables - in short. Update it to the newest version as it was fixed on 16th May 2022 update - 3.6.4.
Provide @apollo/client//*.cjs.native.js versions of every @apollo/client//*.cjs bundle (including dependencies ts-invariant and zen-observable-ts) to help React Native's Metro bundler automatically resolve CommonJS entry point modules. These changes should render unnecessary the advice we gave in the v3.5.4 section below about metro.config.js. @benjamn in #9716