recoil atom with sync effects

atomWithSyncEffects.ts

import {
  atom,
  atomFamily,
  AtomFamilyOptions,
  AtomOptions,
  ReadWriteSelectorFamilyOptions,
  ReadWriteSelectorOptions,
  selector,
  selectorFamily,
  SerializableParam
} from 'recoil'

export function atomWithEffect<T>(options: AtomOptions<T>, effect: ReadWriteSelectorOptions<T>['set']) {
  const _atom = atom<T>(options)
  return selector<T>({
    key: options.key + '__proxy',
    get: ({ get }) => get(_atom),
    set: (helpers, newValue) => {
      helpers.set(_atom, newValue)
      effect(helpers, newValue)
    }
  })
}

export function atomFamilyWithEffect<T, P extends SerializableParam>(
  options: AtomFamilyOptions<T, P>,
  effect: ReadWriteSelectorFamilyOptions<T, P>['set']
) {
  const _atomFamily = atomFamily<T, P>(options)
  return selectorFamily<T, P>({
    key: options.key + '__proxy',
    get: (parameter) => {
      const _atom = _atomFamily(parameter)
      return ({ get }) => get(_atom)
    },
    set: (parameter) => {
      const _atom = _atomFamily(parameter)
      const _effect = effect(parameter)
      return (helpers, newValue) => {
        helpers.set(_atom, newValue)
        _effect(helpers, newValue)
      }
    }
  })
}