Commit 8df9707e authored by James Laver's avatar James Laver

Hook changes in preparation for 0.4.0

parent 2634f579
......@@ -66,7 +66,6 @@ Not in any particular order
1. Safe DOM props:
* Make sure each element only takes the correct props
* Translate some props with minimal and efficient wrapping
2. Refs
* Test forwardRef
3. Context
......@@ -89,6 +88,24 @@ Not in any particular order
<!-- * `R.React.provide` - provider a value through a `Provider` -->
<!-- * `R.React.consume` - consume a value through a `Consumer` -->
### 0.4.0
Breaking:
* `useState` now takes a (pure) `Unit -> s` initialiser
* `useState`'s setter function now takes a pure fn `state -> state`.
To get back the old behaviour of setting a value without
regard to its existing value, use `const`.
* `useReducer` now takes a (pure) `i -> s` initialiser
* `useEffect`, `useLayoutEffect` and their numbered variants no longer
take a redundant dummy unit value to delay computation.
### 0.3.1
Bug Fixes:
* `R.DOM.HTML` - more or less everything was broken since we moved out `createDOMElement`
### 0.3.0
Newly supported hooks and variants:
......@@ -109,6 +126,11 @@ Newly supported functions:
* `R.Hooks.nothing` - an empty cleanup function
* `R.Hooks.thenNothing` - make an effect function return an empty cleanup function
Changes:
* `R.createDOMElement` is now how you create DOM elements, we removed
the `R.IsComponent` instance for `String`
Bug Fixes:
* `R.React.render` was broken because the tests don't use it and
......@@ -146,6 +168,13 @@ Notable changes:
* Major refactor to use [ffi-simple](https://github.com/irresponsible/purescript-ffi-simple).
## Thanks
- [Nicolas Pouillard](https://github.com/np), for the discussions that
continue to shape the design of reactix.
- The rest of the [gargantext](https://gitlab.iscpif.fr/gargantext/purescript-gargantext)
team, for their enthusiasm both for reactix and for replacing thermite.
## Copyright and License
Copyright (c) 2018 James Laver
......
This diff is collapsed.
......@@ -21,6 +21,7 @@ import DOM.Simple as DOM
import DOM.Simple.Document as Document
import DOM.Simple.Element as Element
import DOM.Simple.Event as Event
import FFI.Simple (delay)
import Reactix as R
import Reactix.Test as RT
import Reactix.DOM.HTML ( button, div, i, text )
......@@ -50,9 +51,9 @@ counterCpt :: R.Component CounterProps
counterCpt = R.hooksComponent "Counter" cpt
where
cpt {count} _ = do
y /\ setY <- R.useState $ \_ -> pure count
y /\ setY <- R.useState' count
pure $ div { className: "counter" }
[ button { type: "button", onClick: onclick setY (y + 1) } [ text "++" ]
[ button { type: "button", onClick: onclick setY (_ + 1) } [ text "++" ]
, div {} [ text (show y) ] ]
onclick set to = mkEffectFn1 $ \e -> set to
......@@ -148,9 +149,9 @@ type EffectorProps = ( stateRef :: Ref.Ref EffectorState )
effectorCpt :: R.Component EffectorProps
effectorCpt = R.hooksComponent "Effector" cpt
where cpt {stateRef} _ = do
R.useEffect $ \_ -> do
R.useEffect $ do
Ref.write Initialised stateRef
pure $ \_ -> Ref.write Done stateRef
pure $ Ref.write Done stateRef
pure $ div {} []
-- TODO: test it's firing at the right time
......@@ -176,9 +177,9 @@ effectorTest =
layoutEffectorCpt :: R.Component EffectorProps
layoutEffectorCpt = R.hooksComponent "LayoutEffector" cpt
where cpt {stateRef} _ = do
R.useLayoutEffect $ \_ -> do
R.useLayoutEffect $ do
Ref.write Initialised stateRef
pure $ \_ -> Ref.write Done stateRef
pure $ delay unit $ \_ -> Ref.write Done stateRef
pure $ div {} []
-- TODO: test it's firing at the right time
......@@ -222,14 +223,14 @@ themeChooserCpt :: R.Component ThemeChooserProps
themeChooserCpt = R.hooksComponent "ThemeChooser" cpt
where
cpt props _ = do
theme /\ setTheme <- R.useState' $ Nothing
theme /\ setTheme <- R.useState' Nothing
ref <- R.useRef $ R.createContext Nothing
let context = R.readRef ref
pure $
div {}
[ button { type: "button", onClick: onclick setTheme Nothing } [ text "None" ]
, button { type: "button", onClick: onclick setTheme (Just Dark) } [ text "Dark" ]
, button { type: "button", onClick: onclick setTheme (Just Light) } [ text "Light" ]
[ button { type: "button", onClick: onclick setTheme (const Nothing) } [ text "None" ]
, button { type: "button", onClick: onclick setTheme (const $ Just Dark) } [ text "Dark" ]
, button { type: "button", onClick: onclick setTheme (const $ Just Light) } [ text "Light" ]
, R.provideContext context theme [ R.createElement themedCpt { theme: context } [] ] ]
onclick setTheme theme = mkEffectFn1 $ \_ -> setTheme theme
themeChooserTest :: Spec Unit
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment