How might a widget know that a user has successfully logged in? Is there a message I can listen for? Seems the message/action route isn't ready for this yet as the message list is short: https://developers.arcgis.com/experience-builder/api-reference/jimu-core/MessageType
Is there some other built-in method for identifying a successful log in? I'm currently waiting for props.user to populate but this is problematic for several reasons.
Solved! Go to Solution.
I have a test, the user is not updated after popup login, but the token is updated. So, can you check "this.props.token"?
The user prop should be updated after login, we'll try to fix it in next release.
Here is an example of why waiting for this.props has been an issue for me. The object is sometimes Null....which seems very odd.
import { AllWidgetProps, BaseWidget, jsx, React } from 'jimu-core';
import { JimuMapViewComponent, JimuMapView } from "jimu-arcgis";
import { IMConfig } from '../config';
export default class Widget extends BaseWidget<AllWidgetProps<IMConfig>, any> {
constructor(props) {
super(props);
console.log(this.props) // This returns the props object. props.user is empty
// as I would expect since the user has not logged in yet.
this.state = {
jimuMapView: null
}
}
activeViewChangeHandler = (jmv: JimuMapView) => {
if (jmv) {
this.setState({
jimuMapView: jmv
})
}
};
// "is invoked immediately after updating occurs. This method is not called for the initial render. "
// "Use this as an opportunity to operate on the DOM when the component has been updated."
//https://reactjs.org/docs/react-component.html#componentdidupdate
componentDidUpdate(prevProps) {
// console log will be updated after user logs in.
console.log(prevProps.user) // returns Null
console.log(this.props.user) // returns Null
if (this.props.user !== prevProps.user) {
console.log(this.props.user) // Condition not met
}
}
render() {
let mvc = <p>Please select a map.</p>;
if (
this.props.hasOwnProperty("useMapWidgetIds") &&
this.props.useMapWidgetIds &&
this.props.useMapWidgetIds.length === 1
) {
mvc = (
<JimuMapViewComponent
useMapWidgetIds={this.props.useMapWidgetIds}
onActiveViewChange={this.activeViewChangeHandler}
/>
);
};
return (
<div className="widget-demo jimu-widget m-2">
{mvc}
</div>
);
}
}
It seems as if post-login props.user is not refreshed. This is problematic for widgets that are in a Widget Controller and are set to open by default. Since the widget is rendered before the login prompt is displayed it only has access to props rendered at that time. props.user is effectively worthless to a widget in this scenario.
Or, am I wrong? Is there a way I can force a refresh of props?
Thanks for any help you can provide.
Gavin Rehkemper , David Martinez , Mingyang HanMingyang Han
Hey Phil,
You can use a global to check if there is a value for the user. For example, to see if there is a username available use getAppStore().getState().user.username; getAppStore is part of jimu-core.
David
Hi David,
Thanks for your reply. I gave getAppStore a try but encountered the same problem as when I tried to retrieve props as shown in the earlier comment.
Here is a way you can validate my workflow:
checkUserStatus() {
let test = getAppStore().getState().user
console.log(test)
}
return (
{this.checkUserStatus()} )
3. On the initial load of the app a user will be prompted to log in. After the map loads click on the widget, open up Dev Tools: Console will show null.
4. Load app again. Credentials are grabbed from the cache and both methods successfully return the user details.
My wild hypothesis is that the framework is not updating props after credentials are verified. Really struggling to find a way to make this work for secured content.
Hi Phil,
That makese sense because there are no globals yet since you haven't authenticated. What you can do is do something like this where you can detect the null value of the token before the login and then check if the token exists in the componentDidUpdate function. I will check with my team to see if we have some kind of prop for successful login.
Hi David, Thank you for your reply.
I suppose if a fix doesn't come by next release I could give your suggestion a try.
Hi Phil,
We have this logged as an issue for us to fix user prop.
Cheers,
David
Thanks David
I have a test, the user is not updated after popup login, but the token is updated. So, can you check "this.props.token"?
The user prop should be updated after login, we'll try to fix it in next release.