cleanup

README.md

@@ -65,9 +65,10 @@ Single Page Applications require us to write two programs: a Javascript client a
 There are frameworks that support this in various languages, including HTMX, Phoenix LiveView, and others. Hyperbole has the following advantages
 
 1. 100% Haskell
-2. Type safe pages, views, actions and routes
-3. Fast updates over sockets using virtual DOM 
-4. Fall-back to HTTP
+2. Type safe views, actions, routes, and forms
+3. Low boilerplate forms
+5. Fast updates over sockets using virtual DOM 
+6. Fall-back to HTTP
 
 An example Page
 ---------------
@@ -230,6 +231,8 @@ Animate transitions using only CSS
 
 ### [Forms](./example/Example/Forms.hs)
 
+Elegant interface for Forms including field-specific validation 
+
 <img src="/example/doc/forms.png" width="300"/>
 
 ### [Sessions](./example/Example/Forms.hs)

example/Example/Contacts.hs

@@ -93,20 +93,15 @@ data ContactAction
   deriving (Show, Read, Param)
 
 
+-- Form Fields
 data FirstName = FirstName Text deriving (Generic, FormField)
 data LastName = LastName Text deriving (Generic, FormField)
 data Age = Age Int deriving (Generic, FormField)
 
 
--- data UserForm a = UserForm
---   { firstName :: Field a Text
---   , lastName :: Field a Text
---   , age :: Field a Int
---   }
---   deriving (Generic, Form)
-
 contact :: (Hyperbole :> es, Users :> es, Debug :> es) => Contact -> ContactAction -> Eff es (View Contact ())
 contact (Contact uid) a = do
+  -- Lookup the user in the database for all actions
   u <- userFind uid
   action u a
  where
@@ -114,14 +109,17 @@ contact (Contact uid) a = do
     pure $ contactView u
   action u Edit = do
     pure $ contactEdit u
-  action u Save = do
+  action _ Save = do
     delay 1000
+    unew <- parseUser
+    userSave unew
+    pure $ contactView unew
+
+  parseUser = do
     FirstName firstName <- formField @FirstName
     LastName lastName <- formField @LastName
     Age age <- formField @Age
-    let u' = User{id = u.id, isActive = True, firstName, lastName, age}
-    userSave u'
-    pure $ contactView u'
+    pure User{id = uid, isActive = True, firstName, lastName, age}
 
 
 contactView :: User -> View Contact ()

example/Example/Forms.hs

@@ -10,7 +10,7 @@ import Web.Hyperbole
 
 page :: (Hyperbole :> es) => Page es Response
 page = do
-  hyper action
+  hyper formAction
 
   load $ do
     pure $ row (pad 20) $ do
@@ -34,8 +34,8 @@ data Pass1 = Pass1 Text deriving (Generic, FormField)
 data Pass2 = Pass2 Text deriving (Generic, FormField)
 
 
-action :: (Hyperbole :> es) => FormView -> FormAction -> Eff es (View FormView ())
-action _ Submit = do
+formAction :: (Hyperbole :> es) => FormView -> FormAction -> Eff es (View FormView ())
+formAction _ Submit = do
   u <- formField @User
   a <- formField @Age
   p1 <- formField @Pass1
@@ -87,9 +87,6 @@ formView v = do
   inp = border 1 . pad 8
 
 
--- inv :: forall a. (Field a) => Validation -> Mod
--- inv = onInvalid @a Style.invalid
-
 userView :: User -> Age -> Pass1 -> View FormView ()
 userView (User user) (Age age) (Pass1 pass1) = do
   el (bold . Style.success) "Accepted Signup"