Skip to content

Add setup function, to wrap componentDidMount #10

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 11 commits into from
Feb 21, 2018
Merged
3 changes: 2 additions & 1 deletion README.md
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@

This package implements an opinionated set of bindings to the React library, optimizing for the most basic use cases.

## Features
## Features

- All React DOM elements and attributes are supported.
- An intuitive API for specifying props - no arrays of key value pairs, just records.
Expand Down Expand Up @@ -42,6 +42,7 @@ type ExampleState =
example :: R.ReactComponent ExampleProps
example = R.react
{ initialState: \_ -> { counter: 0 }
, setup: \_ _ _ -> pure unit
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

this should be receiveProps?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yes, thanks!

, render: \{ label } { counter } setState ->
R.button { onClick: mkEffFn1 \_ -> do
setState { counter: counter + 1 }
Expand Down
2 changes: 1 addition & 1 deletion generated-docs/React/Basic.md
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@
#### `react`

``` purescript
react :: forall props state. { initialState :: state, render :: props -> state -> (state -> Eff (react :: ReactFX) Unit) -> JSX } -> ReactComponent props
react :: forall props state. { initialState :: props -> state, setup :: props -> state -> (state -> Eff (react :: ReactFX) Unit) -> Eff (react :: ReactFX) Unit, render :: props -> state -> (state -> Eff (react :: ReactFX) Unit) -> JSX } -> ReactComponent props
```

Create a React component from a _specification_ of that component.
Expand Down
8 changes: 8 additions & 0 deletions src/React/Basic.js
Original file line number Diff line number Diff line change
Expand Up @@ -7,6 +7,14 @@ exports.react_ = function(spec) {
getInitialState: function() {
return spec.initialState(this.props);
},
componentDidMount: function() {
var this_ = this;
spec.setup(this.props, this.state, function(newState) {
return function() {
this_.setState(newState);
};
});
},
render: function() {
var this_ = this;
return spec.render(this.props, this.state, function(newState) {
Expand Down
10 changes: 9 additions & 1 deletion src/React/Basic.purs
Original file line number Diff line number Diff line change
Expand Up @@ -7,6 +7,7 @@ module React.Basic
import Prelude

import Control.Monad.Eff (Eff, kind Effect)
import Control.Monad.Eff.Uncurried (EffFn3, mkEffFn3)
import Data.Function.Uncurried (Fn3, mkFn3)
import React.Basic.DOM as React.Basic.DOM
import React.Basic.Types (CSS, EventHandler, JSX, ReactComponent, ReactFX)
Expand All @@ -15,6 +16,7 @@ import React.Basic.Types as React.Basic.Types
foreign import react_
:: forall props state
. { initialState :: props -> state
, setup :: EffFn3 (react :: ReactFX) props state (state -> Eff (react :: ReactFX) Unit) Unit
, render :: Fn3 props state (state -> Eff (react :: ReactFX) Unit) JSX
}
-> ReactComponent props
Expand All @@ -31,7 +33,13 @@ foreign import react_
react
:: forall props state
. { initialState :: props -> state
, setup :: props -> state -> (state -> Eff (react :: ReactFX) Unit) -> Eff (react :: ReactFX) Unit
, render :: props -> state -> (state -> Eff (react :: ReactFX) Unit) -> JSX
}
-> ReactComponent props
react { initialState, render } = react_ { initialState, render: mkFn3 render }
react { initialState, setup, render } =
react_
{ initialState
, setup: mkEffFn3 setup
, render: mkFn3 render
}