isLoading only works on the first fetch (solution in comments)

[mikiekwoods]

New Bug Report

Checklist

• [x] I am not disclosing a vulnerability.
• [x] I have searched through existing issues and the Moralis Forum.
• [x] I can reproduce the issue with the latest react-moralis release, latest SDK release, and my server is updated to the latest version.

Issue Description

Steps + code to reproduce

Actual Outcome

isLoading only can be true on first fetch.

Expected Outcome

isLoading should be true on every fetch where the data is empty...including empty array

Someone else posted this in Novemeber, and I ran into the issue myself: https://forum.moralis.io/t/bug-in-isloading-when-using-usemoraliscloudfunction-in-react/4453

I HAVE PLACED A SOLUTION IN MY THREAD! https://forum.moralis.io/t/isloading-is-always-false-on-usemoralisquery/9549

The isLoading state conditional statement needs to allow the empty array possibility, where as now it only can be true if data is null.

I didn't have time to test enough to put in a pull request.

[ErnoW]

You can use isFetching for those use-cases? isLoading will indicate when you have no data and are fetching for data isFetching will indicate every time when you're fetching for data

Does this help? Or otherwise I might misunderstand you.

[mikiekwoods]

The problem with fetch is that it happens every single time you load data. For example, if have a list, I might want to show a loadbar or skeleton the first time it loads. But then when it gets updated, I don't need to hide what I loaded. But sometimes the first load is an empty array, in which case isLoading should be true again.

But either way the way it is coded now is wrong.

const isLoading = isFetching && data == null && (Array.isArray(data) ? data.length === 0 : true); //This line can never cause the statement to be true.

[mikiekwoods]

What I mean is this line will never cause it to be true (Array.isArray(data) ? data.length === 0 : true); Because if it is an array, this will always be false data == null

[mikiekwoods]

In other words, if you don't agree with my use case, you should get rid of this line (Array.isArray(data) ? data.length === 0 : true);

[ErnoW]

Ah, thanks for clarifying, I see now what you mean. It should check for "emptynesss", so should be a null check OR an empty array check. Will fix it

[ErnoW]

Fixed in https://github.com/MoralisWeb3/react-moralis/pull/200

[ErnoW]

Released in 1.3.1