From 090ce071f7e36cf3d28d5881f28a7a127d4ccae4 Mon Sep 17 00:00:00 2001 From: Brandon Elam Barker Date: Mon, 22 Jul 2019 23:40:43 +0000 Subject: [PATCH] finished first pass of save button --- app/src/Metajelo/FormUtil.purs | 46 +++++++++++++++++-- .../Metajelo/Forms/InstitutionContact.purs | 22 ++------- 2 files changed, 44 insertions(+), 24 deletions(-) diff --git a/app/src/Metajelo/FormUtil.purs b/app/src/Metajelo/FormUtil.purs index c942823..3b8c54e 100644 --- a/app/src/Metajelo/FormUtil.purs +++ b/app/src/Metajelo/FormUtil.purs @@ -1,6 +1,6 @@ module Metajelo.FormUtil where -import Prelude (class Show, Void, bind, join, pure, show, (+), (-), ($), (<$>), (<#>), (<<<)) +import Prelude (class Show, Void, bind, join, pure, show, (+), (-), ($), (<$>), (<#>), (<<<), (==), (||)) import Concur.Core (Widget) import Concur.React (HTML) @@ -26,12 +26,14 @@ import Metajelo.Types as M import Metajelo.Validation as V import Metajelo.XPaths.Read as MR import Prim.Row (class Cons) +import Prim.RowList (class RowToList) import React.SyntheticEvent (SyntheticMouseEvent) import Text.Email.Validate (EmailAddress) -- Note: Common practice to use `Void` to represent "no error possible" type MKFState form = F.State form (Widget HTML) +type MKValidators form = form Record (F.Validation form (Widget HTML)) -- | No validation is needed for this field type, as the input and ouput -- | types (`io`) are the same. @@ -43,7 +45,7 @@ mayToString Nothing = "" emptyMeansOptional :: forall a. Show a => Maybe a -> String emptyMeansOptional mayV = case mayV of - Nothing -> "(optional)" + Nothing -> "(None)" x -> mayToString x menu :: forall opt s form e o restF restI inputs fields @@ -78,7 +80,41 @@ instance isOptionMaybeInstitutionContactType fromOptionValue = join <<< hush <<< MR.readInstitutionContactType formSaveButton :: forall form. MKFState form -> Widget HTML SyntheticMouseEvent -formSaveButton fstate = - if fstate.dirty then D.button [P.onClick] [D.text "Save"] - else D.button [P.disabled true] [D.text "Saved"] +formSaveButton fstate = D.button props [D.text "Save"] + where props = if fstate.dirty then [P.onClick] else [P.disabled true] + +-- t1: inputs +-- t2: ? +-- t3: fields +-- t4: form + + +--TODO: this is in formless-independent +-- | Initialise the form state with default values. +-- | Passing in the initial inputs, and the validations. +initFormState + :: ∀ ixs form is fs m + . RowToList is ixs + => Internal.InputFieldsToFormFields ixs is fs + => Newtype (form Record F.InputField) { | is } + => Newtype (form Record F.FormField) { | fs } + => form Record F.InputField + -> form Record (F.Validation form m) + -> F.State form m +initFormState form validations = + { validity: F.Incomplete + , dirty: false + , submitting: false + , errors: 0 + , submitAttempts: 0 + , form: Internal.inputFieldsToFormFields form + , internal: F.InternalState + { initialInputs: form + , validators: validations + , allTouched: false + -- TODO + -- , debounceRef: ... + -- , validationRef: ... + } + } diff --git a/app/src/Metajelo/Forms/InstitutionContact.purs b/app/src/Metajelo/Forms/InstitutionContact.purs index d1dbfb0..b33e544 100644 --- a/app/src/Metajelo/Forms/InstitutionContact.purs +++ b/app/src/Metajelo/Forms/InstitutionContact.purs @@ -16,7 +16,7 @@ import Data.Monoid (mempty) import Data.Newtype (class Newtype) import Formless as F import Formless.Internal.Transform as Internal -import Metajelo.FormUtil (IdentityField, MKFState, formSaveButton, menu) +import Metajelo.FormUtil (IdentityField, MKFState, MKValidators, formSaveButton, initFormState, menu) import Metajelo.Types as M import Metajelo.Validation as V import Metajelo.View (contactWidg) @@ -34,7 +34,7 @@ proxies = F.mkSProxies (F.FormProxy :: F.FormProxy InstContactForm) -- Some type helpers type InputForm = InstContactForm Record F.InputField -- type OutputForm = InstContactForm Record F.OutputField -type Validators = InstContactForm Record (F.Validation InstContactForm (Widget HTML)) +type Validators = MKValidators InstContactForm type FState = MKFState InstContactForm type InputRecord = { @@ -92,24 +92,8 @@ contactSignal instContactMay = step instContactMay do inputs <- pure $ F.wrapInputFields $ outToInRec instContactMay instContact <- D.div' [ D.h2' [D.text "Institution Contact"] - , contactForm (initState inputs validators) + , contactForm (initFormState inputs validators) , foldMap contactWidg instContactMay ] pure $ contactSignal $ Just instContact - --- This should be in Formless -initState :: InputForm -> Validators -> FState -initState form validations = - { validity: F.Incomplete - , dirty: false - , submitting: false - , errors: 0 - , submitAttempts: 0 - , form: Internal.inputFieldsToFormFields form - , internal: F.InternalState - { initialInputs: form - , validators: validations - , allTouched: false - } - }