redirecting in beforeLoader changes url but not the mounted component

hey all

i had a quick question regarding the redirect feature

export const Route = createFileRoute("/auth/instagram")({
  validateSearch: (search: Record<string, unknown>): ItemFilters => {
    return {
      code: search.code as string,
    };
  },
  component: InstagramAuth,
  beforeLoad: async () => {
    console.log(auth.currentUser);
    if (!auth.currentUser) {
      console.log("should redirect");
      throw redirect({
        to: "/",
      });
    }
  },
});

export const Route = createFileRoute("/auth/instagram")({
  validateSearch: (search: Record<string, unknown>): ItemFilters => {
    return {
      code: search.code as string,
    };
  },
  component: InstagramAuth,
  beforeLoad: async () => {
    console.log(auth.currentUser);
    if (!auth.currentUser) {
      console.log("should redirect");
      throw redirect({
        to: "/",
      });
    }
  },
});

I have this route, if i try to redirect from the component in the beforeLoad it will change the url but the components wont change properly and plus there is also no errors being thrown either
here the url is / but the components is still /auth/instagram

This is my first post so sorry if this is not the right formatting please let me know, happy to take it down

TanStack•2y ago•

4 replies

endless-jade

redirecting in beforeLoader changes url but not the mounted component

hey all

i had a quick question regarding the redirect feature

export const Route = createFileRoute("/auth/instagram")({
  validateSearch: (search: Record<string, unknown>): ItemFilters => {
    return {
      code: search.code as string,
    };
  },
  component: InstagramAuth,
  beforeLoad: async () => {
    console.log(auth.currentUser);
    if (!auth.currentUser) {
      console.log("should redirect");
      throw redirect({
        to: "/",
      });
    }
  },
});

export const Route = createFileRoute("/auth/instagram")({
  validateSearch: (search: Record<string, unknown>): ItemFilters => {
    return {
      code: search.code as string,
    };
  },
  component: InstagramAuth,
  beforeLoad: async () => {
    console.log(auth.currentUser);
    if (!auth.currentUser) {
      console.log("should redirect");
      throw redirect({
        to: "/",
      });
    }
  },
});

redirecting in beforeLoader changes url but not the mounted component

Similar Threads

redirecting in beforeLoader changes url but not the mounted component

Similar Threads

Similar Threads

Similar Threads