Router concept

router-concept.md

// trnsitionRequests -> BrowserAPI -> [ resolveRoute -> loadData -> render -> restoreScroll ]

// poor man's strem.flatMapLatest()
router.pipe((payload, next) => {
  next(1)
  next(2)
  return () => {
    // cleanup
  }
})

createRouter(callback => {
  browserHistoryAPI.listen(callback)
})
.pipe(createNestedReactResolver(...))
.pipe(createReactDataLoader(...))
.pipe(createNestedReactRenderer(...))
.pipe(createScrollRestorer(...))

https://gist.github.com/rpominov/20b62ed56c78376c224f

Possible parts

• Matcher: https://github.com/troch/path-parser + ?
• History API: https://github.com/rackt/history
• <Link>: ?
• Scroll: https://github.com/rackt/scroll-behavior ?
• Glue: https://github.com/rpominov/basic-streams ?
• Render nested react components: do we even need nested?
• Data loading: out of scope?

1. source → flatMapLatest → flatMapLatest → flatMapLatest → handler
2. Event = Normal | Error | Redirect | End
3. fmlNormal, fmlError, fmlRedirect, fmlEnd (?)
4. on server source emits a Normal and an End, then we wait for End on other side and use the previous Event
5. fml(a -> Stream<b,c,d> | Event<b,c,d>)

Event = {type: ... | 'END', payload: any}
Middleware = Event -> Event | Stream<Event> | Array<Event>

{type: 'END'} is special Event, we automatically dispose subscription after it. Other types like 'NORMAL', 'ERROR', 'REDIRECT', etc. are up to user (or maybe not, we might need a convention for example if we provide middlewares out of the box, but only END is special anyway)