Add Landkit styles to billing creation

Dependencies

• [2] 3PFXXJTL WIP
• [3] YBLHJFCN Implement billing modal.
• [4] 4GOBY5NQ WIP on modals.
• [5] N6FG4EW6 Working bootstrap modal! Only a little FFI.
• [6] T2DN23M7 Factor out billing create component.

Change contents

• edit in client/src/Aftok/Billing/Create.purs at line 4
  [3.526]

  [3.526]
  +

  + import Aftok.Api.Billing (BillableId, Billable, Recurrence(..), createBillable)

  + import Aftok.Api.Types (APIError(..))

  + import Aftok.HTML.Classes as C

  + import Aftok.Modals as Modals

  + import Aftok.Modals.ModalFFI as ModalFFI

  + import Aftok.Types (System, ProjectId)

  + import Aftok.Zcash (ZEC(..), toZatoshi)
• edit in client/src/Aftok/Billing/Create.purs at line 13
  [3.566]→[3.566:607](∅→∅)
  − -- import Data.DateTime (DateTime, date)
• edit in client/src/Aftok/Billing/Create.purs at line 21
  [3.607]→[3.696:727](∅→∅),[3.696]→[3.696:727](∅→∅),[3.727]→[3.608:659](∅→∅)
  − -- import Data.Unfoldable as U

  − import Data.Validation.Semigroup (V(..), toEither)
• edit in client/src/Aftok/Billing/Create.purs at line 22
  [2.1028]→[3.660:698](∅→∅),[3.765]→[3.660:698](∅→∅)
  − -- import Data.Traversable (traverse)
• edit in client/src/Aftok/Billing/Create.purs at line 23
  [3.728]

  [3.826]
  + import Data.Validation.Semigroup (V(..), toEither)
• edit in client/src/Aftok/Billing/Create.purs at line 25
  [3.850]→[3.850:921](∅→∅)
  − -- import Effect.Class (liftEffect)

  − -- import Effect.Now (nowDateTime)
• edit in client/src/Aftok/Billing/Create.purs at line 26
  [3.941]→[3.941:982](∅→∅)
  − import Halogen.HTML.Core (ClassName(..))
• edit in client/src/Aftok/Billing/Create.purs at line 27
  [3.1008]

  [3.1008]
  + import Halogen.HTML.Core (ClassName(..))
• edit in client/src/Aftok/Billing/Create.purs at line 30
  [3.1116]→[3.1116:1155](∅→∅),[3.1155]→[3.729:760](∅→∅),[3.760]→[3.464:535](∅→∅),[3.1228]→[3.464:535](∅→∅),[3.535]→[3.761:799](∅→∅),[3.535]→[3.1228:1281](∅→∅),[3.799]→[3.1228:1281](∅→∅),[3.1228]→[3.1228:1281](∅→∅),[3.1281]→[3.800:819](∅→∅),[3.819]→[3.1321:1340](∅→∅),[3.1321]→[3.1321:1340](∅→∅),[3.1395]→[3.1395:1399](∅→∅),[3.1399]→[3.820:860](∅→∅)
  − import Aftok.Types (System, ProjectId)

  − import Aftok.HTML.Classes as C

  − import Aftok.Modals as Modals

  − import Aftok.Modals.ModalFFI as ModalFFI

  − import Aftok.Api.Types (APIError(..))

  − import Aftok.Api.Billing

  − ( BillableId

  − , Billable

  − , Recurrence(..)

  − , createBillable

  − )

  − import Aftok.Zcash (ZEC(..), toZatoshi)
• replacement in client/src/Aftok/Billing/Create.purs at line 130
  [3.1554]→[3.708:730](∅→∅),[3.708]→[3.708:730](∅→∅)
  − [ HH.label
  [3.1554]

  [3.1555]
  + [ HH.label
• replacement in client/src/Aftok/Billing/Create.purs at line 132
  [3.1591]→[3.1591:1631](∅→∅)
  − [ HH.text "Product Name" ]
  [3.1591]

  [3.861]
  + [ HH.text "Product Name" ]
• replacement in client/src/Aftok/Billing/Create.purs at line 135
  [3.2101]→[3.1632:1676](∅→∅)
  − , P.classes [ C.formControlSm ]
  [3.2101]

  [3.883]
  + , P.classes [ C.formControl, C.formControlSm ]
• replacement in client/src/Aftok/Billing/Create.purs at line 140
  [3.2388]→[3.1677:1690](∅→∅)
  − ]
  [3.2388]

  [3.1690]
  + ]
