[wip] fix(useQuery): use setOptions for updating query

[trojanowski]

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

[trojanowski]

WIP - unfortunately suspense mode doesn't work with that version

[FezVrasta]

Thanks so much for this!!

[fbartho]

I'm super excited about showing stale data while refreshing.

[FezVrasta]

@trojanowski can we do something to help you with this PR? I could add tests if you agree

[trojanowski]

@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).

[FezVrasta]

@trojanowski I tried to add a test for #117 but I can still reproduce the bug.

You can try my branch here

[trojanowski]

@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.

[FezVrasta]

@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 :-(

[jjenzz]

@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,
	};
}

[zhammer]

@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)

[jjenzz]

@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?

[jtomaszewski]

@trojanowski any idea if we can anyhow go around the Suspense issue? Any idea why it doesn't work on this PR?