Pass parameter during get atom call (zustand to jotai)

[rtritto]

I'm replacing zustand to jotai (PR).

In this code, seems that parameter are passed to get of state.
It's similar to selectorFamily (recoil).

zustand code:

const { Provider, useStore } = createContext()
<Provider createStore={() =>
  create(
    combine(
      { ... },
      (set, get) => ({
        getInspectCache: (path, nestedIndex) => {
          const target = nestedIndex !== undefined
            ? path.join('.') +
            `[${nestedIndex}]nt`
            : path.join('.')
          return get().inspectCache[target]
        },
        ...
    )
  )
} >
  ...
</Provider>

// hook
function useInspect  (path: (string | number)[], value: any, nestedIndex?: number) {
  const getInspectCache = useJsonViewerStore(store => store.getInspectCache)

  useEffect(() => {
    const inspect = getInspectCache(path, nestedIndex)
    ...
  }, [..., path, nestedIndex, getInspectCache])
}

I did some tries, but none correctly work:

export const inspectCacheAtom = atom({})

const getInspectCacheAtom = atom(
  (get) => get(inspectCacheAtom),
  (get, _set, { path, nestedIndex }) => {
    const target = nestedIndex === undefined
      ? path.join('.')
      : `${path.join('.')}[${nestedIndex}]nt`
    return get(inspectCacheAtom)[target]
  }
)

OR

const getInspectCacheAtom = atom(({ path, nestedIndex }) => atom(
  (get) => {
    const target = nestedIndex === undefined
      ? path.join('.')
      : `${path.join('.')}[${nestedIndex}]nt`
    return get(inspectCacheAtom)[target]
  }
), deepEqual)

OR

const getInspectCacheAtom = atomFamily(({ path, nestedIndex }) => atomWithDefault(
  (get) => {
    const target = nestedIndex === undefined
      ? path.join('.')
      : `${path.join('.')}[${nestedIndex}]nt`
    return get(inspectCacheAtom)[target]
  }
), deepEqual)

Maybe should be used some Custom useAtom hooks.

[dai-shi]

If you are using props, it has to be a hook.

const useInspectCache = ({ path, nestedIndex }) => {
  const derivedAtom = useMemo(() => atom((get) => {
    const target = nestedIndex === undefined
      ? path.join('.')
      : `${path.join('.')}[${nestedIndex}]nt`
    return get(inspectCacheAtom)[target]
  }), [path, nestedIndex])
  return useAtomValue(derievedAtom);
}

atomFamily should work too. (we should remove unused params to avoid memory leaks.)