Atom state setter is of type never when initial value is null or undefined

[nicmeriano]

When initializing an atom with null or undefined the returned setter has a type of never, which makes typescript unhappy whenever I try to invoke it to update the state.

// Works as expected - setCount: (update?: SetStateAction<number>) => void
const [count, setCount] = atom(0)

// Doesn't work as expected - setCount: never
const [count, setCount] = atom<number | null>(null);

I'd be happy to look into it if needed.

[dai-shi]

related: #802 and #550

I assume you are in the non-strict mode. (which isn't supported... unfortunately.)

See this for workaround: #802 (comment)

[nicmeriano]

Ah yes, although not ideal enabling strictNullChecks does seem to solve the issue. Thanks!

[dai-shi]

Yeah, it would be nice if it can be supported without too much hustle. We have tried it in #550, but anyone can try if they want to be challenged.

Closing this, but this has been reported three times, so it's worth considering to add a note in docs.

[dai-shi]

Maybe, leave it open for a while.

[phoenixeliot]

Came here cause I just spent 30min being very confused as to how to set the values of atoms, thinking I was doing it wrong.
Perhaps jotai could emit some kind of warning when using null? Not sure if that's feasible.

Either way, I would love a note added to the docs about this problem.

[dai-shi]

okay, let me work on adding a tiny note.

[HoltMansfield]

const [count, setCount] = atom(null as number)

This works for me with strict: false

[dai-shi]

Cool. Do you mean atom(null as number | null) work with strict: false?

[HoltMansfield]

Cool. Do you mean atom(null as number | null) work with strict: false?

The line I posted is the exact line I tried in my editor.

I'm not a TS expert by an means.

I can do this with strict:false

const selectedProjectAtom = atom<Project | null>(null as Project)

and

const selectedProjectAtom = atom<Project>(null as Project | null)

It appears both lines are equivalent.

[dulee-dev]

hey guys you should try this

1. you need to write type for setValue like below

import { SetStateAction, useAtom } from 'jotai';
const init: T = ....
const [value, setValue] = useAtom<T, SetStateAction< T>, void>(init);

2. I make the "useTypeAtom< T>" hook

const useTypeAtom = < T>(init: PrimitiveAtom< T>) => {
return useAtom<T, SetStateAction< T>, void>(init);
}