const choo = require('../../')
const html = require('../../html')

const app = choo()
app.model({
  state: {
    counter: 0
  },
  reducers: {
    increment: (data, state) => ({ counter: state.counter + 1 }),
    decrement: (data, state) => ({ counter: state.counter - 1 })
  }
})

const mainView = (state, prev, send) => {
  return html`
    <main class="app">
      <button onclick=${() => send('increment')}>Increment</button>
      <button onclick=${() => send('decrement')}>Decrement</button>
      <p>state.counter</p>
    </main>
}

app.router((route) => [
  route('/', mainView)
])

document.body.appendChild(app.start())