mirror of
https://github.com/a-nyx/maputnik-with-pmtiles.git
synced 2024-12-29 08:00:32 +01:00
Merge pull request #394 from orangemug/fix/request-abort-and-oerlapping-modals
Fix overlapping modals & request canceling
This commit is contained in:
commit
c908f7dcd0
1 changed files with 55 additions and 41 deletions
|
@ -76,6 +76,8 @@ class OpenModal extends React.Component {
|
||||||
onStyleSelect = (styleUrl) => {
|
onStyleSelect = (styleUrl) => {
|
||||||
this.clearError();
|
this.clearError();
|
||||||
|
|
||||||
|
let canceled;
|
||||||
|
|
||||||
const activeRequest = fetch(styleUrl, {
|
const activeRequest = fetch(styleUrl, {
|
||||||
mode: 'cors',
|
mode: 'cors',
|
||||||
credentials: "same-origin"
|
credentials: "same-origin"
|
||||||
|
@ -84,6 +86,10 @@ class OpenModal extends React.Component {
|
||||||
return response.json();
|
return response.json();
|
||||||
})
|
})
|
||||||
.then((body) => {
|
.then((body) => {
|
||||||
|
if(canceled) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
this.setState({
|
this.setState({
|
||||||
activeRequest: null,
|
activeRequest: null,
|
||||||
activeRequestUrl: null
|
activeRequestUrl: null
|
||||||
|
@ -104,7 +110,11 @@ class OpenModal extends React.Component {
|
||||||
})
|
})
|
||||||
|
|
||||||
this.setState({
|
this.setState({
|
||||||
activeRequest: activeRequest,
|
activeRequest: {
|
||||||
|
abort: function() {
|
||||||
|
canceled = true;
|
||||||
|
}
|
||||||
|
},
|
||||||
activeRequestUrl: styleUrl
|
activeRequestUrl: styleUrl
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
@ -165,7 +175,9 @@ class OpenModal extends React.Component {
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
return <Modal
|
return (
|
||||||
|
<div>
|
||||||
|
<Modal
|
||||||
data-wd-key="open-modal"
|
data-wd-key="open-modal"
|
||||||
isOpen={this.props.isOpen}
|
isOpen={this.props.isOpen}
|
||||||
onOpenToggle={() => this.onOpenToggle()}
|
onOpenToggle={() => this.onOpenToggle()}
|
||||||
|
@ -200,6 +212,7 @@ class OpenModal extends React.Component {
|
||||||
{styleOptions}
|
{styleOptions}
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
|
</Modal>
|
||||||
|
|
||||||
<LoadingModal
|
<LoadingModal
|
||||||
isOpen={!!this.state.activeRequest}
|
isOpen={!!this.state.activeRequest}
|
||||||
|
@ -207,7 +220,8 @@ class OpenModal extends React.Component {
|
||||||
onCancel={(e) => this.onCancelActiveRequest(e)}
|
onCancel={(e) => this.onCancelActiveRequest(e)}
|
||||||
message={"Loading: "+this.state.activeRequestUrl}
|
message={"Loading: "+this.state.activeRequestUrl}
|
||||||
/>
|
/>
|
||||||
</Modal>
|
</div>
|
||||||
|
)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
Loading…
Reference in a new issue