mirror of
https://github.com/a-nyx/maputnik-with-pmtiles.git
synced 2024-11-10 07:17:44 +01:00
Added ability to switch to layer from global error panel.
This commit is contained in:
parent
d1cb2690fc
commit
adea3d0f13
3 changed files with 20 additions and 1 deletions
|
@ -732,6 +732,7 @@ export default class App extends React.Component {
|
||||||
/> : null
|
/> : null
|
||||||
|
|
||||||
const bottomPanel = (this.state.errors.length + this.state.infos.length) > 0 ? <MessagePanel
|
const bottomPanel = (this.state.errors.length + this.state.infos.length) > 0 ? <MessagePanel
|
||||||
|
onLayerSelect={this.onLayerSelect}
|
||||||
mapStyle={this.state.mapStyle}
|
mapStyle={this.state.mapStyle}
|
||||||
errors={this.state.errors}
|
errors={this.state.errors}
|
||||||
infos={this.state.infos}
|
infos={this.state.infos}
|
||||||
|
|
|
@ -6,6 +6,11 @@ class MessagePanel extends React.Component {
|
||||||
errors: PropTypes.array,
|
errors: PropTypes.array,
|
||||||
infos: PropTypes.array,
|
infos: PropTypes.array,
|
||||||
mapStyle: PropTypes.object,
|
mapStyle: PropTypes.object,
|
||||||
|
onLayerSelect: PropTypes.func,
|
||||||
|
}
|
||||||
|
|
||||||
|
static defaultProps = {
|
||||||
|
onLayerSelect: () => {},
|
||||||
}
|
}
|
||||||
|
|
||||||
render() {
|
render() {
|
||||||
|
@ -14,9 +19,16 @@ class MessagePanel extends React.Component {
|
||||||
if (error.parsed && error.parsed.type === "layer") {
|
if (error.parsed && error.parsed.type === "layer") {
|
||||||
const {parsed} = error;
|
const {parsed} = error;
|
||||||
const {mapStyle} = this.props;
|
const {mapStyle} = this.props;
|
||||||
|
const layerId = mapStyle.layers[parsed.data.index].id;
|
||||||
content = (
|
content = (
|
||||||
<>
|
<>
|
||||||
Layer <span>'{mapStyle.layers[parsed.data.index].id}'</span>: {parsed.data.message}
|
Layer <span>'{layerId}'</span>: {parsed.data.message} —
|
||||||
|
<button
|
||||||
|
className="maputnik-message-panel__switch-button"
|
||||||
|
onClick={() => this.props.onLayerSelect(layerId)}
|
||||||
|
>
|
||||||
|
switch to layer
|
||||||
|
</button>
|
||||||
</>
|
</>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
|
@ -212,6 +212,12 @@
|
||||||
&-error {
|
&-error {
|
||||||
color: $color-red;
|
color: $color-red;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
&__switch-button {
|
||||||
|
all: unset;
|
||||||
|
text-decoration: underline;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.maputnik-dialog {
|
.maputnik-dialog {
|
||||||
|
|
Loading…
Reference in a new issue