orbit-state-tree

State tree manager based on Orbit.js

Usage no npm install needed!

<script type="module">
  import orbitStateTree from 'https://cdn.skypack.dev/orbit-state-tree';
</script>

README

Orbit state tree

Library based on OrbitJS that manages a single state tree to be used on Flux stores (Redux and Vuex)

Basic usage

const {StateTree, recordSelector, requestSelector} = require('orbit-state-tree')
const {Schema} = require('@orbit/data')
const Store = require('@orbit/store').default

const schema = new Schema({
  models: {
    planet: {
      attributes: {
        name: { type: 'string' },
        classification: { type: 'string' }
      },
      relationships: {
        moons: { type: 'hasMany', model: 'moon', inverse: 'planet' }
      }
    },
    moon: {
      attributes: {
        name: { type: 'string' }
      },
      relationships: {
        planet: { type: 'hasOne', model: 'planet', inverse: 'moons' }
      }
    }
  }
})

const store = new Store({schema})
const stateTree = new StateTree({
  schema: schema,
  store: store,
})

let appState = {} // Your app state tree
let result = stateTree.addRecord('planet', {id: '1', name: 'Mars', classification: 'terrestrial'})
stateTree.addRecord('moon', {id: '1', name: 'Phobos', planet: {id: 1}})
stateTree.addRecord('moon', {id: '2', name: 'Deimos', planet: {id: 1}})

stateTree.onChange(data => {
  appState = Object.assign({}, appState, {api: data})
  console.log('record', recordSelector(appState.api, 'planet', '1')) // Return an resource if its already loaded
  console.log('request', requestSelector(appState.api, result.requestId))
})

Tree structure example

    {
        entities: {
            articles: {
                '1': {
                    attributes: {
                        id: '1',
                        title: 'title'
                    },
                    relationships: {
                        author: {type: 'users', id: '2'}
                    }
                }
            },
            users: {
                '2': {
                    attributes: {
                        id: '42',
                        name: 'John'
                    }
                }
            }
        },
        requests: {
            d99e3c57: {
                id: 'd99e3c57',
                completed: false,
                results: {
                    articles: ['1']
                },
                error: {}
            }
        }
    }