useNavigation is not working when inside useMutation?
@Manuel Schiller Good day! I just want to ask if I am doing it right?. After the success of the login. It should programmatically navigate to the routes given. But It doesnt nagivate though. The onCLose() works but the navigate doesnt work
7 Replies
correct-apricotOP•9mo ago
For now I am using window.location.reload() to refresh the page trigger this loader in my index route
export const Route = createFileRoute("/")({
loader: async ({ context, location }) => {
const res = await context.queryClient.ensureQueryData(useGetCurrentUserQuery());
const user = res.user;
if (user) {
let notCounterRoutes = {
admin: "/dashboard/admin",
manager: "/dashboard/manager",
services: "/dashboard/services",
} as const;
const goToRoute = user?.role
? notCounterRoutes[user.role as keyof typeof notCounterRoutes]
: "/dashboard/counter";
const serviceType = user.serviceTypes.length > 0 ? user.serviceTypes[0] : "";
throw redirect({ to: goToRoute, search: (prev) => ({ ...prev, filter: serviceType, voice: "true" }) });
}
},
component: IndexPageComponent,
});
other-emerald•9mo ago
Hi there, just happened to be scrolling through. The code you have here, to me at least, looks completely fine. The navigate function that you get back from
useNavigate should allow you to navigate from any context, since it should be a reference to router.navigate which is the same reference across the application.
Looking at your code, my first suspicion would be that your onSuccess is not being fired. This would most likely be due to your mutation unmounting before the API request is finished, which would cause your callbacks (onSuccess and onError) not to fire.
If you put console logs in the onSuccess at the top and before your navigate calls, are they definitely being hit?
If this isn't the case, you could try using useRouter to get navigate directly from the router and see if that makes any difference.
Otherwise, the main other thing that I can see is that perhaps your function is either crashing, or hitting your toast notification an returning, but otherwise this should ultimately be fine from my perspective.correct-apricotOP•9mo ago
Hello. Thank you! I have read another thread that looks the same with my issue. So I would try to use they're solution
frail-apricot•9mo ago
@ryeact_dev I have a similar issue, can you share the thread you've found?
correct-apricotOP•9mo ago
@Mohamed Yahye El Joud https://discord.com/channels/719702312431386674/1355971814932873369
fair-rose•9mo ago
You should use the callback onSuccess on the mutate fn not in the useMutation, it's the recommended way by Tkdodo in his blog post
correct-apricotOP•8mo ago
Thank you! I will try this approach too in use-cases I need something like this