Commit 50dfb748 authored by James Laver's avatar James Laver

enable closing login modal

parent c40f5953
...@@ -3,10 +3,11 @@ ...@@ -3,10 +3,11 @@
-- Select a backend and log into it -- Select a backend and log into it
module Gargantext.Components.Login where module Gargantext.Components.Login where
import Prelude (Unit, bind, const, discard, pure, flip, show, ($), (<>), (<$>)) import Prelude (Unit, bind, const, discard, pure, flip, show, ($), (<>), (*>), (<$>))
import Data.Either (Either(..)) import Data.Either (Either(..))
import Data.Maybe (Maybe(..)) import Data.Maybe (Maybe(..))
import Data.Tuple (fst, snd) import Data.Tuple (fst, snd)
import DOM.Simple.Console (log)
import Effect (Effect) import Effect (Effect)
import Effect.Class (liftEffect) import Effect.Class (liftEffect)
import Effect.Aff (launchAff_) import Effect.Aff (launchAff_)
...@@ -30,7 +31,7 @@ type Props = ...@@ -30,7 +31,7 @@ type Props =
, sessions :: R2.Reductor Sessions Sessions.Action , sessions :: R2.Reductor Sessions Sessions.Action
, visible :: R.State Boolean ) , visible :: R.State Boolean )
type ModalProps = ( visible :: Boolean ) type ModalProps = ( visible :: R.State Boolean )
modal :: Record ModalProps -> R.Element -> R.Element modal :: Record ModalProps -> R.Element -> R.Element
modal props child = R.createElement modalCpt props [ child ] modal props child = R.createElement modalCpt props [ child ]
...@@ -40,8 +41,9 @@ modalCpt = R.hooksComponent "Modal" cpt where ...@@ -40,8 +41,9 @@ modalCpt = R.hooksComponent "Modal" cpt where
cpt {visible} children = do cpt {visible} children = do
R.createPortal elems <$> R2.getPortalHost R.createPortal elems <$> R2.getPortalHost
where where
click _ = log "click!" *> (snd visible) (const false)
elems = elems =
[ H.div { id: "loginModal", className: modalClass visible [ H.div { id: "loginModal", className: modalClass (fst visible)
, role: "dialog", "data": {show: true}, style: {display: "block"}} , role: "dialog", "data": {show: true}, style: {display: "block"}}
[ H.div { className: "modal-dialog", role: "document"} [ H.div { className: "modal-dialog", role: "document"}
[ H.div { className: "modal-content" } [ H.div { className: "modal-content" }
...@@ -49,10 +51,11 @@ modalCpt = R.hooksComponent "Modal" cpt where ...@@ -49,10 +51,11 @@ modalCpt = R.hooksComponent "Modal" cpt where
[ H.h5 { className: "modal-title" } [] [ H.h5 { className: "modal-title" } []
, H.button { "type": "button", className: "close" , H.button { "type": "button", className: "close"
, "data": { dismiss: "modal" } } , "data": { dismiss: "modal" } }
[ H.span { aria: { hidden: true } } [ H.text "X" ] ] ] [ H.span { on: {click} } [ H.text "X" ] ] ]
, H.div { className: "modal-body" } children ] ] ] ] , H.div { className: "modal-body" } children ] ] ] ]
modalClass s = "modal myModal" <> if s then "" else " fade" modalClass s = "modal myModal" <> if s then "" else " fade"
login :: Record Props -> R.Element login :: Record Props -> R.Element
login props = R.createElement loginCpt props [] login props = R.createElement loginCpt props []
...@@ -62,7 +65,7 @@ loginCpt = R.hooksComponent "G.C.Login.login" cpt ...@@ -62,7 +65,7 @@ loginCpt = R.hooksComponent "G.C.Login.login" cpt
cpt props@{backends, sessions, visible} _ = do cpt props@{backends, sessions, visible} _ = do
backend <- R.useState' Nothing backend <- R.useState' Nothing
pure $ pure $
modal {visible: fst visible} $ modal {visible} $
case fst backend of case fst backend of
Nothing -> chooser { backends, backend, sessions, visible } Nothing -> chooser { backends, backend, sessions, visible }
Just b -> form { sessions, visible, backend: b } Just b -> form { sessions, visible, backend: b }
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment