What is the proper way to access a state transition from frontend?

[tall heath]

I have the following code looking to redirect from login form in the frontend after successful authentication:

useEffect(() => {
    const subscription = authActor.subscribe((observer) => {
      // authentication onDone, if loggedIn redirect
    });

    return () => {
      subscription.unsubscribe();
    };
  }, [authActor]);

In v4 we were looking at the actual observer event being fired (but speaking with David this was an anti-pattern):

if (observer.event.type === 'done.invoke.auth.authenticating:invocation[0]') {

What is the "proper" way to handle this in v5?

[tall heath]

Just for reference, we're planning on having an entry on loggedIn state (rather than a function onDone in the authenticating state before it), and then allowing the frontend to "provide" an action implementation for the entry action

[tall heath]

This actually gets messy with useEffect from the frontend and router involved. Shifted strategies to potentially have an "in-between" state that gets hit on entry of loggedIn and loggedOut states using the passed event to check whether it came from authenticating/unauthenticating