fix: use abort controller for modal requests

This commit is contained in:
David Ralph
2021-04-18 18:17:04 +01:00
parent 44125d7471
commit 6c4cc5c373
2 changed files with 30 additions and 5 deletions

View File

@@ -19,17 +19,22 @@ export default class About extends React.PureComponent {
loading: window.language.modals.main.loading
};
this.language = window.language.modals.main.settings.sections.about;
this.controller = new AbortController();
}
async getGitHubData() {
let contributors, sponsors, photographers, versionData;
try {
contributors = await (await fetch(window.constants.GITHUB_URL + '/repos/mue/mue/contributors')).json();
sponsors = (await (await fetch(window.constants.SPONSORS_URL + '/list')).json()).sponsors;
photographers = await (await fetch(window.constants.API_URL + '/images/photographers')).json();
contributors = await (await fetch(window.constants.GITHUB_URL + '/repos/mue/mue/contributors', { signal: this.controller.signal })).json();
sponsors = (await (await fetch(window.constants.SPONSORS_URL + '/list', { signal: this.controller.signal })).json()).sponsors;
photographers = await (await fetch(window.constants.API_URL + '/images/photographers', { signal: this.controller.signal })).json();
versionData = await (await fetch(window.constants.GITHUB_URL + '/repos/mue/mue/releases')).json();
versionData = await (await fetch(window.constants.GITHUB_URL + '/repos/mue/mue/releases', { signal: this.controller.signal })).json();
} catch (e) {
if (this.controller.signal.aborted === true) {
return;
}
return this.setState({
update: 'Failed to get update information',
loading: 'An error occurred'
@@ -43,6 +48,10 @@ export default class About extends React.PureComponent {
updateMsg = `${this.language.version.update_available}: ${newVersion}`;
}
if (this.controller.signal.aborted === true) {
return;
}
this.setState({
contributors: contributors.filter((contributor) => !contributor.login.includes('bot')),
sponsors: sponsors,
@@ -64,6 +73,11 @@ export default class About extends React.PureComponent {
this.getGitHubData();
}
componentWillUnmount() {
// stop making requests
this.controller.abort();
}
render() {
return (
<>

View File

@@ -22,6 +22,7 @@ export default class BackgroundSettings extends React.PureComponent {
backgroundCategories: [window.language.modals.main.loading]
};
this.language = window.language.modals.main.settings;
this.controller = new AbortController();
}
resetCustom = () => {
@@ -70,7 +71,12 @@ export default class BackgroundSettings extends React.PureComponent {
}
async getBackgroundCategories() {
const data = await (await fetch(window.constants.API_URL + '/images/categories')).json();
const data = await (await fetch(window.constants.API_URL + '/images/categories', { signal: this.controller.signal })).json();
if (this.controller.signal.aborted === true) {
return;
}
this.setState({
backgroundCategories: data
});
@@ -80,6 +86,11 @@ export default class BackgroundSettings extends React.PureComponent {
this.getBackgroundCategories();
}
componentWillUnmount() {
// stop making requests
this.controller.abort();
}
render() {
const { background } = this.language.sections;