OpenNeo/impress-2020
OpenNeo/impress-2020
1
0
Fork 0
Code Pull requests Activity

Oops, I broke valids!

Browse source 
Ah right, React state batching doesn't always work how I expect it to. The separate state caused the hook to return and cache `{loading: false, error: null, data: null}`, and then on a _later_ tick the data value showed up, but only _after_ the response was already cached!

This broken a bunch of species/color picker stuff, now it's fixed!
This commit is contained in:
Emi Matchu 2021-06-11 08:31:01 -07:00
parent eaa4fbb575
commit ddd562b672
1 changed files with 8 additions and 10 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

18
src/app/util.js
View file

@ -248,9 +248,11 @@ export function useFetch(url, { responseType, skip, ...fetchOptions }) {
throw new Error(`unsupported responseType ${responseType}`);
}
const [loading, setLoading] = React.useState(skip ? false : true);
const [error, setError] = React.useState(null);
const [data, setData] = React.useState(null);
const [response, setResponse] = React.useState({
loading: skip ? false : true,
error: null,
data: null,
});
// We expect this to be a simple object, so this helps us only re-send the
// fetch when the options have actually changed, rather than e.g. a new copy
@ -271,18 +273,14 @@ export function useFetch(url, { responseType, skip, ...fetchOptions }) {
}
const arrayBuffer = await res.arrayBuffer();
setLoading(false);
setError(null);
setData(arrayBuffer);
setResponse({ loading: false, error: null, data: arrayBuffer });
})
.catch((error) => {
if (canceled) {
return;
}
setLoading(false);
setError(error);
setData(null);
setResponse({ loading: false, error, data: null });
});
return () => {
@ -290,7 +288,7 @@ export function useFetch(url, { responseType, skip, ...fetchOptions }) {
};
}, [skip, url, fetchOptionsAsJson]);
return { loading, error, data };
return response;
}
/**