How to use useLoading() to get the old loading from useGraphql()?

[Jogalso]

Hello

I am updating my code to the latest versions of your library.

With the old useGraphql() hook, I was able to paging a large collection of data to represent it in graphs. So the graph kept filling up with more data as it was loaded.

With the new version of exports. I do not get the same result, because I was based on loading. Now without this property in a hook, I'm lost.

I understand that useLoading() is to obtain the same loading value that was obtained before with useGraphql() ?

If so, I try to import it but I get an error that ""graphql-react/useLoading" is not exported by graphql-react.

I don't know what to do, because I've seen the closed pagination issue where in an example you use useWhimsyAPI(), which returns a useGraphql style object, I understand that it does the same thing but with the new exports. That's why I try to replicate useGraphql() to try to give me the loading value from useLoading() but so far without much success.

Just this pagination cost me little, after better understanding your library. About this a couple of years ago when I wrote you an email a bit desperate, because I couldn't figure it out to make a mutation. On this occasion, I see normal queries and mutations as easy, but I can't do it to make a progressive automatic pagination.

I've also been looking at useWaterFallLoad(), which I understand is to do progressive loading on different requests to optimize the loading and rendering processes. But I can't fully understand it, and it only shows false in the isWaterfallLoading variable whatever I do. I understand that my graphql data schema is not prepared for something like this.

Thank you very much for your effort The new structure of the library looks very interesting Greetings from Spain

Jose Galbis

[Jogalso]

Hello again!

It certainly feels good to talk to you because like last time, I see new things that I didn't see, even before you answer me.

I have managed to make a series of queries with limit and skip.

On the one hand I have managed to use useLoading(), although with some problems. I can't get those queries to be saved with different keys. (My intention was to save them separately, query 1, query 2, query 3...) But if I save it in the same key, I check that it doesn't do many simultaneous queries because it saturates the network. And with a little modification of my schemas I get how many elements I have to load, and when I get to the last one I stop performing queries.

But the problem that has nothing to do with this, is that it doesn't let me import useLoading() and useCache() directly from "graphql-react". The error tells me to check the package.json of the "graphql-react" library to check the exports. I have reviewed it and they are included. To get out of trouble I have copied them in my hooks and that is how they work. I don't know if I'm the only one with this error. But I have node and all the libraries updated to the maximum.

[jaydenseric]

Hi :)

These comments are a little tricky to answer because there seems to be quite a few questions going on. But perhaps your main problem about not being able to import the hooks is the easiest to start with. What exactly is the import code you are trying to use?

Imports need to be like this:

import useLoadingEntry from "graphql-react/useLoadingEntry.mjs";

You must use deep imports, and you must use the .mjs in the path.

You probably don't need to use the useLoading hook that gets the whole store of all loading from context; most likely you are interested in useLoadingEntry to get the loading status of a particular cache key.

[Jogalso]

I'm sorry I went on too long, I should have been more specific.

True, when I imported I didn't use ".mjs", I didn't really use it in useLoading() or useCache() because I imported it wrong automatically.

Anyway you are right that I didn't need to extract all the loading from the context. In the end, useLoadingEntry() was enough for me. Certainly the type of loadingCacheValues is not boolean but it is either the action or it is undefined. Therefore it is easily adaptable to boolean.

Thanks a lot!

[jaydenseric]

Glad you were able to progress 🙌