JSPM

  • Created
  • Published
  • Downloads 2533
  • Score
    100M100P100Q119741F
  • License MIT

Reactive library for state management, data fetching, caching

Package Exports

  • mutoid

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (mutoid) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

Mutoid

Reactive library for state management, data fetching, caching (wip) with some utilities to use with React


Installation

To install the last version

yarn add mutoid rxjs fp-ts

if you want use io-ts decoder in data fetching

yarn add io-ts

if you want also use with react

yarn add react-dom react

Note rxjs, fp-ts, io-ts, react are a peer dependency for mutoid


State management

import * as MS from 'mutoid/lib/state'

Create store

const appStore = MS.of({ userName: 'Marco' })

Read the status from anywhere

import { pipe } from 'fp-ts/lib/pipeable'
import * as T from 'fp-ts/lib/Task'
import * as C from 'fp-ts/lib/Console'

const program = pipe(
    MS.toTask(appStore),
    T.map(s => `Hello ${s.userName}`),
    T.chainIOK(C.log)
)

program()

Run mutation

declare const store: Store<S>
declare const mutation: Mutation<(id: number) => (currentState: S) => Observable<S>>
declare const id: number

const runMutation = MS.mutationRunner(appStore, mutation)
runMutation(id)

Data fetching

import * as MH from 'mutoid/lib/http'

ajaxToResource

import * as t from 'io-ts'
import { ajax } from 'rxjs/ajax'

export const somethingDecoders = {
    200: t.array(t.string).decode,
    400: t.string.decode,
}

export type somethingResource = MH.Resource<typeof somethingDecoders>

export const fetchSomething = () => MH.ajaxToResource(ajax('https://api.io'), somethingDecoders)

resourceFetcherToMutation

import { map } from 'rxjs/operators'

export const fetchSomethingMutation = MH.resourceFetcherToMutation(fetchSomething, (o, s: state) =>
    o.pipe(map(c => ({ ...s, something: c })))
)

React hooks

useSelector

const userName = useSelector(appStore, s => s.userName)

useMutation

const fetchQuoteRunner = useMutation(appStore, mutation)

useResourceFetcher

import { ajax } from 'rxjs/ajax'
import * as MH from 'mutoid/lib/http'

const somethingFetcher = () => MH.ajaxToResource(ajax('https://api.io'), decoders)

const [resource, dispatch] = useResourceFetcher(fetchSomething, iniState)

Run example

yarn dev-server

Test

Unit, lint and cs

yarn test

Type level

yarn test-type