Maximum update depth exceeded when redirecting

Hello I have this setup and every time I navigate to /profile I get the error even though the app doesnt crush and there's no problem I just wonder what's the correct way to achieve that redirect

export const profileRoute = createRoute({
  getParentRoute: () => rootRoute,
  path: "/profile/$username",
  component: Profile,
});

export const ownProfileRoute = createRoute({
  getParentRoute: () => rootRoute,
  path: "/profile",
  component: OwnProfile,
});

function OwnProfile() {
  const { username } = useUserState();
  const { search } = useLocation();

  return (
    <Navigate
      to="/profile/$username"
      params={{ username }}
      search={search}
      replace
    />
  );
}

export const profileRoute = createRoute({
  getParentRoute: () => rootRoute,
  path: "/profile/$username",
  component: Profile,
});

export const ownProfileRoute = createRoute({
  getParentRoute: () => rootRoute,
  path: "/profile",
  component: OwnProfile,
});

function OwnProfile() {
  const { username } = useUserState();
  const { search } = useLocation();

  return (
    <Navigate
      to="/profile/$username"
      params={{ username }}
      search={search}
      replace
    />
  );
}

TanStack•13mo ago•

1 reply

living-lavender

Maximum update depth exceeded when redirecting

Hello I have this setup and every time I navigate to /profile I get the error even though the app doesnt crush and there's no problem I just wonder what's the correct way to achieve that redirect

export const profileRoute = createRoute({
  getParentRoute: () => rootRoute,
  path: "/profile/$username",
  component: Profile,
});

export const ownProfileRoute = createRoute({
  getParentRoute: () => rootRoute,
  path: "/profile",
  component: OwnProfile,
});

function OwnProfile() {
  const { username } = useUserState();
  const { search } = useLocation();

  return (
    <Navigate
      to="/profile/$username"
      params={{ username }}
      search={search}
      replace
    />
  );
}

export const profileRoute = createRoute({
  getParentRoute: () => rootRoute,
  path: "/profile/$username",
  component: Profile,
});

export const ownProfileRoute = createRoute({
  getParentRoute: () => rootRoute,
  path: "/profile",
  component: OwnProfile,
});

function OwnProfile() {
  const { username } = useUserState();
  const { search } = useLocation();

  return (
    <Navigate
      to="/profile/$username"
      params={{ username }}
      search={search}
      replace
    />
  );
}

Maximum update depth exceeded when redirecting

Similar Threads

Maximum update depth exceeded when redirecting

Similar Threads

Similar Threads

Similar Threads