useSubscription (#30)

examples/package.json

@@ -21,7 +21,7 @@
   "license": "MIT",
   "dependencies": {
     "esbuild": "^0.14.1",
-    "purescript": "^0.15.13",
+    "purescript": "^0.15.15",
     "react": "^17.0.2",
     "react-dom": "^17.0.2",
     "spago": "^0.21.0",

package.json

@@ -35,7 +35,7 @@
   "devDependencies": {
     "@happy-dom/global-registrator": "7.4.0",
     "pulp": "^16.0.0",
-    "purescript": "^0.15.13",
+    "purescript": "^0.15.15",
     "react": "^17.0.2",
     "react-dom": "^17.0.2",
     "spago": "^0.21.0"

packages.dhall

@@ -1,7 +1,5 @@
 let upstream =
-      https://raw.githubusercontent.com/purescript/package-sets/psc-0.15.13-20231201/src/packages.dhall
-        sha256:706a855400108a03b35bd37afe7f50802deed882c555171d266338d4694ddbe8
+      https://raw.githubusercontent.com/purescript/package-sets/psc-0.15.15-20240711/src/packages.dhall
+        sha256:81881d9e15484551b4293ab0a2639355f38d0cab1dfa49a077b5f1af374c292a
 
 in  upstream
-  with elmish.version = "v0.11.1"
-  with elmish-html.version = "v0.8.2"

src/Elmish/Hooks.purs

@@ -20,9 +20,11 @@ module Elmish.Hooks
   , module UseEffect
   , module UseRef
   , module UseState
+  , module UseSubscription
   ) where
 
 import Elmish.Hooks.Type (Hook, HookType, type (<>), bind, component, discard, mkHook, pure, (==>), (=/>)) as Type
 import Elmish.Hooks.UseEffect (UseEffect, useEffect, useEffect') as UseEffect
 import Elmish.Hooks.UseRef (UseRef, useRef) as UseRef
 import Elmish.Hooks.UseState (UseState, useState) as UseState
+import Elmish.Hooks.UseSubscription (UseSubscription, useSubscription) as UseSubscription

src/Elmish/Hooks/UseState.purs

@@ -24,7 +24,7 @@ foreign import data UseState :: Type -> HookType
 -- |   visible /\ setVisible <- useState false
 -- |   Hooks.pure $
 -- |     H.fragment
--- |     [ H.button_ "" { onClick: setVisible $ not visible } "Toggle visibility"
+-- |     [ H.button_ "" { onClick: setVisible <| not visible } "Toggle visibility"
 -- |     , if visible
 -- |         then H.div "" "Content"
 -- |         else H.empty

src/Elmish/Hooks/UseSubscription.purs

@@ -0,0 +1,38 @@
+module Elmish.Hooks.UseSubscription
+  ( UseSubscription
+  , useSubscription
+  ) where
+
+import Prelude
+
+import Effect.Aff (Aff)
+import Elmish.Component (ComponentName(..))
+import Elmish.Hooks.Type (Hook, HookType, mkHook)
+import Elmish.Subscription (Subscription)
+import Elmish.Subscription as Sub
+
+foreign import data UseSubscription :: Type -> HookType
+
+-- | Subscribes to the given subscription and calls the provided callback every
+-- | time the subscription yields a value.
+-- |
+-- | ```purs
+-- | listenToNetwork :: Subscription Aff NetworkSignal
+-- | listenToNetwork = ...
+-- |
+-- | view :: ReactElement
+-- | view = Hooks.component Hooks.do
+-- |   lastSignal /\ setLastSignal <- Hooks.useState Nothing
+-- |   useSubscription listenToNetwork \signal -> setLastSignal (Just signal)
+-- |   Hooks.pure $
+-- |     case lastSignal of
+-- |       Nothing -> H.div "bg-secondary" "Waiting for signal..."
+-- |       Just signal -> H.div "bg-success" $ "Received signal: " <> show signal
+-- | ```
+useSubscription :: ∀ a. Subscription Aff a -> (a -> Aff Unit) -> Hook (UseSubscription a) Unit
+useSubscription subscription onValue =
+  mkHook (ComponentName "UseSubscription") \render ->
+    { init: subscription # Sub.quasiBind onValue # Sub.subscribe identity
+    , update: \_ _ -> pure unit
+    , view: \_ _ -> render unit
+    }