fix: Read queued updates when initialising state

Closes #702.
47ng · Oct 23, 2024 · c7aafab · c7aafab
1 parent 60cb4d8
commit c7aafab
Show file tree

Hide file tree

Showing 3 changed files with 16 additions and 2 deletions.
diff --git a/packages/nuqs/src/update-queue.ts b/packages/nuqs/src/update-queue.ts
@@ -21,6 +21,10 @@ const transitionsQueue: Set<React.TransitionStartFunction> = new Set()
 let lastFlushTimestamp = 0
 let flushPromiseCache: Promise<URLSearchParams> | null = null
 
+export function getQueuedValue(key: string) {
+  return updateQueue.get(key)
+}
+
 export function enqueueQueryStringUpdate<Value>(
   key: string,
   value: Value | null,

diff --git a/packages/nuqs/src/useQueryState.ts b/packages/nuqs/src/useQueryState.ts
@@ -13,6 +13,7 @@ import { emitter, type CrossHookSyncPayload } from './sync'
 import {
   FLUSH_RATE_LIMIT_MS,
   enqueueQueryStringUpdate,
+  getQueuedValue,
   scheduleFlushToURL
 } from './update-queue'
 import { safeParse } from './utils'
@@ -235,7 +236,11 @@ export function useQueryState<T = string>(
   } = useAdapter()
   const queryRef = useRef<string | null>(initialSearchParams?.get(key) ?? null)
   const [internalState, setInternalState] = useState<T | null>(() => {
-    const query = initialSearchParams?.get(key) ?? null
+    const queuedQuery = getQueuedValue(key)
+    const query =
+      queuedQuery === undefined
+        ? (initialSearchParams?.get(key) ?? null)
+        : queuedQuery
     return query === null ? null : safeParse(parse, query, key)
   })
   const stateRef = useRef(internalState)

diff --git a/packages/nuqs/src/useQueryStates.ts b/packages/nuqs/src/useQueryStates.ts
@@ -14,6 +14,7 @@ import { emitter, type CrossHookSyncPayload } from './sync'
 import {
   FLUSH_RATE_LIMIT_MS,
   enqueueQueryStringUpdate,
+  getQueuedValue,
   scheduleFlushToURL
 } from './update-queue'
 import { safeParse } from './utils'
@@ -258,7 +259,11 @@ function parseMap<KeyMap extends UseQueryStatesKeysMap>(
   return Object.keys(keyMap).reduce((obj, stateKey) => {
     const urlKey = urlKeys?.[stateKey] ?? stateKey
     const { defaultValue, parse } = keyMap[stateKey]!
-    const query = searchParams?.get(urlKey) ?? null
+    const queuedQuery = getQueuedValue(urlKey)
+    const query =
+      queuedQuery === undefined
+        ? (searchParams?.get(urlKey) ?? null)
+        : queuedQuery
     if (cachedQuery && cachedState && cachedQuery[urlKey] === query) {
       obj[stateKey as keyof KeyMap] =
         cachedState[stateKey] ?? defaultValue ?? null