Restore broken Components*HalogenHooks recipes (#283)

* Restore broken Components*HalogenHooks recipes

* Add missing deps

Author: pete-murphy

README.md

@@ -99,7 +99,10 @@ Running a web-compatible recipe:
 |   | :heavy_check_mark: ([try](https://try.ps.ai/?github=JordanMartinez/purescript-cookbook/master/recipes/CatGifsHalogenHooks/src/Main.purs)) | [CatGifsHalogenHooks](recipes/CatGifsHalogenHooks) | A Halogen port of the ["HTTP - Cat GIFs" Elm Example](https://elm-lang.org/examples/cat-gifs). |
 |   | :heavy_check_mark: ([try](https://try.ps.ai/?github=JordanMartinez/purescript-cookbook/master/recipes/CatGifsReactHooks/src/Main.purs)) | [CatGifsReactHooks](recipes/CatGifsReactHooks) | A React port of the ["HTTP - Cat GIFs" Elm Example](https://elm-lang.org/examples/cat-gifs). |
 |   | :heavy_check_mark: ([try](https://try.ps.ai/?github=JordanMartinez/purescript-cookbook/master/recipes/ClockReactHooks/src/Main.purs)) | [ClockReactHooks](recipes/ClockReactHooks) | A React port of the ["User Interface - Clock" Elm Example](https://elm-lang.org/examples/clock). |
+|   | :heavy_check_mark: ([try](https://try.ps.ai/?github=JordanMartinez/purescript-cookbook/master/recipes/ComponentsHalogenHooks/src/Main.purs)) | [ComponentsHalogenHooks](recipes/ComponentsHalogenHooks) | Demonstrates how to nest one Halogen-Hooks-based component inside another and send/receive queries between the two. |
+|   | :heavy_check_mark: ([try](https://try.ps.ai/?github=JordanMartinez/purescript-cookbook/master/recipes/ComponentsInputHalogenHooks/src/Main.purs)) | [ComponentsInputHalogenHooks](recipes/ComponentsInputHalogenHooks) | Each time a parent re-renders, it will pass a new input value into the child, and the child will update accordingly. |
 |   | :heavy_check_mark: ([try](https://try.ps.ai/?github=JordanMartinez/purescript-cookbook/master/recipes/ComponentsInputReactHooks/src/Main.purs)) | [ComponentsInputReactHooks](recipes/ComponentsInputReactHooks) | Each time the parent's state updates, it will pass a new prop value into the child, and the child will update accordingly. |
+|   | :heavy_check_mark: ([try](https://try.ps.ai/?github=JordanMartinez/purescript-cookbook/master/recipes/ComponentsMultiTypeHalogenHooks/src/Main.purs)) | [ComponentsMultiTypeHalogenHooks](recipes/ComponentsMultiTypeHalogenHooks) | Demonstrates a component that can communicate with its children that have differing types. |
 |   | :heavy_check_mark: ([try](https://try.ps.ai/?github=JordanMartinez/purescript-cookbook/master/recipes/ComponentsMultiTypeReactHooks/src/Main.purs)) | [ComponentsMultiTypeReactHooks](recipes/ComponentsMultiTypeReactHooks) | Demonstrates a parent component with several children components, each with different prop types. |
 |   | :heavy_check_mark: ([try](https://try.ps.ai/?github=JordanMartinez/purescript-cookbook/master/recipes/ComponentsReactHooks/src/Main.purs)) | [ComponentsReactHooks](recipes/ComponentsReactHooks) | Demonstrates how to nest one React Hooks-based component inside another and send props from the parent to the child component. |
 | :heavy_check_mark: | :heavy_check_mark: ([try](https://try.ps.ai/?github=JordanMartinez/purescript-cookbook/master/recipes/DateTimeBasicsLog/src/Main.purs)) | [DateTimeBasicsLog](recipes/DateTimeBasicsLog) | This recipe shows how to use `purescript-datetime` library to create `Time`, `Date`, and `DateTime` values and adjust/diff them. |

broken/ComponentsHalogenHooks/spago.dhall

@@ -0,0 +1,15 @@
+{ name = "ComponentsHalogenHooks"
+, dependencies =
+  [ "console"
+  , "effect"
+  , "halogen"
+  , "halogen-hooks"
+  , "maybe"
+  , "prelude"
+  , "psci-support"
+  , "refs"
+  , "tuples"
+  ]
+, packages = ../../packages.dhall
+, sources = [ "recipes/ComponentsHalogenHooks/src/**/*.purs" ]
+}

broken/ComponentsHalogenHooks/.gitignore recipes/ComponentsHalogenHooks/.gitignorebroken/ComponentsHalogenHooks/.gitignore renamed to recipes/ComponentsHalogenHooks/.gitignore

@@ -3,7 +3,6 @@ module ComponentsHalogenHooks.Main where
 import Prelude hiding (top)
 
 import Data.Maybe (Maybe(..), maybe)
-import Data.Symbol (SProxy(..))
 import Data.Tuple.Nested ((/\))
 import Effect (Effect)
 import Effect.Class (class MonadEffect)
@@ -14,18 +13,19 @@ import Halogen.Aff as HA
 import Halogen.HTML as HH
 import Halogen.HTML.Events as HE
 import Halogen.HTML.Properties as HP
-import Halogen.Hooks (Hooked, UseEffect, UseRef)
+import Halogen.Hooks (type (<>), Hook, UseEffect, UseRef)
 import Halogen.Hooks as Hooks
 import Halogen.VDom.Driver (runUI)
+import Type.Proxy (Proxy(..))
 
 main :: Effect Unit
 main =
   HA.runHalogenAff do
     body <- HA.awaitBody
     void $ runUI containerComponent unit body
 
-_button :: SProxy "button"
-_button = SProxy
+_button :: Proxy "button"
+_button = Proxy
 
 containerComponent
   :: forall unusedQuery unusedInput unusedOutput anyMonad
@@ -37,7 +37,7 @@ containerComponent = Hooks.component \rec _ -> Hooks.do
   buttonState /\ buttonStateIdx <- Hooks.useState (Nothing :: Maybe Boolean)
   Hooks.pure $
     HH.div_
-    [ HH.slot _button unit buttonComponent unit \_ -> Just do
+    [ HH.slot _button unit buttonComponent unit \_ -> do
         Hooks.modify_ toggleCountIdx (_ + 1)
     , HH.p_
         [ HH.text ("Button has been toggled " <> show toggleCount <> " time(s)") ]
@@ -47,8 +47,8 @@ containerComponent = Hooks.component \rec _ -> Hooks.do
             <> (maybe "(not checked yet)" (if _ then "on" else "off") buttonState)
             <> ". "
         , HH.button
-            [ HE.onClick \_ -> Just do
-                mbBtnState <- Hooks.query rec.slotToken _button unit $ H.request IsOn
+            [ HE.onClick \_ -> do
+                mbBtnState <- Hooks.query rec.slotToken _button unit $ H.mkRequest IsOn
                 Hooks.put buttonStateIdx mbBtnState
             ]
             [ HH.text "Check now" ]
@@ -73,7 +73,7 @@ buttonComponent = Hooks.component \rec _ -> Hooks.do
   Hooks.pure $
     HH.button
       [ HP.title label
-      , HE.onClick \_ -> Just do
+      , HE.onClick \_ -> do
           newState <- Hooks.modify enabledIdx not
           Hooks.raise rec.outputToken $ Toggled newState
       ]
@@ -82,7 +82,7 @@ buttonComponent = Hooks.component \rec _ -> Hooks.do
 useRenderCount
   :: forall m a
    . MonadEffect m
-  => Hooked m a (UseEffect (UseRef Int a)) Int
+  => Hook m (UseRef Int <> UseEffect <> a) Int
 useRenderCount = Hooks.do
   renders /\ rendersRef <- Hooks.useRef 1
   Hooks.captures {} Hooks.useTickEffect do