• replacement in client/src/Aftok/Billing/Create.purs at line 143
  [3.1737]→[3.1737:1759](∅→∅)
  − [ HH.label
  [3.1737]

  [3.1759]
  + [ HH.label
• replacement in client/src/Aftok/Billing/Create.purs at line 145
  [3.1797]→[3.1797:1846](∅→∅)
  − [ HH.text "Product Description" ]
  [3.1797]

  [3.1217]
  + [ HH.text "Product Description" ]
• replacement in client/src/Aftok/Billing/Create.purs at line 148
  [3.1274]→[3.1847:1893](∅→∅)
  − , P.classes [ C.formControlSm ]
  [3.1274]

  [3.1338]
  + , P.classes [ C.formControl, C.formControlSm ]
• replacement in client/src/Aftok/Billing/Create.purs at line 156
  [3.1956]→[3.1956:1978](∅→∅)
  − [ HH.label
  [3.1956]

  [3.1978]
  + [ HH.label
• replacement in client/src/Aftok/Billing/Create.purs at line 158
  [3.2015]→[3.2015:2077](∅→∅)
  − [ HH.text "Message to be included with bill" ]
  [3.2015]

  [3.1755]
  + [ HH.text "Message to be included with bill" ]
• edit in client/src/Aftok/Billing/Create.purs at line 161
  [3.1812]

  [3.1876]
  + , P.classes [C.formControl, C.formControlSm]
• replacement in client/src/Aftok/Billing/Create.purs at line 169
  [3.2296]→[3.2296:2936](∅→∅)
  − [ HH.label_

  − [ HH.input

  − ([ P.type_ P.InputRadio

  − , P.name "recurType"

  − , E.onClick \_ -> Just (SetRecurrenceType RTAnnual)

  − ] <> (if st.recurrenceType == RTAnnual then [P.checked true] else []))

  − , HH.text " Annual"

  − ]

  − , HH.label_

  − [ HH.input

  − ([ P.type_ P.InputRadio

  − , P.name "recurType"

  − , E.onClick \_ -> Just (SetRecurrenceType RTMonthly)

  − ] <> (if st.recurrenceType == RTMonthly then [P.checked true] else []))

  − , HH.text " every "
  [3.2296]

  [3.2936]
  + [ formCheckGroup

  + { id: "recurAnnual"

  + , checked: (st.recurrenceType == RTAnnual)

  + , labelClasses: []

  + }

  + (\_ -> Just (SetRecurrenceType RTAnnual))

  + [ HH.text "Annual" ]

  + , formCheckGroup

  + { id: "recurMonthly"

  + , checked: (st.recurrenceType == RTMonthly)

  + , labelClasses: [C.formInline]

  + }

  + (\_ -> Just (SetRecurrenceType RTMonthly))

  + [ HH.text "Every"

  + , HH.input

  + [ P.type_ P.InputNumber

  + , P.classes [ C.formControl, C.formControlXs, C.formControlFlush, C.marginX2 ]

  + , P.value (if st.recurrenceType == RTMonthly

  + then maybe "" show st.recurrenceValue

  + else "")

  + , P.min 1.0

  + , P.max 12.0

  + , E.onValueInput (Just <<< SetRecurrenceMonths)

  + ]

  + , HH.text "Months"]

  + , formCheckGroup

  + { id: "recurWeekly"

  + , checked: (st.recurrenceType == RTWeekly)

  + , labelClasses: [C.formInline]

  + }

  + (\_ -> Just (SetRecurrenceType RTWeekly))

  + [ HH.text "Every"
• replacement in client/src/Aftok/Billing/Create.purs at line 203
  [3.2999]→[3.2999:3824](∅→∅)
  − , P.classes [ C.formControlSm ]

  − , P.value (if st.recurrenceType == RTMonthly

  − then maybe "" show st.recurrenceValue

  − else "")

  − , P.min 1.0

  − , P.max 12.0

  − , E.onValueInput (Just <<< SetRecurrenceMonths)

  − ]

  − , HH.text " Months"

  − ]

  − , HH.label_

  − [ HH.input

  − ([ P.type_ P.InputRadio

  − , P.name "recurType"

  − , E.onClick \_ -> Just (SetRecurrenceType RTWeekly)

  − ] <> (if st.recurrenceType == RTWeekly then [P.checked true] else []))

  − , HH.text " every "

  − , HH.input

  − [ P.type_ P.InputNumber

  − , P.classes [ C.formControlSm ]
  [3.2999]

  [3.3824]
  + , P.classes [ C.formControl, C.formControlXs, C.formControlFlush, C.marginX2 ]
• replacement in client/src/Aftok/Billing/Create.purs at line 210
  [3.4111]→[3.4111:4491](∅→∅)
  − ]

  − , HH.text " Weeks"

  − ]

  − , HH.label_

  − [ HH.input

  − ([ P.type_ P.InputRadio

  − , P.name "recurType"

  − , E.onClick \_ -> Just (SetRecurrenceType RTOneTime)

  − ] <> (if st.recurrenceType == RTOneTime then [P.checked true] else []))

  − , HH.text " One-Time"
  [3.4111]

  [3.4491]
  + ]

  + , HH.text "Weeks"
• edit in client/src/Aftok/Billing/Create.purs at line 213
  [3.4505]

  [3.4505]
  + , formCheckGroup

  + { id: "oneTime"

  + , checked: st.recurrenceType == RTOneTime

  + , labelClasses: []

  + }

  + (\_ -> Just (SetRecurrenceType RTOneTime))

  + [ HH.text "One-Time" ]
• replacement in client/src/Aftok/Billing/Create.purs at line 223
  [3.4564]→[3.4564:4586](∅→∅)
  − [ HH.label
  [3.4564]

  [3.4586]
  + [ HH.label
• replacement in client/src/Aftok/Billing/Create.purs at line 225
  [3.4626]→[3.4626:5000](∅→∅),[3.5000]→[3.2097:2113](∅→∅),[3.2097]→[3.2097:2113](∅→∅)
  − [ HH.text "Amount" ]

  − , HH.input

  − [ P.type_ P.InputNumber

  − , P.classes [ C.formControlSm ]

  − , P.id_ "billableAmount"

  − , P.value (maybe "" (Fixed.toString <<< unwrap) st.amount)

  − , P.placeholder "1.0"

  − , P.min 0.0

  − , E.onValueInput (Just <<< SetBillingAmount)

  − ]
  [3.4626]

  [3.5001]
  + [ HH.text "Amount" ]
• replacement in client/src/Aftok/Billing/Create.purs at line 227
  [3.5020]→[3.5020:5174](∅→∅)
  − [ P.classes [ ClassName "input-group-append" ] ]

  − [ HH.span [ P.classes [ ClassName "input-group-text" ] ] [ HH.text "ZEC" ] ]
  [3.5020]

  [3.2113]
  + [ P.classes [ ClassName "input-group", ClassName "input-group-sm" ] ]

  + [ HH.input

  + [ P.type_ P.InputNumber

  + , P.classes [ C.formControl ]

  + , P.id_ "billableAmount"

  + , P.value (maybe "" (Fixed.toString <<< unwrap) st.amount)

  + , P.placeholder "1.0"

  + , P.min 0.0

  + , E.onValueInput (Just <<< SetBillingAmount)

  + ]

  + , HH.div

  + [ P.classes [ ClassName "input-group-append"] ]

  + [ HH.span

  + [ P.classes [ ClassName "input-group-text" ]

  + , P.style "height: auto;" -- fix bad calculated height from LandKit

  + ]

  + [ HH.text "ZEC" ] ]

  + ]
• replacement in client/src/Aftok/Billing/Create.purs at line 248
  [3.5228]→[3.5228:5250](∅→∅)
  − [ HH.label
  [3.5228]

  [3.5250]
  + [ HH.label
• replacement in client/src/Aftok/Billing/Create.purs at line 250
  [3.5287]→[2.1060:1109](∅→∅)
  − [ HH.text "Grace Period (Days)" ]
  [3.5287]

  [3.5337]
  + [ HH.text "Grace Period (Days)" ]
• replacement in client/src/Aftok/Billing/Create.purs at line 254
  [3.5432]→[3.5432:5478](∅→∅)
  − , P.classes [ C.formControlSm ]
  [3.5432]

  [3.5478]
  + , P.classes [ C.formControl, C.formControlSm ]
• replacement in client/src/Aftok/Billing/Create.purs at line 259
  [3.5713]→[3.5713:5730](∅→∅)
  − ]
  [3.5713]

  [3.5730]
  + ]
• replacement in client/src/Aftok/Billing/Create.purs at line 263
  [3.5796]→[3.5796:5818](∅→∅)
  − [ HH.label
  [3.5796]

  [3.5818]
  + [ HH.label
• replacement in client/src/Aftok/Billing/Create.purs at line 265
  [3.5857]→[3.5857:5916](∅→∅)
  − [ HH.text "Request Expiry Period (Hours)" ]
  [3.5857]

  [3.5916]
  + [ HH.text "Request Expiry Period (Hours)" ]
• replacement in client/src/Aftok/Billing/Create.purs at line 269
  [3.6011]→[3.6011:6057](∅→∅)
  − , P.classes [ C.formControlSm ]
  [3.6011]

  [3.6057]
  + , P.classes [ C.formControl, C.formControlSm ]
• replacement in client/src/Aftok/Billing/Create.purs at line 274
  [3.6293]→[3.6293:6310](∅→∅)
  − ]
  [3.6293]

  [3.6310]
  + ]
• edit in client/src/Aftok/Billing/Create.purs at line 278
  [3.4021]

  [3.2389]
  +

  + formCheckGroup :: forall i a.

  + { id :: String

  + , checked :: Boolean

  + , labelClasses :: Array ClassName

  + }

  + -> (Unit -> Maybe a)

  + -> Array (HH.HTML i a)

  + -> HH.HTML i a

  + formCheckGroup { id, checked, labelClasses } onChange children =

  + HH.div

  + [ P.classes [C.formCheck] ]

  + [ HH.input

  + ([ P.type_ P.InputRadio

  + , P.name "recurType"

  + , P.classes [C.formCheckInput]

  + , P.id_ id

  + , E.onClick \_ -> onChange unit

  + ] <> (if checked then [P.checked true] else []))

  + , HH.label

  + [ P.classes ([C.formCheckLabel ] <> labelClasses)

  + , P.for id]

  + children

  + ]
• replacement in client/src/Aftok/Billing/Create.purs at line 304
  [3.6410]→[3.6410:6440](∅→∅)
  − formGroup st fields body =
  [3.6410]

  [3.6440]
  + formGroup st fields body =
• replacement in client/src/Aftok/Billing/Create.purs at line 307
  [3.6484]→[3.6484:6527](∅→∅)
  − (body <> (fieldError st =<< fields))
  [3.6484]

  [3.4021]
  + (body <> (fieldError st =<< fields))
• replacement in client/src/Aftok/Billing/Create.purs at line 310
  [3.6595]→[3.6595:6660](∅→∅)
  − fieldError st field =

  − if any (_ == field) st.fieldErrors
  [3.6595]

  [3.6660]
  + fieldError st field =

  + if any (_ == field) st.fieldErrors
• replacement in client/src/Aftok/Billing/Create.purs at line 329
  [3.4190]→[3.7412:7435](∅→∅)
  − SetName name ->
  [3.4190]

  [3.7435]
  + SetName name ->
• replacement in client/src/Aftok/Billing/Create.purs at line 331
  [3.7478]→[3.7478:7501](∅→∅)
  − SetDesc desc ->
  [3.7478]

  [3.7501]
  + SetDesc desc ->
• replacement in client/src/Aftok/Billing/Create.purs at line 333
  [3.7551]→[3.7551:7576](∅→∅)
  − SetMessage msg ->
  [3.7551]

  [3.7576]
  + SetMessage msg ->
• replacement in client/src/Aftok/Billing/Create.purs at line 343
  [3.8014]→[3.8014:8048](∅→∅)
  − SetRecurrenceMonths dur ->
  [3.8014]

  [3.8048]
  + SetRecurrenceMonths dur ->
• replacement in client/src/Aftok/Billing/Create.purs at line 347
  [3.8215]→[3.8215:8248](∅→∅)
  − SetRecurrenceWeeks dur ->
  [3.8215]

  [3.8248]
  + SetRecurrenceWeeks dur ->
• replacement in client/src/Aftok/Billing/Create.purs at line 351
  [3.8414]→[3.8414:8445](∅→∅)
  − SetBillingAmount amt ->
  [3.8414]

  [3.8445]
  + SetBillingAmount amt ->
• replacement in client/src/Aftok/Billing/Create.purs at line 355
  [3.8587]→[3.8587:8616](∅→∅)
  − SetGracePeriod dur ->
  [3.8587]

  [3.8616]
  + SetGracePeriod dur ->
• replacement in client/src/Aftok/Billing/Create.purs at line 359
  [3.8762]→[3.8762:8793](∅→∅)
  − SetRequestExpiry dur ->
  [3.8762]

  [3.8793]
  + SetRequestExpiry dur ->
• replacement in client/src/Aftok/Billing/Create.purs at line 384
  [3.10118]→[3.10118:10127](∅→∅)
  −
  [3.10118]

  [3.10127]
  +
• replacement in client/src/Aftok/Billing/Create.purs at line 386
  [3.10172]→[3.10172:10192](∅→∅)
  − reqV =
  [3.10172]

  [3.10192]
  + reqV =
• replacement in client/src/Aftok/Billing/Create.purs at line 405
  [3.10901]→[3.10901:10929](∅→∅)
  − Left errs ->
  [3.10901]

  [3.10929]
  + Left errs ->
• replacement in client/src/Aftok/HTML/Classes.purs at line 5
  [3.3252]→[3.3252:3270](∅→∅)
  − btn :: ClassName
  [3.3252]

  [3.3270]
  + btn :: ClassName
• replacement in client/src/Aftok/HTML/Classes.purs at line 8
  [3.3293]→[3.3293:3318](∅→∅)
  − btnPrimary :: ClassName
  [3.3293]

  [3.3318]
  + btnPrimary :: ClassName
• replacement in client/src/Aftok/HTML/Classes.purs at line 11
  [3.3356]→[3.3356:3383](∅→∅)
  − btnSecondary :: ClassName
  [3.3356]

  [3.3383]
  + btnSecondary :: ClassName
• replacement in client/src/Aftok/HTML/Classes.purs at line 14
  [3.3425]→[3.3425:3445](∅→∅)
  − close :: ClassName
  [3.3425]

  [3.3445]
  + close :: ClassName
• edit in client/src/Aftok/HTML/Classes.purs at line 44
  [3.19217]

  [3.19217]
  + formInline :: ClassName

  + formInline = ClassName "form-inline"

  +
• edit in client/src/Aftok/HTML/Classes.purs at line 49
  [3.19275]

  [3.19275]
  +

  + formControl :: ClassName

  + formControl = ClassName "form-control"
• edit in client/src/Aftok/HTML/Classes.purs at line 55
  [3.19347]
  +

  + formControlXs :: ClassName

  + formControlXs = ClassName "form-control-xs"

  +

  + formControlFlush :: ClassName

  + formControlFlush = ClassName "form-control-flush"

  +

  + formCheck :: ClassName

  + formCheck = ClassName "form-check"

  +

  + formCheckLabel :: ClassName

  + formCheckLabel = ClassName "form-check-label"

  +

  + formCheckInput :: ClassName

  + formCheckInput = ClassName "form-check-input"

  +

  + -- Sizing

  +

  + marginX2 :: ClassName

  + marginX2 = ClassName "mx-2"