Observable

This is ultimately what is always consumed in React Zedux. An observable or a StoreApi may be passed to createContext(). But since a StoreApi is just a wrapper around an observable, observables are what it all comes down to.

Definition

interface Observable<TState> {
  getState?(): TState
  subscribe(observer: Observer<TState>): { unsubscribe(): void } | (() => void)
}

Observables can take many forms. But they must have a subscribe() function that accepts an observer function. The observer should be called every time the observable emits (for a store, that's when the store's state updates).

They can return either:

• A function that can be called to unsubscribe from the observable.
• An object containing an unsubscribe() property that can be called to unsubscribe from the observable.

If the observer is not passed the new state, React Zedux will try to call the observable's optional getState() method to retrieve the new state. This is because Redux. Yep.

Examples

The following are all valid observables:

import { Observable } from 'rxjs'

const state$ = Observable.interval(1000)

import { BehaviorSubject } from 'rxjs'

const state$ = new BehaviorSubject()

import { createStore } from 'zedux'

const store = createStore()

import { createStore } from 'redux'
import rootReducer from './rootReducer'

const store = createStore(rootReducer)

import { createStore } from 'redux'
import { Observable } from 'rxjs'
import rootReducer from './rootReducer'

const store = createStore(rootReducer)
const state$ = Observable.from(store)

These can all be passed directly to createContext() or set as a StoreApi's store prop.