Working bootstrap modal! Only a little FFI.

[?]

Feb 4, 2021, 4:29 AM

N6FG4EW6QU7V6QV7UHHYRA3EDKPGVCAEAT7IS3QI45N3GRRV2V7AC

Dependencies

[2] 4GOBY5NQ WIP on modals.
[3] NJNMO72S Add zcash.com submodule and update client to modern halogen.
[4] QH4UB73N Format with purty.
[5] T2DN23M7 Factor out billing create component.
[6] PT4276XC Add logout functionality.
[7] SAESJLLY Initial experiments in hash routing.
[8] QU5FW67R Add project selection to time tracker.
[9] I4W76IFV Render recaptcha explicitly.
[10] QMEYU4MW Add display for prior intervals.
[11] AAALU5A2 Fix client routing
[12] O2BZOX7M Add signup form, captcha check.
[*] ANDJ6GEY Add billing component skeleton.
[*] EA5BFM5G Split Login component into its own module.
[*] NAFJ6RB3 Minor module reorg.
[*] OUR4PAOT Use local dates for display of intervals.

Change contents

edit in client/dev/index.html at line 13

[3.2668]→[3.2668:2707](∅→∅)

<script src="./index.js"></script>
replacement in client/dev/index.html at line 14

[2.405]→[2.405:814](∅→∅)

<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js" integrity="sha384-ZMP7rVo3mIykV+2+9J3UJ46jBk0WLaUAdn689aCwoqbBJiSnjAK/l8WvCWPIPm49" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js" integrity="sha384-ChfqqxuZUCnJSK3+MXmPNIyE6ZbWh2IMqE241rYiqJxyMiZ6OW/JmZQ5stwEULTy" crossorigin="anonymous"></script>

[2.405]

[3.2707]

<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js" integrity="sha384-ZMP7rVo3mIykV+2+9J3UJ46jBk0WLaUAdn689aCwoqbBJiSnjAK/l8WvCWPIPm49" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js" integrity="sha384-ChfqqxuZUCnJSK3+MXmPNIyE6ZbWh2IMqE241rYiqJxyMiZ6OW/JmZQ5stwEULTy" crossorigin="anonymous"></script>
<script src="./index.js"></script>
edit in client/src/Aftok/Billing/Create.purs at line 25

[3.1228]

[3.1228]

import Aftok.Modals as Modals
import Aftok.Modals.ModalFFI as ModalFFI
edit in client/src/Aftok/Billing/Create.purs at line 70

[3.2035]

[3.2035]

| SaveBillable
replacement in client/src/Aftok/Billing/Create.purs at line 112

[3.2941]→[2.819:1874](∅→∅),[2.1874]→[3.3989:4003](∅→∅),[3.3989]→[3.3989:4003](∅→∅),[3.4003]→[2.1875:2067](∅→∅)

