americanexpress / americanexpress/fetchye
Changes to key returning previous keys data
- Dominant language
- JavaScript
- Stars
- 46
- Forks
- 27
- PR merge metrics
- No merged PRs in 30d
Description
# 🐞 Bug Report
## Describe the bug
When changing the key of useFetchye, the first return of the function still returns the data of the previous run
## To Reproduce
Steps to reproduce the behavior, please provide code snippets or a repository:
I used my [fetchye-test](https://github.com/DyBev/fetchye-pr99-test) repository on the fix/test-branch. running the pocketbase server locally and using the AppWithIdChange page on http://localhost:5173/id-change
1. clone repo
2. install dependencies
3. Start the backend:
a. ./database/pocketbase serve (Linux binary)
b. ./database/pocketbase_mac serve (mac binary)
c. admin login admin@mail.com password
4. start the frontend:
a. for dev build:
- npm run dev
b. for production build:
- npm run build
- npm run preview
5. navigate to
a. http://localhost:5173/id-change for dev
b. http://localhost:4173/id-change for production preview
6. watch logs return data of the previous key
## Expected behavior
When the key changes the data returned should be relevent to the key
## Implementation details
```js
...
const id1 = 'n1kvy882szoh0v9'
const id2 = 'bl1xrv6z6rabdv3'
function App() {
...
const [id, setId] = useState(id1);
const { data: pocketdata, error: pocketerror, isLoading: pocketisLoading } = useFetchye(
`http://127.0.0.1:8090/api/collections/testing/records/${id}`, {}, customFethcer
);
console.log({ id, location: 'AppWithIdChange', data: pocketdata, error: pocketerror, isLoading: pocketisLoading });
useEffect(() => {
setTimeout(() => {
setId(id2)
}, 4000);
}, []);
...
```
I'm using a custom fetcher to add a 2s delay to the fetch call to test the loading state.
## Screenshots
Before key change:
After key change:
## System information
- OS: macOS
- Browser (not tested on other browse yet): firefox
- Version of fetchye: 1.7.1
- Node version: 23.6.0
## Additional context
Issue found whilst I was testing my fix for my draft PR.
Contributor guide
Research direction
Start with the useFetchye call shown in the issue and reproduce the behavior using the linked fetchye-test repository, its AppWithIdChange page, and the delayed custom fetcher. Observe the data and loading logs before and after changing from id1 to id2. Done means the first returned data after the key change corresponds to the new key rather than the previous run.
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
- Mostly clear
- Newbie friendliness
- 38/100