MobX utilities: store management with createStore / createRootStore, serialization, LocalForage-based state persistence, and JWT helpers.
yarn add @js-toolkit/mobx-utils
# or
npm install @js-toolkit/mobx-utils Requires mobx as a peer dependency.
import { createStore , createRootStore , attachSelectors } from '@js-toolkit/mobx-utils/store/object' ; import { serialize } from '@js-toolkit/mobx-utils/serialization/serialize' ; Store Management (store/object) Export Description createStoreCreate a MobX store with init, update, reset, getSnapshot createRootStoreCreate a root store that manages child stores attachSelectorsAttach computed selectors to a root store updateStateUpdate store state with a patch getSnapshotGet a plain JS snapshot of store state isStore, isRootStoreType guards
Serialization (serialization/serialize) Export Description serializeRecursively serialize objects (handles dates, Option, custom serializers)
Export Description saveStoreStateSave a single store state to LocalForage saveRootStateSave multiple stores to LocalForage getStoreStateRetrieve store state from LocalForage (returns Option)
Export Description decodeTokenDecode JWT token (returns Option) isExpiredCheck if JWT token is expired
Export Description hasInType-safe wrapper around MobX has isArrayType guard for arrays (including MobX observable arrays)
import { observable } from 'mobx' ; import { createStore , createRootStore , attachSelectors } from '@js-toolkit/mobx-utils/store/object' ; const root = createRootStore ( { auth : createStore ( { token : '' , username : '' , } ) , ui : createStore ( { theme : 'light' as 'light' | 'dark' , items : [ ] as string [ ] , } , { items : observable . shallow , } ) , } ) ; const store = attachSelectors ( root , { get isLoggedIn ( ) : boolean { return root . auth . token . length > 0 ; } , } ) ; store . auth . update ( { token : 'abc123' } ) ; console . log ( store . isLoggedIn ) ; // true store . auth . reset ( ) ; import { serialize } from '@js-toolkit/mobx-utils/serialization/serialize' ; const snapshot = serialize ( store . auth ) ; Persist and restore state import { saveStoreState , getStoreState } from '@js-toolkit/mobx-utils/storage' ; await saveStoreState < typeof root > ( 'auth' , root . auth ) ; const saved = await getStoreState < typeof root > ( 'auth' ) ; if ( saved . nonEmpty ( ) ) { root . auth . update ( saved . get ( ) ) ; } import { decodeToken } from '@js-toolkit/mobx-utils/auth/decodeToken' ; import { isExpired } from '@js-toolkit/mobx-utils/auth/isExpired' ; const decoded = decodeToken ( token ) ; if ( decoded . nonEmpty ( ) && ! isExpired ( decoded . get ( ) ) ) { // token is valid } https://github.com/vlazh/mobx-utils