topic Re: Widget identifying when user logs in (Dev 1.1) in ArcGIS Experience Builder Questions

Widget identifying when user logs in (Dev 1.1)

PhilLarkin1 — Wed, 30 Sep 2020 15:30:53 GMT

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.

Re: Widget identifying when user logs in (Dev 1.1)

PhilLarkin1 — Sat, 11 Dec 2021 23:36:14 GMT

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> 
    );
 }
}‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

Re: Widget identifying when user logs in (Dev 1.1)

PhilLarkin1 — Wed, 30 Sep 2020 17:33:34 GMT

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 Han‌Mingyang Han

Re: Widget identifying when user logs in (Dev 1.1)

DavidMartinez — Wed, 30 Sep 2020 20:24:04 GMT

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

Re: Widget identifying when user logs in (Dev 1.1)

PhilLarkin1 — Sat, 11 Dec 2021 23:36:17 GMT

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:

Add a secured map to your editor sample.
In widget.tsx add this function, and call that function in return()

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.

Re: Widget identifying when user logs in (Dev 1.1)

DavidMartinez — Thu, 01 Oct 2020 21:59:06 GMT

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.

static mapExtraStateProps = (state: IMState, props: AllWidgetProps<IMConfig>): Props => {

if (!state.token) {

return{

userLog: state.token

};

componentDidUpdate(){

const {userLog} = this.props

if (userLog) {

do something

}else{

do something else`

}

Re: Widget identifying when user logs in (Dev 1.1)

JunshanLiu — Sun, 04 Oct 2020 07:50:05 GMT

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.

Re: Widget identifying when user logs in (Dev 1.1)

PhilLarkin1 — Mon, 05 Oct 2020 22:42:01 GMT

Thanks for your reply. I can confirm that the token is updated after login. The user prop is not.

Re: Widget identifying when user logs in (Dev 1.1)

PhilLarkin1 — Mon, 05 Oct 2020 22:43:44 GMT

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.

Re: Widget identifying when user logs in (Dev 1.1)

DavidMartinez — Tue, 06 Oct 2020 16:19:57 GMT

Hi Phil,

We have this logged as an issue for us to fix user prop.

Cheers,

David

Re: Widget identifying when user logs in (Dev 1.1)

PhilLarkin1 — Tue, 06 Oct 2020 16:53:41 GMT

Thanks David