TanStack / router

🤖 Fully typesafe Router for React (and friends) w/ built-in caching, 1st class search-param APIs, client-side cache integration and isomorphic rendering.
https://tanstack.com/router
MIT License
7.19k stars 486 forks source link

Navigation without to param does not work since 1.30.1 #1525

Closed maksymskuibida closed 2 weeks ago

maksymskuibida commented 3 weeks ago

Describe the bug

I updated to 1.30.1, because fix for bug with path params was introduced and it works fine. But, it broke other thing. Before 1.30.1 I was able to make link, or use navigate(), or throw redirect() without specifing to. I did it, because I only need to change path param(for example language code in path param), but I want to leave user on the same page and it worked fine. Now it ignores new path params and generates href with old params in this case.

Your Example Website or App

everywhere

Steps to Reproduce the Bug or Issue

  1. Create component and specify only from and params
  2. Press/hover on it. Nothing happens

Expected behavior

I expected to generate href with new params, but previous path

Screenshots or Videos

No response

Platform

Additional context

No response

maksymskuibida commented 3 weeks ago

I found workaround for this

You can use this hook

import { useMatches, useRouter } from "@tanstack/react-router";

export default function useCurrentRouteFullPath() {
    const router = useRouter();
    const routeId = useMatches({
        select: matches => {
            if (matches.length === 0) {
                throw Error("No matcher found");
            }
            return matches[matches.length - 1].routeId;
        },
    });
    return router.routesById[routeId].fullPath;
}

It will return current "to" and you can put it into navigate(), . Probably it will cause typescript errors with "params" and "search", but it works

I think it would be great to do it default behaviour, when to is not specified, like it was before 1.30.1

schiller-manuel commented 3 weeks ago

was this regression introduced with 1.30.1? or another earlier version?

maksymskuibida commented 2 weeks ago

I am sorry for late answer, yes, it was introduced with 1.30.1. It worked with 1.29.2, but a lot of other things worked bad. I have just updated to latest version 1.31.1 and the issue persists

DogPawHat commented 2 weeks ago

I think this is the cause of https://github.com/TanStack/tanstack.com/issues/218 over on the docs site

I have a reproduction StackBlitz of what's going on here: https://stackblitz.com/edit/tanstack-router-gvq58b Clicking the post links will work fine, but the select will call navigate({params: ...}) and it won't do anything. (it's controlled by the postId param)

@maksymskuibida could you try 1.31.0? From my perspective it was working fine on that version but was broke (again?) in the next commit at https://github.com/TanStack/router/commit/91bf1bc42a73da9da59f8ff16eb26a9840893136

DogPawHat commented 2 weeks ago

I did some debugging and it seems under these circumstances, interpolatePathname at line 968 at react-router/src/router.ts is not being passed a path with the proper params (e.g. pathname is /posts/3, params is {postId: 4}, when it should be /posts/$postId, {postId: 4}.

If I have time I'll try and make a PR with a test.

maksymskuibida commented 2 weeks ago

@DogPawHat I will try 1.31.0 and let you know

maksymskuibida commented 2 weeks ago

@DogPawHat I have just tested. It really works on 1.31.0. This version have issue with preload="intent". When I hover on links it changes path params in internal router state.

So, I went back to latest version. But, also I found, that in latest version redirects work without to param. They did not work before, but work now.

I have been using to: router.routesById[router.state.matches[router.state.matches.length - 1].routeId].fullPath to fix this issue. But now I can remove this, because throw redirect(...) now works without to param

DogPawHat commented 2 weeks ago

Well my stackblitz and the tanstack docs site still have this issue I think, gonna throw up the test pr now.