diff --git a/src/storage/index.ts b/src/storage/index.ts index f151b57884..db8f6969c4 100644 --- a/src/storage/index.ts +++ b/src/storage/index.ts @@ -1,5 +1,6 @@ import {useCallback, useEffect, useState, useRef, useId} from 'react' import {MMKV} from 'react-native-mmkv' +import EventEmitter from 'eventemitter3' import {type Account, type Device} from '#/storage/schema' import {logger} from '#/components/PolicyUpdateOverlay/logger' @@ -14,6 +15,8 @@ export class Storage { protected sep = ':' protected store: MMKV + protected events = new EventEmitter() + constructor({id}: {id: string}) { this.store = new MMKV({id}) } @@ -30,6 +33,7 @@ export class Storage { ): void { // stored as `{ data: }` structure to ease stringification this.store.set(scopes.join(this.sep), JSON.stringify({data})) + this.events.emit('change', scopes.join(this.sep)) } /** @@ -55,6 +59,7 @@ export class Storage { */ remove(scopes: [...Scopes, Key]) { this.store.delete(scopes.join(this.sep)) + this.events.emit('change', scopes.join(this.sep)) } /** @@ -83,11 +88,20 @@ export class Storage { scopes: [...Scopes, Key], callback: () => void, ) { - return this.store.addOnValueChangedListener(key => { + const handler = (key: string) => { if (key === scopes.join(this.sep)) { callback() } - }) + } + this.events.on('change', handler) + return () => { + this.events.off('change', handler) + } + // return this.store.addOnValueChangedListener(key => { + // if (key === scopes.join(this.sep)) { + // callback() + // } + // }) } } @@ -141,13 +155,17 @@ export function useStorage< // }, [value, scopes]) useEffect(() => { + if (debug) logger.debug(`${debug} - subscribe`) const sub = storage.addOnValueChangedListener(scopes, () => { if (debug) logger.debug(`${debug} - storage change`, { value: storage.get(scopes) ?? 'unset', }) setValue(storage.get(scopes)) }) - return () => sub.remove() + return () => { + if (debug) logger.debug(`${debug} - unsubscribe`) + sub() + } }, [storage, scopes]) const setter = useCallback(