Just added a neat little feature that enables the router to render different layout templates depending.

// app/router/sync/routes.js
exports.create = (api) => {
  return nest('router.sync.routes', (acc = []) => {
    const { secrets, settings, layouts } = api.app.views

    const routes = [
      // if we don't specify a route, it defaults to layouts/index
      [ SecretsIndexPath, { view: secrets.index } ],
      [ SecretsShowPath, { view: secrets.show } ],
      // we specify a different layout...
      [ SettingsIndexPath, { view: settings.account.index, layout: layouts.settings } ],
      [ SettingsAccountIndexPath, { view: settings.account.index, layout: layouts.settings } ],
      [ SettingsNetworkIndexPath, { view: settings.network.index, layout: layouts.settings } ]
    ]

    return [...acc, ...routes]
  })
}

// app/router/async/router.js
exports.create = (api) => {
  function Router () {
    const routes = api.router.sync.routes()

    return (request, cb) => {
      const route = routes.find(([validator]) => validator(request))
      if (route) {
        var { view, layout } = route[1]
        if (!layout) layout = api.app.views.layouts.index
        // create the views together, yield the relevant view as child elements to the layout
        cb(null, layout(request, [ view(request) ]))
      }
    }
  }
}

// app/views/layouts/index.js
exports.create = (api) => {
  return nest('app.views.layouts.index', layoutIndex)

  function layoutIndex (request, children) {
    return h('article', [
      NavBar({
        routeTo: api.router.sync.goTo,
        goBack: api.router.sync.goBack,
        currentPath: request.path
      }),
      ViewTabs([
        { name: 'secrets', routeTo: () => api.router.sync.goTo({ path: `/secrets` }), class: 'active' },
        { name: 'shards', routeTo: () => api.router.sync.goTo({ path: `/shards` }) }
      ]),
      // render the view...
      ...children
    ])
  }
}