vadimdemedes / draqula

🧛 GraphQL client for minimalistic React apps

Home Page:https://draqulajs.com

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Remove `isLoading` from `useQuery`

vadimdemedes opened this issue · comments

Since majority (if not all) use cases check for isLoading and error before rendering data, it would be convenient to only check isLoaded variable.

const {data, isLoaded, isLoading, error} = useQuery()

<>
  {isLoaded && <Content/>}
  {isLoading && <Spinner/>}
  {error && <Error/>}
</>

Another idea I'd like to borrow from SWR is absence of isLoading. It just makes sense, we can rely on data ? 'loaded' : 'not loaded' check, because data will never be falsy if query finished loading.

After merging this, I realized it could create more friction than solve problems.

First, when I will add skip option to useQuery, there will be no way to differentiate between "is this query loading" and "is this query skipped", because for both cases data and error will be undefined.

Second, because data is undefined when error occurs, UI will show loading spinner in the following code:

{!data && <Spinner/>}
{error && <ErrorMessage/>}
{data && <Data/>}

So now for every query you'll have to do !data && !error to correctly detect loading state.

I'm going to revert this change and open another issue to still add isLoaded as planned initially.