americanexpress / americanexpress/fetchye

First render after key changes has isLoading == false

Open
#81 2 comments 0 reactions 0 assignees View on GitHub
stale-issue
Dominant language
JavaScript
Stars
46
Forks
27
PR merge metrics
No merged PRs in 30d

Description

# 🐞 Bug Report

## Describe the bug

On the initial render of a component using fetchye, the returned values are:
```
{data: undefined, error: undefined, isLoading: true}
```
Then when the data finishes loading, it changes to:
```
{data: {…}, error: undefined, isLoading: false}
```
When the fetchye key (for instance the body of the request) changes, you would expect the state to change back to loading. But instead the first render is this:
```
{data: undefined, error: undefined, isLoading: false}
```
This makes it difficult to write any code that is dependent on `isLoading` to render a loading indicator.

## To Reproduce

Example code:
```
const [id, setId] = useState(1);
useEffect(() => {
setTimeout(() => setId(2), 1000);
});

const { data, error, isLoading } = useFetchye(id);
console.log({ data, error, isLoading });
return

test
;
```
Prints this to console:
```
{data: undefined, error: undefined, isLoading: true}
{data: undefined, error: undefined, isLoading: true}
{data: {…}, error: undefined, isLoading: false}
{data: undefined, error: undefined, isLoading: false} <====
{data: undefined, error: undefined, isLoading: true}
{data: undefined, error: undefined, isLoading: true}
{data: {…}, error: undefined, isLoading: false}
{data: {…}, error: undefined, isLoading: false}
```

## Expected behavior

`isLoading` should be true after the key changes.

Contributor guide

Open the contributing guide

Research direction

Start at the useFetchye entry point and reproduce the reported key-change sequence from the example. Trace the state returned on the first render after the key changes; done means isLoading is true whenever a new key begins loading, with the existing initial-load behavior preserved.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript, react
Domain
frontend
Issue type
Bug
Difficulty
3/5
Estimated time
1-2 days
Activity status
Stale
Clarity
Clearly specified
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.