atomWithAsyncStorage

[michaelwoelk]

I needed to use atomWithStorage, but ran into issues where all components using the atom either re-rendered, triggered fetches twice, or stayed stuck on the initial value. This happened because atomWithStorage isn't async by default.
So I created this:

/**
 * Creates an atom with ASYNC localStorage support
 */
export const atomWithAsyncStorage = <T>(key: string, initialValue: T) => {
  return atomWithStorage<T>(key, initialValue, {
    getItem: async (key: string): Promise<string | null> => {
      return window.localStorage.getItem(key);
    },
    setItem: async (key: string, newValue: string): Promise<void> => {
      window.localStorage.setItem(key, newValue);
    },
    removeItem: async (key: string): Promise<void> => {
      window.localStorage.removeItem(key);
    },
  }, { getOnInit: true });
};

Does Jotai offer an official solution for this directly?