pux-react-interop.purs

module Main where

import Prelude hiding (div)
import Control.Monad.Eff (Eff)
import Pux (CoreEffects, EffModel, start)
import Pux.DOM.Events (onClick)
import Pux.DOM.HTML (HTML)
import Pux.Renderer.React (renderToDOM, renderToReact)
import Text.Smolder.HTML (button, div, span)
import Text.Smolder.Markup (text, (#!))

import React (ReactClass)

data Event
	= Increment
	| Decrement

type State = Int

foldp :: forall fx. Event -> State -> EffModel State Event fx
foldp Increment n = { state: n + 1, effects: [] }
foldp Decrement n = { state: n - 1, effects: [] }

view :: State -> HTML Event
view count =
	div do
		button #! onClick (const Increment) $ text "Increment"
		span $ text (show count)
		button #! onClick (const Decrement) $ text "Decrement"

toReact :: forall props fx. Eff (CoreEffects fx) (ReactClass props)
toReact state = do
  app <- start
    { initialState: state
    , view
    , foldp
    , inputs: []
    }

  pure $ renderToReact app.markup app.input