[BREAKING] selectAtom does not resolve promises internally

[dmaskasky]

Related Issues or Discussions

https://discord.com/channels/740090768164651008/1213966054125084672

Summary

When selectAtom is based on an atom whose value was originally a promise but was later changed to a value, selectAtom would still return a promise. This is because the original calculation of slice is a promise, so all subsequent calculations of slice must also be promises.

[BREAKING] In this PR selectAtom does not internally resolve promises. Instead this must be handled outside of the utility.

Migration

selectAtom

selectAtom will no longer internally unwrap promises. To migrate to the new api, use the unwrap utility from jotai/utils package.

// suppose we have this
const baseAtom = atom(Promise.resolve({ id: 0, name: 'test' }))

// previously selectAtom would internally unwrap promises.
const idAtom = selectAtom(
  baseAtom,
  ({ name }) => name,
  (prev, curr) => prev.id === curr.id
)

// instead, you need to import `unwrap` from 'jotai/utils' and pass the unwrapped atom 
import { unwrap } from 'jotai/utils'
  ...
const idAtom = selectAtom(
  unwrap(baseAtom),
  ({ name }) => name,
  (prev, curr) => prev.id === curr.id
)

Check List

• yarn run prettier for formatting code and docs

[vercel]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated (UTC)
jotai	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Mar 29, 2024 0:21am

[codesandbox-ci]

This pull request is automatically built and testable in CodeSandbox.

To see build info of the built libraries, click here or the icon next to each commit SHA.

[github-actions]

Preview in LiveCodes

Latest commit: 6b56e74
Last updated: Mar 29, 2024 12:20pm (UTC)

Playground	Link
React demo	https://livecodes.io?x=id/34U2D86MK

---

See documentations for usage instructions.

[dmaskasky]

const baseAtom = atom(0)
const selectedAtom = selectAtom(
  baseAtom,
  (v) => v,
  (a, b) => a === b,
) 

// gives
function selectAtom<number, number>(
  anAtom: Atom<number>,
  selector: (v: number, prevSlice?: number | undefined) => number,
  equalityFn?: ((a: number, b: number) => boolean) | undefined
): Atom<number>

const baseAtom = atom(Promise.resolve(0))
const selectedAtom = selectAtom(
  baseAtom,
  (v) => v,
  (a, b) => a === b,
) 

// gives
function selectAtom<Promise<number>, Promise<number>>(
  anAtom: Atom<Promise<number>>,
  selector: (v: Promise<number>, prevSlice?: Promise<number> | undefined) => Promise<number>,
  equalityFn?: ((a: Promise<number>, b: Promise<number>) => boolean) | undefined
): Atom<Promise<number>>```

[dai-shi]

Yay! Looks far cleaner and more maintainable.

[dai-shi]

Would you please write a migration guide in the PR description?
It will be in the release note later.
https://github.com/pmndrs/jotai/releases/tag/v2.2.0 is an example, but it's a minimal guide. More descriptions would be nice.