plain-purple

navigate to external url with tanstack router / start

Hey everyone, I couldnt find how to navigate to an external url using tanstack router / start. I am currently doing it in this way but I am wondering if tanstack router supports a better way to navigate to an external url ?

  const githubSignIn = useMutation({
    mutationFn: githubSignInAction,
    onSuccess: (url) => {
      startRedirectTransition(async () => {
        window.location.href = url;
      });
    },
  });

  const githubSignIn = useMutation({
    mutationFn: githubSignInAction,
    onSuccess: (url) => {
      startRedirectTransition(async () => {
        window.location.href = url;
      });
    },
  });

8 Replies

wise-white•8mo ago

you can throw a redirect to an external url

plain-purpleOP•8mo ago

that doesn't work on the client

wise-white•8mo ago

sure does but probably not in a mutation router needs to catch the redirect to be able to act upon it but your way is really how that works underneath when an external redirect occurs so I would just use it as is

plain-purpleOP•8mo ago

that makes sense, thanks for explaining 🙌 The only think I don't like about the above code example is that react cannot track the redirect with the useTransition hook, so I can't show a loading spinner when redirecting with nextjs I was about to do something like this:

  const router = useRouter();
  const [isRedirectPending, startRedirectTransition] = useTransition();

  const githubSignIn = api.auth.githubSignIn.useMutation({
    onSuccess: (url) => {
      startRedirectTransition(() => {
        router.push(url.href);
      });
    },
  });

  const router = useRouter();
  const [isRedirectPending, startRedirectTransition] = useTransition();

  const githubSignIn = api.auth.githubSignIn.useMutation({
    onSuccess: (url) => {
      startRedirectTransition(() => {
        router.push(url.href);
      });
    },
  });

wise-white•8mo ago

hm but eventually this would also use window.location.href ?

plain-purpleOP•8mo ago

I would imagine, but it works with the useTransition hook

wise-white•8mo ago

interesting! can you please create a github issue to track this?

plain-purpleOP•8mo ago

sure 👍

Gaming

Programming

navigate to external url with tanstack router / start

Did you find this page helpful?