Hello,
I am developing a custom widget that interacts with a webMap in my organization. My experience is secured with a user group from my organization. My goal is to filter the data on my map according to the logged-in user.
At the moment, I am able to retrieve the authenticated user. However, I am encountering difficulties in using this information to apply a filter to the data displayed when the map opens.
Does anyone have any ideas or has anyone worked on this scenario before?
Solved! Go to Solution.
The user information can be accessed in a custom widget with the props.user object. So your filter could work something like this.
if (props.user.username === 'Bob') {
filterFunction()
}
For an example widget that uses the props.users object, you can look at the Security Widget.
Can you share more of your code? There isn't enough here to see why you can't connect to the dataSource.
Here is the official sample for filtering a feature layer using it's dataSource.
The problem line here looks like this one.
const dataSource = dataSourceId && DataSourceManager.getInstance().getDataSource(dataSourceId);
With the && operator, I think this line is only capable of returning a Boolean value. Try taking out the dataSourceId && part.
const dataSource = DataSourceManager.getInstance().getDataSource(dataSourceId);
You might also need to use a shouldComponetUpdate() function to handle the initial load where the dataSource may not be available yet.
https://www.geeksforgeeks.org/what-does-shouldcomponentupdate-do-and-why-is-it-important/#
The user information can be accessed in a custom widget with the props.user object. So your filter could work something like this.
if (props.user.username === 'Bob') {
filterFunction()
}
For an example widget that uses the props.users object, you can look at the Security Widget.
Thank you for your response and your promptness. The issue arises precisely when I try to apply the filter to the datasource :
if (this.props?.user?.username === "user1") {this.setState({query : "field = 'dispo'"})queryParams = {where: this.state.query};console.log(this.state.query);}}console.log(dataSource)dataSource?.updateQueryParams(queryParams, this.props.id);
Since it can't retrieve the datasource, it displays "undefined
Can you share more of your code? There isn't enough here to see why you can't connect to the dataSource.
Here is the official sample for filtering a feature layer using it's dataSource.
export default class Widget extends React.PureComponent<AllWidgetProps<unknown>,State> {
constructor(props){
super(props)
this.state={filtre: '1=1'}
this.state={user:'utilisateur'}
this.state={query:"field = '1=1'"}
}
}
componentDidMount() {
this.setState({ user: this.props.user?.username });
const dataSourceId = this.props.useDataSources?.[0]?.dataSourceId;
const dataSource = dataSourceId && DataSourceManager.getInstance().getDataSource(dataSourceId);
let queryParams;
if (this.props?.user?.username === "user1") {
this.setState({query : "field = 'OK'"})
queryParams = {
where: this.state.query
};
}
if (!dataSource) {
console.log("Failed to get dataSource");
} else {
dataSource?.updateQueryParams(queryParams, this.props.id);
}
}
render() {
return (
<div className="widget-starter jimu-widget">
</div>
)
The problem line here looks like this one.
const dataSource = dataSourceId && DataSourceManager.getInstance().getDataSource(dataSourceId);
With the && operator, I think this line is only capable of returning a Boolean value. Try taking out the dataSourceId && part.
const dataSource = DataSourceManager.getInstance().getDataSource(dataSourceId);
You might also need to use a shouldComponetUpdate() function to handle the initial load where the dataSource may not be available yet.
https://www.geeksforgeeks.org/what-does-shouldcomponentupdate-do-and-why-is-it-important/#