I am running the code below in a custom experience builder widget. It is supposed to filter multiple layers in the map. The filter works as expected but as soon as I click on a feature in the map and the pop up opens, the filter is cleared from all the layers. I expect the filter to be maintained on the layers until I remove it on the click of another button. What could be causing this behaviour?
import { React, type SqlQueryParams, type AllWidgetProps, DataSourceManager, type FeatureLayerDataSource } from 'jimu-core'
import { JimuMapViewComponent, type JimuMapView } from 'jimu-arcgis'
import FeatureLayer from 'esri/layers/FeatureLayer'
import { Select, Option } from 'jimu-ui'
import { FeatureLayerDataSourceImpl } from 'jimu-core/data-source'
import { FeatureLayerDataSourceManager } from 'dist/widgets/common/chart/src/runtime/chart/data-source'
const { useState } = React //{} allow destructuring of this constant
const Widget = (props: AllWidgetProps<any>) => {
const [jmv, setJmv] = useState<JimuMapView>()
const activeViewChangeHandler = (jimumapview: JimuMapView) => {
if (jimumapview) {
setJmv(jimumapview)
}
}
const addLayerHandler = (evt) => {
evt.preventDefault()
//filter all layer views
jmv.view.map.layers.forEach((lyr) => {
if (lyr.type === 'feature' && (lyr.title === 'OpenMarketSm' || lyr.title === 'ExclusionZoneSm' || lyr.title === 'ExclusionZoneSm')) {
let featLyrView = null
jmv.view.whenLayerView(lyr).then((lyrview) => {
featLyrView = lyrview
featLyrView.filter = {
where: "ServiceAreaType ='Comm. Recycling'"
}
})
}
})
}
return (
<div>
<Select
aria-label="Name"
placeholder='Select a service type'>
<Option value = "1">Residential Trash </Option>
<Option value = "2">Residential Recycle </Option>
<Option value = "3">Residential Yard Waste </Option>
<Option value = "4">Commercial Trash </Option>
<Option value = "5">Commercial Recycle </Option>
<Option value = "6">Industrial Temp </Option>
<Option value = "7">Sanitation Services </Option>
</Select>
<div>Add Layers to a Map</div>
<div>
{props.useMapWidgetIds && props.useMapWidgetIds.length === 1 &&
(<JimuMapViewComponent useMapWidgetId={props.useMapWidgetIds?.[0]} onActiveViewChange={activeViewChangeHandler}/>)}
</div>
<form onSubmit={addLayerHandler}>
<button className='btn btn-primary'>
Add Layer to map
</button>
</form>
</div>
)
}
export default Widget
//activeViewChangeHandler is called once when the map is ready
// {/* ?. checks if object is null */}
@UndralBatsukh
