function App()

in agent-app/src/App.js [22:126]


function App({ isFederateLogin, isFederateLogout }) {

  const [greetingName, setGreetingName] = useState('');
  const [loaded, setLoaded] = useState(false);
  const { setCognitoUser, setConnectLoginByEmail, setConnectUserId } = useAppState();
  const { authState, setAuthState } = useAppState();
  const prevAuthState = useRef();
  const { cognitoSAMLIdentityProviderName } = useAppConfig();

  const {
    init,
    initCompleted
  } = useInitProvider();

  useEffect(() => {
    if (isFederateLogin) {
      Auth.federatedSignIn({ provider: cognitoSAMLIdentityProviderName }); //automatically init signIn
    }
    else if (isFederateLogout) {
      window.location.href = `${window.location.protocol}//${window.location.host}` //back to root
    }

    return onAuthUIStateChange((nextAuthState, authData) => {
      console.debug(`[VideoCallEscalation] onAuthUIStateChange >> current is ${prevAuthState.current} while nextAuthState is ${nextAuthState}`);
      if (prevAuthState.current !== nextAuthState) {
        prevAuthState.current = nextAuthState;
        handleNextAuthState(nextAuthState);
      }
    });
    // eslint-disable-next-line react-hooks/exhaustive-deps
  }, []);

  const handleNextAuthState = (nextAuthState) => {
    setAuthState(nextAuthState);
    if (nextAuthState === AuthState.SignedIn) {

      const postLoginRedirectURL = getPostLoginRedirectURL();
      if (postLoginRedirectURL && postLoginRedirectURL !== window.location.href) {
        window.location.href = postLoginRedirectURL
      }

      Auth.currentAuthenticatedUser().then(currentUser => {
        const currentUser_Name = currentUser.attributes?.name ? currentUser.attributes?.name : (currentUser.attributes?.email ? currentUser.attributes.email : currentUser.username);
        const currentUser_Username = currentUser.attributes?.email ? currentUser.attributes.email : currentUser.username;
        const currentUser_ConnectUserId = currentUser.attributes["custom:connectUserId"];
        console.info(`[VideoCallEscalation] currentUser_ConnectUserId: ${currentUser_ConnectUserId}`);
        setGreetingName(currentUser_Name);
        setCognitoUser(currentUser_Username, currentUser_Name);
        setConnectUserId(currentUser_ConnectUserId);
        //if(currentUser.username.startsWith(cognitoSAMLIdentityProviderName)){ //for federated login, use email to login into CCP
        setConnectLoginByEmail(true); //always true, since cognito switched to usernameAlias="email"
        //}

        init(currentUser_ConnectUserId).then(() => {
          setLoaded(true);
        });
      }).catch(error => {
        console.log('[VideoCallEscalation] ', error);
      });
    }
    if (nextAuthState === AuthState.SignIn) {
      setPostLoginRedirectURL(window.location.href);
    }
    if (nextAuthState === AuthState.SignedOut) {
      setTimeout(() => {
        console.debug(`[VideoCallEscalation] Logout refresh`);
        window.location = window.location.pathname;
      }, 500);
    }
  }

  const setPostLoginRedirectURL = (postLoginRedirectURL) => {
    window.sessionStorage.setItem('postLoginRedirectURL', postLoginRedirectURL);
  };

  const getPostLoginRedirectURL = () => {
    const postLoginRedirectURL = window.sessionStorage.getItem('postLoginRedirectURL');
    window.sessionStorage.removeItem('postLoginRedirectURL');
    return postLoginRedirectURL;
  };

  return (
    //check if authenticated
    authState === AuthState.SignedIn ? (
      <div className="App">
        <AmplifyGreetings username={greetingName}>
          <span slot="logo"><h3 className='header-title'>Powered by Amazon Connect and Amazon Chime SDK</h3></span>
        </AmplifyGreetings>
        <div style={{ textAlign: 'right', paddingRight: '15px' }}>
          <a href={`${window.location.protocol}//${window.location.host}/demo-website.html`} target="_blank" rel="noopener noreferrer" style={{ 'color': '#3f4149' }}>Demo website</a>
        </div>
        <Theme>
          <ErrorProvider>
            <Router>
              <AmazonConnectProvider>

                {loaded ?

                  (initCompleted ?
                    <>
                      < Route exact path="/" component={VideoAgent} />
                      <Route path={`${routes.RECORDING}/:id?`} component={({ match }) => (<RecordingView externalMeetingId={match.params.id} />)}></Route>
                    </> : <Onboarding />)

                  : <Spinner width="3rem" height="3rem" />}