How to respond to changes in auth state in @aws-amplify/ui-react

user_2600531 0
Viewed 498

Using the older aws-amplify-react, in order to redirect the user to the requested URL after successful login, I had:

<Authenticator
  onStateChange={authState => {
    if (authState === 'signedIn') {
      const { from } = this.props.location.state || {
        from: {
          pathname: '/',
          search: ''
        }
      };
      this.props.history.replace(from.pathname + from.search);
    }
  }}
/>

From the documentation for the new version (@aws-amplify/ui-react) I see how to access the auth state with the useAuthenticator hook, but no built-in facility to handle changes in this state. Is it not supported and I'm now expected to implement my own change detection?

aws-amplify reactjs authentication
1 Answers

Nothing has changed the hook useAuthenticator can return route that represents the current authState:

const { route } = useAuthenticator(context => [context.route]);

if (route === "authenticated"){
   
    const location = useLocation();
    const history = useHistory();

    const { from } = location.state || { from: { pathname: '/', search: '' } }; 
    history.replace(from.pathname + from.search);
}
user_114985680
Related