Skip to content

Commit

Permalink
fix: Use correct keys for state sync (#759)
Browse files Browse the repository at this point in the history
Closes #758.
  • Loading branch information
franky47 authored Nov 12, 2024
1 parent 72a5b2b commit 6bc229a
Show file tree
Hide file tree
Showing 3 changed files with 47 additions and 1 deletion.
12 changes: 12 additions & 0 deletions packages/e2e/next/cypress/e2e/repro-758.cy.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,12 @@
/// <reference types="cypress" />

describe('repro-758', () => {
it('honors urlKeys when navigating back after a push', () => {
cy.visit('/app/repro-758')
cy.contains('#hydration-marker', 'hydrated').should('be.hidden')
cy.get('button').click()
cy.get('#state').should('have.text', 'test')
cy.go('back')
cy.get('#state').should('be.empty')
})
})
34 changes: 34 additions & 0 deletions packages/e2e/next/src/app/app/repro-758/page.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,34 @@
'use client'

import { parseAsString, useQueryStates } from 'nuqs'
import { Suspense } from 'react'

export default function Page() {
return (
<Suspense>
<Client />
</Suspense>
)
}

function Client() {
const [{ query }, setSearchParams] = useQueryStates(
{
query: parseAsString
},
{
history: 'push',
urlKeys: {
query: 'q'
}
}
)
return (
<>
<button onClick={() => setSearchParams({ query: 'test' })}>
Set query
</button>
<p id="state">{query}</p>
</>
)
}
2 changes: 1 addition & 1 deletion packages/nuqs/src/useQueryStates.ts
Original file line number Diff line number Diff line change
Expand Up @@ -123,7 +123,7 @@ export function useQueryStates<KeyMap extends UseQueryStatesKeysMap>(
)
setInternalState(state)
}, [
Object.keys(resolvedUrlKeys)
Object.values(resolvedUrlKeys)
.map(key => initialSearchParams?.get(key))
.join('&')
])
Expand Down

0 comments on commit 6bc229a

Please sign in to comment.