2017-01-15 notes

README.md

• "Laws" test suite: run flowtyped functions to verify that a "monoid" (for example) really follows the laws for its empty and concat operations.

album-app-types.js

type Session = {
  username: Maybe String
  authToken: String
}

type State = LoginState | IndexState | AlbumState

type LoginState = {
  type: Symbol.for('Login'),
  username: String,
  password: String
}

type RouteAction = {
  type: Symbol.for('ROUTE'),
  payload: DOMLocation
}

coreReducer = (state, action) => {
  switch (action.type) {
    case 'ROUTE':
      return

    default:
      switch (state.type) {
        case 'Login':
          return loginReducer(state, action)

        case
      }
  }
}


({next}) => {window.app = next}
  state,
  actions: [
    {
      type: atom('LOCATION'),
      payload: 
    }
  ]
})

isomorphic.js

// <script>
if (document && document.body) { document.body.innerHTML = '' }

misc.js

const location = arrow((reducer) => arrow((state, action) => {
  return reducer(state, action)
}))

const reducer = compose(
  location,
  auth
)(x => x)

reduce((state, action)
({state, action})
              
Action Location -> Reducer -> Effects
       
const dom = () => {
  let onSubmit = (e) => next({type: 'LOGIN', ...})

  cell(({state, next}) => {
    return {
      View: state.session != null ? state.location : LoginComponent,
      onSubmit
      ...stuff
    }
  }, cell(({View, ...stuff}) => element(View, stuff), cell(render, id))

const dom = cell(({state}) => {
  return state.location
}, cell((location) => {
  return {
    type: 'div',
    props: [],
    children: [
      {text: location}
    ]
  }
}, cell((tree) => 
  render(tree, document.getElementById('root')),
  id
)))

render.js

const render = (tree, target) => {}

if (typeof tree === 'string') return target.appendChild

const element = document.createElement(tree.type)

tree.children.forEach(

cell :: (f -> a) -> lens -> cell -> b

lensedCell :: (lens, f) -> x ->
 
let theNext = () => {}
const onClick = () => theNext({type: 'CLICK'})

const effectCell = (effect, child) => {
 let theNext = () => {}
 const listener = effect(theNext)
 
 return cell(({next, state}) => {
   theNext = next
   return listener(state)
 }, child)
}

effectCell((next) => (state) => {})

effectCell((next) => (state) => ({
    type: 'div',
    props: [{name: 'onClick', value: onClick}],
    children: []
  }),
  cell(
    loopArrow((prev, next) => equals(prev, next) ? prev : next, {}), 
    (element) => render(element, document.getElementById('root'))
  )
)

cell(
  loopArrow((prev, next) => equals(prev, next) ? prev : next, {}), 
  (element) => render(element, document.getElementById('root'))
)

const effect = (effect) => {
 let theNext = () => {}
 const listener = effect(theNext)
 
 return ({next, state}) => {
   theNext = next
   return listener(state)
 })
}

effect((next) => cell((state) => ({
    type: 'div',
    props: [{name: 'onClick', value: onClick}],
    children: []
  }),
  cell(
    loopArrow((prev, next) => equals(prev, next) ? prev : next, {}), 
    (element) => render(element, document.getElementById('root'))
  ))
)

effect(
 (next) => {
   const onClick = () => next({type: 'CLICKED'})

   return cell((state) => ({
     type: 'div',
     props: [{name: 'onClick', value: onClick}],
     children: []
   }),
   cell(
     loopArrow((prev, next) => equals(prev, next) ? prev : next, {}), 
     (element) => render(element, document.getElementById('root'))
   ))
 }
)

toEffect = (a -> b -> c) -> (a, b)
const alsdfjasdf = toEffect(stateful => stateless => console.log(stateful, stateless))

alsdfjasdf({a: 2}, 6)
alsdfjasdf({a: 2}, 6)
alsdfjasdf(next, state)

tessellation-app.js

import {arrow} from 'zazen/arrow'
import {
  apply,
  compose,
  map,
  flatten
} from 'ramda'

const store = arrow( app => ({
  ...app,
  state: app.actions.reduce(app.reducer, app.state)
}))

const next = previous_app => (...actions) => {
  return actions.length > 0 ?
    app({...previous_app, actions}) :
    previous_app
}

const app = store
  .pipe( app => ({
    ...app,
    next: next(app)
  }) )
  .pipe( ({state, next, effects}) => {
    return compose(
      apply(next),
      flatten,
      map( e => e({state, next}) )
    )(effects)
  })