How to update the state when dependencies change

[adel-bassiony]

Context

What's your version of nuqs?

"nuqs": "^2.0.0"

What framework are you using?

• ✅ Next.js (app router)

Which version of your framework are you using?

next: 14.2.13

Description

In this example, I created nuqs state to set and get the option object and use it in the url, when the items prop change it's not update the state:

    const [selectedOption, setSelectedOption] = useQueryState<Option | null>(name, {
        parse: (value) => items.find((item: Option) => item.id.toString() === value) ?? null,
        serialize: (value): string => parseAsString.withDefault(value?.id.toString() ?? '').serialize(value?.id.toString() ?? ''),
        clearOnDefault: true,
        shallow: false,
    });

How i can update the selectedOption when the items prop chnages or updated ? the items prop is an array i pass it to the component, this array loading it's data from external API, so how i can update it automatically without useEffect ?

Reproduction

I created a new nuqs state and start using it like the above example

[franky47]

That sounds like prop synchronization. Avoid it if you can as it's often a source of pain to maintain over time. If you don't have a choice, then useEffect is the way.