JSPM

  • Created
  • Published
  • Downloads 2533
  • Score
    100M100P100Q119678F
  • License Apache-2.0

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

working in progress library for:

1 _ state management
2 _ data fetching
3 _ caching (wip)

and exports some utilities to use with React



Installation

To install the stable version

yarn add mutoid rxjs fp-ts

if you want use io-ts decoder

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



1 _ State management

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

Create store

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

Use state value from everywhere and log

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 mutation: Mutation<(id: number) => (currentState: S) => Observable<S>>
declare const id: number

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


2 _ 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)

ajaxToMutation

import { map } from 'rxjs/operators'

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


React hooks

useSelector

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

useDispatch

const fetchQuoteDispatch = useDispatch(appStore, mutation)

useFetchResource

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

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

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


Run example

yarn dev-server