Skip to content

P
purescript-gargantext
Commit fb7fbcbe authored by arturo's avatar arturo
Browse files
Options

[layout] Modal reactivity for "Close" action 

* #427
parent 21fc4e22
Expand all Hide whitespace changes
Inline Side-by-side
Showing with 155 additions and 137 deletions
src/Gargantext/Components/Bootstrap/Floaty/BaseModal.purs
View file @ fb7fbcbe
module Gargantext.Components.Bootstrap.BaseModal (baseModal) where
module Gargantext.Components.Bootstrap.BaseModal
(baseModal
, showModal, hideModal
) where
import Gargantext.Prelude
......@@ -109,12 +112,14 @@ component = R.hooksComponent componentName cpt where
id = componentName <> "-" <> uuid
selector = "#" <> id
-- | Hooks
-- |
useUpdateEffect1' isVisible
if isVisible
then showModal window $ "#" <> id
else hideModal window $ "#" <> id
then showModal window selector
else hideModal window selector
-- | Behaviors
-- |
......
src/Gargantext/Components/FolderView.purs
View file @ fb7fbcbe
This diff is collapsed.
src/Gargantext/Components/FolderView/Box.purs
View file @ fb7fbcbe
......@@ -42,7 +42,7 @@ nodePopupViewCpt = here.component "nodePopupView" cpt where
]
]
closePopover props = props.onPopoverClose <<< R.unsafeEventTarget
closeBox props = props.onPopoverClose <<< R.unsafeEventTarget
panelHeading props@{ nodeType } =
H.div { className: "popup-container__header card-header" }
......@@ -53,5 +53,5 @@ nodePopupViewCpt = here.component "nodePopupView" cpt where
, H.div { className: "col-6" }
[ H.span { className: "text-primary center" } [ H.text props.name ] ]
, H.div { className: "col-1" }
[ H.a { type: "button", on: { click: closePopover props }, title: "Close"
[ H.a { type: "button", on: { click: closeBox props }, title: "Close"
, className: glyphicon "window-close" } [] ]]]
src/Gargantext/Components/Forest/Tree.purs
View file @ fb7fbcbe
......@@ -7,7 +7,6 @@ import Data.Array as Array
import Data.Maybe (Maybe(..), isJust)
import Data.Traversable (intercalate, traverse, traverse_)
import Data.Tuple.Nested ((/\))
import Effect (Effect)
import Effect.Aff (Aff)
import Effect.Class (liftEffect)
import Gargantext.AsyncTasks as GAT
......@@ -31,13 +30,13 @@ import Gargantext.Components.Forest.Tree.Node.Tools.SubTree.Types (SubTreeOut(..
import Gargantext.Config.REST (AffRESTError, logRESTError)
import Gargantext.Config.Utils (handleRESTError)
import Gargantext.Ends (Frontends)
import Gargantext.Hooks.Loader (useLoader, useLoaderEffect)
import Gargantext.Hooks.Loader (useLoaderEffect)
import Gargantext.Routes as GR
import Gargantext.Sessions (Session, get, mkNodeId)
import Gargantext.Sessions.Types (useOpenNodesMemberBox, openNodesInsert, openNodesDelete)
import Gargantext.Types (Handed, ID, isPublic, publicize, switchHanded)
import Gargantext.Types (Handed, ID, isPublic, publicize)
import Gargantext.Types as GT
import Gargantext.Utils (nbsp, (?))
import Gargantext.Utils ((?))
import Gargantext.Utils.Reactix as R2
import Gargantext.Utils.Toestand as T2
import Reactix as R
......@@ -99,11 +98,13 @@ type ChildLoaderProps =
( id :: ID
, render :: R2.Leaf TreeProps
, root :: ID
| NodeProps )
| NodeProps
)
type PerformActionProps =
( setPopoverRef :: R.Ref (Maybe (Boolean -> Effect Unit))
| PACommon )
( isBoxVisible :: T.Box Boolean
| PACommon
)
-- | Loads and renders the tree starting at the given root node id.
treeLoader :: R2.Leaf ( key :: String | LoaderProps )
......@@ -163,9 +164,9 @@ treeCpt = here.component "tree" cpt where
, session
, tree: NTree (LNode { id, name, nodeType }) children } _ = do
setPopoverRef <- R.useRef Nothing
folderOpen <- useOpenNodesMemberBox nodeId forestOpen
folderOpen' <- T.useLive T.unequal folderOpen
isBoxVisible <- T.useBox false
folderOpen <- useOpenNodesMemberBox nodeId forestOpen
folderOpen' <- T.useLive T.unequal folderOpen
pure $
......@@ -183,7 +184,7 @@ treeCpt = here.component "tree" cpt where
[
nodeSpan
{ boxes
, dispatch: dispatch setPopoverRef
, dispatch: dispatch' isBoxVisible
, folderOpen
, frontends
, id
......@@ -193,7 +194,7 @@ treeCpt = here.component "tree" cpt where
, reload
, root
, session
, setPopoverRef
, isBoxVisible
}
<>
R2.when (folderOpen')
......@@ -213,9 +214,9 @@ treeCpt = here.component "tree" cpt where
nodeId = mkNodeId session id
children' = A.sortWith fTreeID pubChildren
pubChildren = if isPublic nodeType then map (map pub) children else children
dispatch setPopoverRef a = performAction a (Record.merge common' spr) where
dispatch' isBoxVisible a = performAction a (Record.merge common' extra) where
common' = RecordE.pick p :: Record PACommon
spr = { setPopoverRef }
extra = { isBoxVisible }
pub (LNode n@{ nodeType: t }) = LNode (n { nodeType = publicize t })
......@@ -295,10 +296,10 @@ childLoaderCpt = here.component "childLoader" cpt where
extra = { root, tree: tree' }
nodeProps = RecordE.pick p :: Record NodeProps
closePopover { setPopoverRef } =
liftEffect $ traverse_ (\set -> set false) (R.readRef setPopoverRef)
closeBox { isBoxVisible } =
liftEffect $ T.write_ false isBoxVisible
refreshTree p@{ reloadTree } = liftEffect $ T2.reload reloadTree *> closePopover p
refreshTree p@{ reloadTree } = liftEffect $ T2.reload reloadTree *> closeBox p
deleteNode' nt p@{ boxes: { forestOpen }, session, tree: (NTree (LNode {id, parent_id}) _) } = do
case nt of
......@@ -407,6 +408,6 @@ performAction (MoveNode {params}) p = moveNode params
performAction (MergeNode {params}) p = mergeNode params p
performAction (LinkNode { nodeType, params }) p = linkNode nodeType params p
performAction RefreshTree p = refreshTree p
performAction ClosePopover p = closePopover p
performAction CloseBox p = closeBox p
performAction (DocumentsFromWriteNodes { id }) p = documentsFromWriteNodes id p
performAction NoAction _ = liftEffect $ here.log "[performAction] NoAction"
src/Gargantext/Components/Forest/Tree/Node.purs
View file @ fb7fbcbe
......@@ -8,7 +8,6 @@ import Gargantext.Prelude
import Data.Array.NonEmpty as NArray
import Data.Foldable (intercalate)
import Data.Maybe (Maybe(..), maybe)
import Data.Nullable (null)
import Data.String.Regex as Regex
import Data.Symbol (SProxy(..))
import Data.Tuple.Nested ((/\))
......@@ -18,7 +17,7 @@ import Effect.Class (liftEffect)
import Gargantext.AsyncTasks as GAT
import Gargantext.Components.App.Store (Boxes)
import Gargantext.Components.Bootstrap as B
import Gargantext.Components.Bootstrap.Types (ComponentStatus(..), Elevation(..), ModalSizing(..), TooltipEffect(..), Variant(..))
import Gargantext.Components.Bootstrap.Types (ComponentStatus(..), Elevation(..), TooltipEffect(..), Variant(..))
import Gargantext.Components.Forest.Tree.Node.Action.Types (Action(..))
import Gargantext.Components.Forest.Tree.Node.Action.Upload (DroppedFile(..), fileTypeView)
import Gargantext.Components.Forest.Tree.Node.Action.Upload.Types (FileType(..), UploadFileBlob(..))
......@@ -31,7 +30,6 @@ import Gargantext.Components.Nodes.Corpus (loadCorpusWithChild)
import Gargantext.Config.REST (logRESTError)
import Gargantext.Context.Progress (asyncContext, asyncProgress)
import Gargantext.Ends (Frontends, url)
import Gargantext.Hooks.FirstEffect (useFirstEffect')
import Gargantext.Hooks.Loader (useLoaderEffect)
import Gargantext.Hooks.Version (Version, useVersion)
import Gargantext.Routes as Routes
......@@ -39,7 +37,6 @@ import Gargantext.Sessions (Session, sessionId)
import Gargantext.Types (ID, Name)
import Gargantext.Types as GT
import Gargantext.Utils (nbsp, textEllipsisBreak, (?))
import Gargantext.Utils.Popover as Popover
import Gargantext.Utils.Reactix as R2
import Gargantext.Utils.Toestand as T2
import React.SyntheticEvent as SE
......@@ -47,7 +44,6 @@ import Reactix as R
import Reactix.DOM.HTML as H
import Record as Record
import Toestand as T
import Unsafe.Coerce (unsafeCoerce)
-- (?) never been able to properly declare PureScript Regex...
foreign import nodeUserRegexp :: Regex.Regex
......@@ -68,7 +64,7 @@ type NodeSpanProps =
, reload :: T2.ReloadS
, root :: ID
, session :: Session
, setPopoverRef :: R.Ref (Maybe (Boolean -> Effect Unit))
, isBoxVisible :: T.Box Boolean
)
type IsLeaf = Boolean
......@@ -92,7 +88,7 @@ nodeSpanCpt = here.component "nodeSpan" cpt
, nodeType
, reload
, session
, setPopoverRef
, isBoxVisible
} _ = do
-- States
......@@ -108,8 +104,6 @@ nodeSpanCpt = here.component "nodeSpan" cpt
folderOpen' <- R2.useLive' folderOpen
isSettingsModalVisible <- T.useBox false
-- tasks' <- T.read tasks
-- Computed
......@@ -198,18 +192,10 @@ nodeSpanCpt = here.component "nodeSpan" cpt
-- Nothing -> pure unit
-- T2.reload reloadRoot
onPopoverClose ::
Popover.PopoverRef
-> Effect Unit
onPopoverClose ref = Popover.setOpen ref false
-- NOTE Don't toggle tree if it is not selected
onNodeLinkClick :: Unit -> Effect Unit
onNodeLinkClick _ = when (not isSelected) (T.write_ true folderOpen)
toggleSettingsModal :: Unit -> Effect Unit
toggleSettingsModal _ = T.modify_ (not) isSettingsModalVisible
-- Hooks
mVersion <- useVersion $ nodeType == GT.NodeUser ?
......@@ -320,7 +306,7 @@ nodeSpanCpt = here.component "nodeSpan" cpt
B.iconButton
{ name: "cog"
, className: "mainleaf__settings-icon"
, callback: toggleSettingsModal
, callback: \_ -> T.write_ true isBoxVisible
, title:
"Each node of the Tree can perform some actions.\n"
<> "Click here to execute one of them."
......@@ -346,7 +332,7 @@ nodeSpanCpt = here.component "nodeSpan" cpt
-- // Modals //
B.baseModal
{ isVisibleBox: isSettingsModalVisible
{ isVisibleBox: isBoxVisible
, noBody: true
, noHeader: true
, modalClassName: "forest-tree-node-modal"
......@@ -358,7 +344,7 @@ nodeSpanCpt = here.component "nodeSpan" cpt
, id
, name
, nodeType
, onPopoverClose: \_ -> toggleSettingsModal unit
, closeCallback: \_ -> T.write_ false isBoxVisible
, session
}
]
......
src/Gargantext/Components/Forest/Tree/Node/Action.purs
View file @ fb7fbcbe
......@@ -46,7 +46,7 @@ icon (UploadFile _ _ _ _ _ _) = glyphiconNodeAction Upload
icon (UploadArbitraryFile _ _ _ _ ) = glyphiconNodeAction Upload
icon UploadFrameCalc = glyphiconNodeAction Upload
icon RefreshTree = glyphiconNodeAction Refresh
icon ClosePopover = glyphiconNodeAction CloseNodePopover
icon CloseBox = glyphiconNodeAction CloseNodePopover
icon DownloadNode = glyphiconNodeAction Download
icon (MoveNode _ ) = glyphiconNodeAction (Move { subTreeParams : SubTreeParams {showtypes:[], valitypes:[] }})
icon (MergeNode _ ) = glyphiconNodeAction (Merge { subTreeParams : SubTreeParams {showtypes:[], valitypes:[] }})
......@@ -70,7 +70,7 @@ text (UploadFile _ _ _ _ _ _) = "Upload File !"
text (UploadArbitraryFile _ _ _ _) = "Upload arbitrary file !"
text UploadFrameCalc = "Upload frame calc"
text RefreshTree = "Refresh Tree !"
text ClosePopover = "Close Popover !"
text CloseBox = "Close Box !"
text DownloadNode = "Download !"
text (MoveNode _ ) = "Move !"
text (MergeNode _ ) = "Merge !"
......@@ -78,4 +78,3 @@ text (LinkNode _ ) = "Link !"
text (DocumentsFromWriteNodes _ ) = "Documents from Write Nodes !"
text NoAction = "No Action"
-----------------------------------------------------------------------
src/Gargantext/Components/Forest/Tree/Node/Action/Search.purs
View file @ fb7fbcbe
......@@ -54,7 +54,7 @@ actionSearchCpt = here.component "actionSearch" cpt
searchOn dispatch' task = do
_ <- launchAff $ dispatch' (DoSearch task)
-- close popup
_ <- launchAff $ dispatch' ClosePopover
_ <- launchAff $ dispatch' CloseBox
-- TODO
--snd p $ const Nothing
pure unit
src/Gargantext/Components/Forest/Tree/Node/Action/Types.purs
View file @ fb7fbcbe
......@@ -21,7 +21,7 @@ data Action = AddNode String GT.NodeType
| UploadFrameCalc
| DownloadNode
| RefreshTree
| ClosePopover
| CloseBox
| ShareTeam String
| AddContact AddContactParams
......@@ -48,7 +48,7 @@ instance Eq Action where
eq UploadFrameCalc UploadFrameCalc = true
eq DownloadNode DownloadNode = true
eq RefreshTree RefreshTree = true
eq ClosePopover ClosePopover = true
eq CloseBox CloseBox = true
eq (ShareTeam s1) (ShareTeam s2) = eq s1 s2
eq (AddContact ac1) (AddContact ac2) = eq ac1 ac2
eq (SharePublic p1) (SharePublic p2) = eq p1 p2
......@@ -72,7 +72,7 @@ instance Show Action where
show (UploadArbitraryFile _ _ _ _) = "UploadArbitraryFile"
show UploadFrameCalc = "UploadFrameCalc"
show RefreshTree = "RefreshTree"
show ClosePopover = "ClosePopover"
show CloseBox = "CloseBox"
show DownloadNode = "Download"
show (MoveNode _ ) = "MoveNode"
show (MergeNode _ ) = "MergeNode"
......
src/Gargantext/Components/Forest/Tree/Node/Action/Update.purs
View file @ fb7fbcbe
......@@ -86,7 +86,7 @@ updateGraphCpt = here.component "updateGraph" cpt where
let
callback :: Action -> Aff Unit
callback = dispatch >=> \_ -> dispatch ClosePopover
callback = dispatch >=> \_ -> dispatch CloseBox
pure $ panel [ H.text "Show subjects with Order1 or concepts with Order2 ?"
, formChoiceSafe { items: [Order1, Order2]
......@@ -153,7 +153,7 @@ updatePhyloCpt = here.component "updatePhylo" cpt where
opts <- pure $ options r'
launchAff_ do
dispatch opts
dispatch ClosePopover
dispatch CloseBox
where
options :: Phylo.UpdateData -> Action
......
src/Gargantext/Components/Forest/Tree/Node/Action/Upload.purs
View file @ fb7fbcbe
......@@ -265,7 +265,7 @@ uploadButtonCpt = here.component "uploadButton" cpt
T.write_ Plain fileFormat
T.write_ EN lang
T.write_ false onPendingBox
dispatch ClosePopover
dispatch CloseBox
uploadListView :: R2.Leaf Props
uploadListView = R2.leafComponent uploadListViewCpt
......
src/Gargantext/Components/Forest/Tree/Node/Box.purs
View file @ fb7fbcbe
......@@ -39,8 +39,9 @@ here :: R2.Here
here = R2.here "Gargantext.Components.Forest.Tree.Node.Box"
type CommonProps =
( dispatch :: Action -> Aff Unit
, session :: Session )
( dispatch :: Action -> Aff Unit
, session :: Session
)
nodePopupView :: R2.Leaf NodePopupProps
nodePopupView = R2.leafComponent nodePopupCpt
......@@ -71,7 +72,6 @@ nodePopupCpt = here.component "nodePopupView" cpt where
]
]
closePopover p = p.onPopoverClose <<< R.unsafeEventTarget
panelHeading renameIsOpen open p@{ dispatch, id, name, nodeType } =
H.div { className: "popup-container__header card-header" }
[ R2.row
......@@ -86,7 +86,7 @@ nodePopupCpt = here.component "nodePopupView" cpt where
]
, H.div { className: "col-1" } [ editIcon renameIsOpen open ]
, H.div { className: "col-1" }
[ H.a { type: "button", on: { click: closePopover p }, title: "Close"
[ H.a { type: "button", on: { click: \_ -> p.closeCallback unit }, title: "Close"
, className: glyphicon "window-close" } [] ]]]
editIcon _ true = H.div {} []
editIcon isOpen false =
......
src/Gargantext/Components/Forest/Tree/Node/Box/Types.purs
View file @ fb7fbcbe
module Gargantext.Components.Forest.Tree.Node.Box.Types where
import DOM.Simple as DOM
import Data.Maybe (Maybe)
import Effect (Effect)
import Effect.Aff (Aff)
......@@ -18,11 +17,11 @@ type CommonProps =
)
type NodePopupProps =
( boxes :: Boxes
, id :: ID
, name :: Name
, nodeType :: GT.NodeType
, onPopoverClose :: DOM.Element -> Effect Unit
( boxes :: Boxes
, id :: ID
, name :: Name
, nodeType :: GT.NodeType
, closeCallback :: Unit -> Effect Unit
| CommonProps
)
......
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