HH.form_
[ HH.div
[ P.classes (ClassName <$> ["form-group"]) ]
[ HH.label
[ P.for "billableName", P.classes (ClassName <$> ["font-weight-bold", "mb-1"] )]
[ HH.text "Bill Name:" ]
, HH.input
[ P.type_ P.InputText
, P.classes (ClassName <$> [ "form-control-sm" ])
, P.id_ "billableName"
, P.placeholder "A name for the product or service you want to bill for"
, P.required true
, P.autofocus true
, E.onValueInput (Just <<< SetName)
]
, HH.label
[ P.for "billableDesc", P.classes (ClassName <$> ["font-weight-bold", "mb-1"] )]
[ HH.text "Bill Description:" ]
, HH.input
[ P.type_ P.InputText
, P.classes (ClassName <$> [ "form-control-sm" ])
, P.id_ "billableDesc"
, P.placeholder "Description of the product or service"
, P.required true
, P.autofocus true
, E.onValueInput (Just <<< SetDesc)
]
, HH.label
[ P.for "billableMsg", P.classes (ClassName <$> ["font-weight-bold", "mb-1"] )]
[ HH.text "Message to be included with bill:" ]
, HH.input

[3.2941]

[2.2067]

Modals.modal "createBillable" "Create Billable" SaveBillable
[ HH.form_
[ HH.div
[ P.classes (ClassName <$> ["form-group"]) ]
[ HH.label
[ P.for "billableName", P.classes (ClassName <$> ["font-weight-bold", "mb-1"] )]
[ HH.text "Bill Name:" ]
, HH.input
replacement in client/src/Aftok/Billing/Create.purs at line 122

[2.2163]→[2.2163:2265](∅→∅)

, P.id_ "billableMsg"
, P.placeholder "Description of the product or service"

[2.2163]

[2.2265]

, P.id_ "billableName"
, P.placeholder "A name for the product or service you want to bill for"
replacement in client/src/Aftok/Billing/Create.purs at line 126

[2.2326]→[2.2326:2374](∅→∅)

, E.onValueInput (Just <<< SetDesc)

[2.2326]

[2.2374]

, E.onValueInput (Just <<< SetName)
edit in client/src/Aftok/Billing/Create.purs at line 128

[2.2388]

[3.4003]

, HH.label
[ P.for "billableDesc", P.classes (ClassName <$> ["font-weight-bold", "mb-1"] )]
[ HH.text "Bill Description:" ]
, HH.input
[ P.type_ P.InputText
, P.classes (ClassName <$> [ "form-control-sm" ])
, P.id_ "billableDesc"
, P.placeholder "Description of the product or service"
, P.required true
, P.autofocus true
, E.onValueInput (Just <<< SetDesc)
]
, HH.label
[ P.for "billableMsg", P.classes (ClassName <$> ["font-weight-bold", "mb-1"] )]
[ HH.text "Message to be included with bill:" ]
, HH.input
[ P.type_ P.InputText
, P.classes (ClassName <$> [ "form-control-sm" ])
, P.id_ "billableMsg"
, P.placeholder "Description of the product or service"
, P.required true
, P.autofocus true
, E.onValueInput (Just <<< SetDesc)
]
]
edit in client/src/Aftok/Billing/Create.purs at line 170

[3.4416]

[3.4416]

SaveBillable ->
lift $ system.toggleModal "createBillable" ModalFFI.HideModal
edit in client/src/Aftok/Billing/Create.purs at line 173

[3.4417]
replacement in client/src/Aftok/Billing.purs at line 124

[2.2784]→[2.2784:3139](∅→∅)

, Modals.modal "createBillable" "Create Billable"
[ HH.slot
_createBillable
unit
(Create.component system caps.createBillable)
(unwrap p).projectId
(Just <<< BillableCreated)
]

[2.2784]

[3.5078]

, system.portal
_createBillable
unit
(Create.component system caps.createBillable)
(unwrap p).projectId
Nothing
(Just <<< BillableCreated)
file addition: Modals (d--r------)

[15.1]
file addition: ModalFFI.js (----------)

[0.2514]

exports.toggleModalInternal = modalId => toggle => () => {
$('#' + modalId).modal(toggle)
}
file addition: ModalFFI.purs (----------)

[0.2514]

module Aftok.Modals.ModalFFI
( toggleModal
, Toggle(..)
) where

import Prelude (Unit)
import Effect (Effect)

data Toggle
= ShowModal
| ToggleModal
| HideModal

toggleModal :: String -> Toggle -> Effect Unit
toggleModal modalId t =
let toggleStr = case t of
ShowModal -> "show"
ToggleModal -> "toggle"
HideModal -> "hide"
in toggleModalInternal modalId toggleStr

foreign import toggleModalInternal :: String -> String -> Effect Unit
edit in client/src/Aftok/Modals.purs at line 4

[2.4583]

[2.4583]

import Data.Maybe (Maybe(..))
edit in client/src/Aftok/Modals.purs at line 6

[2.4635]

[2.4635]

import Halogen as H
edit in client/src/Aftok/Modals.purs at line 8

[2.4661]

[2.4661]

import Halogen.HTML.Events as E
replacement in client/src/Aftok/Modals.purs at line 25

[2.5065]→[2.5065:5172](∅→∅)

modal :: forall w i. String -> String -> Array (HH.HTML w i) -> HH.HTML w i
modal modalId title contents =

[2.5065]

[2.5172]

modal ::
forall action slots m.
String ->
String ->
action ->
Array (H.ComponentHTML action slots m) ->
H.ComponentHTML action slots m
modal modalId title submit contents =
edit in client/src/Aftok/Modals.purs at line 70

[2.6305]

[2.6305]

, E.onClick (\_ -> Just submit)
edit in client/src/Aftok/Types.purs at line 13

[16.8163]

[17.7232]

import Data.Symbol (class IsSymbol, SProxy)
edit in client/src/Aftok/Types.purs at line 21

[3.11481]

[3.11481]

import Type.Row as Row
replacement in client/src/Aftok/Types.purs at line 23

[3.11510]→[3.1454:1479](∅→∅)

import Routing.Hash as H

[3.11510]

[3.7524]

import Web.HTML (HTMLElement)
import Routing.Hash as RH
import Halogen as H
import Halogen.HTML as HH
import Halogen.Portal (portalAff)
import Aftok.Modals.ModalFFI as ModalFFI
edit in client/src/Aftok/Types.purs at line 39

[3.36602]

[3.36602]

, portal ::
forall query action input output slots label slot _1.
Row.Cons label (H.Slot query output slot) _1 slots =>
IsSymbol label =>
Ord slot =>
Monad m =>
SProxy label ->
slot ->
H.Component HH.HTML query input output m ->
input ->
Maybe HTMLElement ->
(output -> Maybe action) ->
H.ComponentHTML action slots m
, toggleModal :: String -> ModalFFI.Toggle -> m Unit
replacement in client/src/Aftok/Types.purs at line 60

[3.11809]→[3.1505:1539](∅→∅),[3.1539]→[3.174:212](∅→∅)

, getHash: liftEffect H.getHash
, setHash: liftEffect <<< H.setHash

[3.11809]

[3.11809]

, getHash: liftEffect RH.getHash
, setHash: liftEffect <<< RH.setHash
edit in client/src/Aftok/Types.purs at line 65

[17.7336]

[17.7336]

, portal: portalAff
, toggleModal: \i t -> liftEffect (ModalFFI.toggleModal i t)