#Redirection after login

1 messages · Page 1 of 1 (latest)

warm arch
#

I'm using remixjs and xstate. It's a common usecase to redirect(ex: /dashboard) after successful login/authentication. How can we handle redirection in xstate?

If it's not possible, is there a way we can pass the successful authentication information to remixjs and from there somehow redirect?

agile jewel
#

Do you want to redirect on the client or server?

#
on: {
  authenticated: {
    actions: () => {
      // you can redirect here
    }
  }
}
warm arch
#

server side is preferred.

I have this exact code in my project. But I am not sure how to redirect. Is there a redirect() method or something like that?

on: {
  authenticated: {
    actions: () => {
      // you can redirect here
    }
  }
}
agile jewel
#

Yes, in Remix

warm arch
#

In remix there is import { redirect } from "@remix-run/node";

But when I use it inside xstate, it throws error!

on: {
  authenticated: {
    actions: () => {
      redirect('/dashboard);
    }
  }
}

I'm sure the syntax is wrong. But I don't know how to do it properly!!

warm arch
#

I'm making a fetch request to a remix api route, from xstate, and inside the api I am trying to redirect if the authentication is successful. But it's not working. 😦

agile jewel
#

What's the error?

warm arch
#

From the remix api I return redirect("/dashboard")
In xstate, it triggers the catch() block!

#

Maybe because I'm not returning anything, but redirecting to a different page. xstate might be waiting for return of result.

And sadly, the remix redirect doesn't redirect to the dashboard page. It stays on the same page. And in the server log, I can see GET request being made to /dashboard, but it's not redirecting 😦

warm arch
#

I used this code in xstate code and it works!

            if (result.redirected) {
              window.location.href = result.url;
              return { msg: "Logging in ..", css: "green" };
            } else {
              return await result.json();
            }

Next I want to implement sessions.

#

The statemachine I've written for now works good. But when I try to simulate it in the graph/chart it shows wrong behaviour.
The target to be executed depends on a context, and in code it works fine, but in the graph/chart it always flows/moves in one direction and marks the other path as not reachable or something like that.