Stumped with this one. I am trying to build custom UI (in React), and I am using tanstack router. So far, everything has gone ok, but now when it comes to consuming the magic link I am running into an issue I can't figure out. When I do a full page reload using

window.location.assign

, everything works fine, but when I try to use the TS-router way which doesn't result in a full-page refresh, the url does not resolve. In the second case, if I refresh, it does correctly sign me in, so I am not sure what I am doing wrong. Here is my code:

ts
export const Route = createFileRoute('/auth')({
  beforeLoad: async ({ context }) => {
    try {
      if (context.auth.isLoggedIn) {
        toast.info('You are already logged in');
        throw redirect({
          to: '/',
        });
      }

      // Check if the user is accessing the route with a magic link
      const isSameBrowserAndDevice = await isThisSameBrowserAndDevice();
      if (isSameBrowserAndDevice) {
        // Consume the magic link
        const magicLinkResult = await handleMagicLinkClicked();
        if (magicLinkResult === 'success') {
          window.location.assign('/');
          // throw redirect({
          //   to: '/',
          // });
        } else if (magicLinkResult === 'error') {
          // Handle error case if needed
          toast.error('An error occurred. Please try again.');
        }
      }
      const initialMagicLinkSent = await hasInitialLinkBeenSent();
      return { initialMagicLinkSent };
    } catch (error) {
      console.error('Error in beforeLoad:', error);
      toast.error('An error occurred while checking authentication.');
    }
  },
  component: ({ initialMagicLinkSent }) =>
    initialMagicLinkSent ? <ResendLinkForm /> : <AuthForm />,
});

Thankful for any guideance