zustand を chrome 拡張の storage で永続化する

zustand-persisting-chrome.md

StateStorage を実装することで自由なストレージを設定できる。

• https://github.com/pmndrs/zustand/blob/main/docs/integrations/persisting-store-data.md#how-can-i-use-a-custom-storage-engine

import { StateStorage } from 'zustand/middleware';

export const zustandChromeStorage: StateStorage = {
    getItem(name) {
        return new Promise((resolve) => {
            chrome.storage.local.get([name], (result) => {
                resolve(result[name]);
            });
        });
    },
    setItem(name, value) {
        return new Promise((resolve) => {
            chrome.storage.local.set({ [name]: value }, () => {
                resolve();
            });
        });
    },
    removeItem(name) {
        return new Promise((resolve) => {
            chrome.storage.local.remove([name], () => {
                resolve();
            });
        });
    },
};