onRequest event instead of view

CHANGELOG.md

@@ -1,5 +1,9 @@
 # Revision history for hyperbole
 
+## 0.4.2 -- UNRELEASED
+
+* TODO: What changed?
+
 ## 0.3.6 -- 2024-05-21
 
 * First version. Released on an unsuspecting world.

example/Example/Contact.hs

@@ -2,6 +2,7 @@
 
 module Example.Contact where
 
+import Data.Function ((&))
 import Data.String.Conversions
 import Data.Text (Text, pack)
 import Effectful
@@ -12,6 +13,7 @@ import Example.Effects.Users (User (..), UserId, Users)
 import Example.Effects.Users qualified as Users
 import Example.Style qualified as Style
 import Web.Hyperbole
+import Web.View.Style (addClass, cls, prop)
 
 
 -- Example adding a reader context to the page, based on an argument from the AppRoute
@@ -104,7 +106,9 @@ contactView' edit u = do
 
 
 contactEdit :: User -> View Contact ()
-contactEdit u = onRequest contactLoading $ contactEdit' View Save u
+contactEdit u = do
+  el (hide . onRequest flexCol) contactLoading
+  el (onRequest hide) $ contactEdit' View Save u
 
 
 contactEdit' :: (ViewId c, ViewAction (Action c)) => Action c -> Action c -> User -> View c ()

example/Example/Contacts.hs

@@ -44,7 +44,11 @@ instance (Users :> es, Debug :> es) => HyperView Contacts es where
     | AddUser
     | DeleteUser UserId
     deriving (Show, Read, ViewAction)
+
+
   type Require Contacts = '[InlineContact]
+
+
   handle = \case
     Reload mf -> do
       us <- Users.all
@@ -138,6 +142,7 @@ contactView = contactView' Edit
 -- See how we reuse the contactEdit' and contactLoading from Example.Contact
 contactEdit :: User -> View InlineContact ()
 contactEdit u = do
-  onRequest contactLoading $ col (gap 10) $ do
+  el (hide . onRequest flexCol) contactLoading
+  col (onRequest hide . gap 10) $ do
     contactEdit' View Save u
     target Contacts $ button (DeleteUser u.id) (Style.btn' Danger . pad (XY 10 0)) (text "Delete")

hyperbole.cabal

@@ -5,7 +5,7 @@ cabal-version: 2.2
 -- see: https://github.com/sol/hpack
 
 name:           hyperbole
-version:        0.4.1
+version:        0.4.2
 synopsis:       Interactive HTML apps using type-safe serverside Haskell
 description:    Interactive HTML applications using type-safe serverside Haskell. Inspired by HTMX, Elm, and Phoenix LiveView
 category:       Web, Network

package.yaml

@@ -1,5 +1,5 @@
 name:               hyperbole
-version:            0.4.1
+version:            0.4.2
 synopsis:           Interactive HTML apps using type-safe serverside Haskell
 homepage:           https://github.com/seanhess/hyperbole
 github:             seanhess/hyperbole

src/Web/Hyperbole/View/Event.hs

@@ -5,7 +5,7 @@ module Web.Hyperbole.View.Event where
 import Data.Text (Text, pack)
 import Data.Text qualified as T
 import Web.Hyperbole.HyperView
-import Web.View (Mod, View, addContext, att, el, flexCol, hide, parent)
+import Web.View (Mod, View, addContext, att, parent)
 import Web.View.Types (Content (Node), Element (..))
 import Web.View.View (viewModContents)
 
@@ -50,20 +50,17 @@ toActionInput con =
   T.dropEnd 3 $ toAction $ con ""
 
 
-{- | Give visual feedback when an action is in flight.
+{- | Apply a Mod only when a request is in flight
 
 @
 myView = do
-  onRequest loadingIndicator $ do
-    'el_' \"Loaded\"
-  where
-    loadingIndicator = 'el_' "Loading..."
+  el (hide . onRequest flexCol) 'el_' "Loading..."
+  el (onRequest hide) "Loaded"
 @
 -}
-onRequest :: View id () -> View id () -> View id ()
-onRequest a b = do
-  el (parent "hyp-loading" flexCol . hide) a
-  el (parent "hyp-loading" hide . flexCol) b
+onRequest :: Mod id -> Mod id
+onRequest f = do
+  parent "hyp-loading" f
 
 
 -- | Internal