forked from vercel/next.js
/
index.js
36 lines (32 loc) · 938 Bytes
/
index.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
import React from 'react'
import { useMachine } from '@xstate/react'
import { Counter, Toggle } from '../components'
import { toggleMachine } from '../machines/toggleMachine'
import { counterMachine } from '../machines/counterMachine'
const IndexPage = ({ count }) => {
const [toggleCurrent, toggleSend] = useMachine(toggleMachine)
const [counterCurrent, counterSend] = useMachine(counterMachine, {
context: { count },
})
return (
<div>
<Counter
counter={{
count: counterCurrent.context.count,
increment: () => counterSend('INC'),
decrement: () => counterSend('DEC'),
reset: () => counterSend('RESET'),
}}
/>
<hr />
<Toggle
onToggle={() => toggleSend('TOGGLE')}
active={toggleCurrent.matches('active')}
/>
</div>
)
}
IndexPage.getInitialProps = async () => {
return { count: 999 }
}
export default IndexPage