react-apollo-hooks
react-apollo-hooks copied to clipboard
[wip] fix(useQuery): use `setOptions` for updating query
Thanks to that previous value of data
is shown while loading new one and networkStatus
should have a correct value in that case
BREAKING CHANGE: previous value of data
is shown while loading new one
- [ ] fix suspense mode
- [ ] add tests
Closes #117 Closes #121 Closes #129
WIP - unfortunately suspense mode doesn't work with that version
Thanks so much for this!!
I'm super excited about showing stale data while refreshing.
@trojanowski can we do something to help you with this PR? I could add tests if you agree
@trojanowski can we do something to help you with this PR? I could add tests if you agree
@FezVrasta it would be nice, thanks. Right now the suspense mode is also broken - I'll try to fix (in the next week I think).
@trojanowski I tried to add a test for #117 but I can still reproduce the bug.
You can try my branch here
@FezVrasta yes, it seems this PR requires further work. We should implement merging previous data with the last one. react-apollo implements it that way: https://github.com/apollographql/react-apollo/blob/master/src/Query.tsx#L474. Strange that your codesandbox demo from #117 worked for me with this PR in the current form.
@trojanowski is this still on your radar? I'm sorry for being so pushy but I would really love to use this project in production :-(
@FezVrasta in case it helps, we're currently working around the data
reset issue with the following:
import { useRef, useEffect } from 'react';
import { useQuery as useReactApolloHooksQuery } from 'react-apollo-hooks';
export function useQuery(query, options) {
const prevDataRef = useRef();
const { loading, error, data } = useReactApolloHooksQuery(query, options);
const hasData = data && Object.keys(data).length;
const activeData = hasData ? data : prevDataRef.current;
useEffect(() => {
if (hasData) {
prevDataRef.current = data;
}
});
return {
data: activeData,
loading,
error,
};
}
@jjenzz i had thought that updating a ref doesn't trigger a rerender. is the idea here that something else (like error
) updating triggers the rerender, then you just use the new value of prevDataRef.current
?
(this gets deeper into my hooks confusion, so apologies if that doesn't totally make sense)
@zhammer you are correct that a ref doesn’t trigger a rerender. The code above keeps a reference to successfully retrieved data so that if the data becomes empty in a future render it can return that cached data instead. Does that help?
@trojanowski any idea if we can anyhow go around the Suspense issue? Any idea why it doesn't work on this PR?