Two very closely executed `navigate` within a useEffect cause overwrite of search params

[lukaskoeller]

Describe the bug

There are two useEffect that run a navigate very close to each other. While the first one attaches firstId, the second attaches the secondId search param. The time the second navigate tries to spread the old params, old does not yet include the firstId from the first navigate right before (probably because the promise didn't resolve at that time).

The problem and result is that only secondId is attached as search param although I'd expect to see firstId and secondId.

Reference: https://discord.com/channels/719702312431386674/1263458457906839624/1265628984914214952

Your Example Website or App

https://github.com/lukaskoeller/tanstack-react-router-useEffect-navigate-reproduction?tab=readme-ov-file#reproduction-1---second-navigate-does-not-have-updated-params-from-first-navigate-in-old-parameter-thus-overwrites-params-from-first-navigate

Steps to Reproduce the Bug or Issue

1. Install dependencies via pnpm i
2. Start the dev server via pnpm dev
3. Open the console.
4. Navigate to /news
5. Only ?secondId=42 is attached. Also see how old is empty for the navigate:secondId.

Expected behavior

As a user, I expect to see firstId and secondId as search params after both navigate runs, but I only see secondId.

Screenshots or Videos

Platform

• OS: macOS Sonoma 14.3.1
• Browser: Chrome
• Version: 126.0.6478.183 (Official Build) (arm64)

Additional context

No response