Skip to main content

Redux Compatibility

asReduxStore​

It is possible to transform a mobx-keystone tree node into a read-only Redux compatible store (this is, without an action dispatcher).

const todoListReduxStore = asReduxStore(todoList)

Such store will have some of the usual Redux store methods:

  • getState() is a thin wrapper over getSnapshot(storeTarget).
  • subscribe(listener) will use onSnapshot(storeTarget, listener) and return a disposer.

connectReduxDevTools​

It is also possible to connect a store to some Redux DevTools monitor thanks to the connectReduxDevTools function and the remotedev package. Note that the only action being logged will be "onSnapshot" whenever a new snapshot is created.

import * as remotedev from "remotedev"
// or
const remotedev = require("remotedev")

// create a connection to the monitor (for example with `connectViaExtension`)
const connection = remotedev.connectViaExtension({
  name: "my cool store",
})

connectReduxDevTools(remotedev, connection, todoList)

If you want to see it in action feel free to check the Todo List Example, open the Redux DevTools and perform some actions.