Commit c04f9e84 authored by Alexandre Delanoë's avatar Alexandre Delanoë

[MERGE]

parents 2f8dcb1c 93060de4
module Gargantext.Components.App where
import Data.Array (fromFoldable)
import Data.Array (fromFoldable, reverse)
import Data.Foldable (intercalate)
import Data.Maybe (Maybe(..), maybe')
import Data.Tuple (fst, snd)
import Prelude
import Data.Tuple.Nested ((/\))
import Reactix as R
import Reactix.DOM.HTML as H
import Gargantext.Prelude
import Gargantext.Components.Forest (forest)
import Gargantext.Components.GraphExplorer (explorerLayout)
import Gargantext.Components.Lang (LandingLang(..))
......@@ -29,6 +31,7 @@ import Gargantext.Router (router)
import Gargantext.Routes (AppRoute(..))
import Gargantext.Sessions (Sessions, useSessions)
import Gargantext.Sessions as Sessions
import Gargantext.Types as GT
import Gargantext.Utils.Reactix as R2
-- TODO (what does this mean?)
......@@ -49,10 +52,13 @@ appCpt = R.hooksComponent "G.C.App.app" cpt where
treeReload <- R.useState' 0
handed <- R.useState' GT.RightHanded
let backends = fromFoldable defaultBackends
let ff f session = R.fragment [ f session, footer { session } ]
let forested child = forestLayout { child
, frontends
, handed
, reload: treeReload
, route: fst route
, sessions: fst sessions
......@@ -88,9 +94,10 @@ appCpt = R.hooksComponent "G.C.App.app" cpt where
PGraphExplorer sid graphId ->
withSession sid $
\session ->
simpleLayout $
simpleLayout handed $
explorerLayout { frontends
, graphId
, handed: fst handed
, mCurrentRoute
, session
, sessions: (fst sessions)
......@@ -100,6 +107,7 @@ appCpt = R.hooksComponent "G.C.App.app" cpt where
type ForestLayoutProps =
( child :: R.Element
, frontends :: Frontends
, handed :: R.State GT.Handed
, reload :: R.State Int
, route :: AppRoute
, sessions :: Sessions
......@@ -112,8 +120,8 @@ forestLayout props = R.createElement forestLayoutCpt props []
forestLayoutCpt :: R.Component ForestLayoutProps
forestLayoutCpt = R.hooksComponent "G.C.A.forestLayout" cpt
where
cpt props _ = do
pure $ R.fragment [ topBar {}, forestLayoutMain props ]
cpt props@{ handed } _ = do
pure $ R.fragment [ topBar { handed }, forestLayoutMain props ]
forestLayoutMain :: Record ForestLayoutProps -> R.Element
forestLayoutMain props = R.createElement forestLayoutMainCpt props []
......@@ -121,16 +129,21 @@ forestLayoutMain props = R.createElement forestLayoutMainCpt props []
forestLayoutMainCpt :: R.Component ForestLayoutProps
forestLayoutMainCpt = R.hooksComponent "G.C.A.forestLayoutMain" cpt
where
cpt { child, frontends, reload, route, sessions, showLogin } _ = do
pure $ R2.row [
cpt { child, frontends, handed, reload, route, sessions, showLogin } _ = do
let ordering =
case fst handed of
GT.LeftHanded -> reverse
GT.RightHanded -> identity
pure $ R2.row $ ordering [
H.div { className: "col-md-2", style: { paddingTop: "60px" } }
[ forest { frontends, reload, route, sessions, showLogin } ]
[ forest { frontends, handed: fst handed, reload, route, sessions, showLogin } ]
, mainPage child
]
-- Simple layout does not accommodate the tree
simpleLayout :: R.Element -> R.Element
simpleLayout child = R.fragment [ topBar {}, child, license]
simpleLayout :: R.State GT.Handed -> R.Element -> R.Element
simpleLayout handed child = R.fragment [ topBar { handed }, child, license]
mainPage :: R.Element -> R.Element
mainPage child =
......@@ -138,16 +151,58 @@ mainPage child =
[ H.div {id: "page-wrapper"}
[ H.div {className: "container-fluid"} [ child ] ] ]
topBar :: {} -> R.Element
topBar _ =
H.div { id: "dafixedtop", role: "navigation"
, className: "navbar navbar-inverse navbar-fixed-top" }
[ H.div { className: "container-fluid" }
[ H.div { className: "navbar-inner" }
[ logo
, H.div { className: "collapse navbar-collapse" }
[ divDropdownLeft ] ] ] ]
-- SB.searchBar {session, databases: allDatabases}
type TopBarProps = (
handed :: R.State GT.Handed
)
topBar :: Record TopBarProps -> R.Element
topBar props = R.createElement topBarCpt props []
topBarCpt :: R.Component TopBarProps
topBarCpt = R.hooksComponent "G.C.A.topBar" cpt
where
cpt { handed } _ = do
pure $ H.div { id: "dafixedtop"
, role: "navigation"
, className: "navbar navbar-inverse navbar-fixed-top" }
[ H.div { className: "container-fluid" }
[ H.div { className: "navbar-inner" }
[ logo
, H.div { className: "collapse navbar-collapse" } [
H.ul { className: "nav navbar-nav" } [
divDropdownLeft
, handedChooser { handed }
]
]
]
]
]
-- SB.searchBar {session, databases: allDatabases}
type HandedChooserProps = (
handed :: R.State GT.Handed
)
handedChooser :: Record HandedChooserProps -> R.Element
handedChooser props = R.createElement handedChooserCpt props []
handedChooserCpt :: R.Component HandedChooserProps
handedChooserCpt = R.hooksComponent "G.C.A.handedChooser" cpt
where
cpt { handed } _ = do
pure $ H.li {} [
H.a {} [
H.span { className: handedClass handed
, on: { click: onClick handed } } []
]
]
handedClass (GT.LeftHanded /\ _) = "fa fa-hand-o-left"
handedClass (GT.RightHanded /\ _) = "fa fa-hand-o-right"
onClick (_ /\ setHanded) = setHanded $ \h -> case h of
GT.LeftHanded -> GT.RightHanded
GT.RightHanded -> GT.LeftHanded
logo :: R.Element
logo =
......@@ -163,14 +218,12 @@ divDropdownLeft =
divDropdownLeft' $
LiNav { title : "About Gargantext"
, href : "#"
, icon : "glyphicon glyphicon-info-sign"
, icon : "fa fa-info-circle"
, text : "Info" }
divDropdownLeft' :: LiNav -> R.Element
divDropdownLeft' mb =
H.ul {className: "nav navbar-nav"}
[ H.ul {className: "nav navbar-nav pull-left"}
[ H.li {className: "dropdown"} [ menuButton mb, menuElements' ] ] ]
H.li {className: "dropdown"} [ menuButton mb, menuElements' ]
menuButton :: LiNav -> R.Element
menuButton (LiNav { title, href, icon, text } ) =
......
......@@ -15,12 +15,13 @@ import Gargantext.Components.Forest.Tree (treeView)
import Gargantext.Ends (Frontends)
import Gargantext.Routes (AppRoute)
import Gargantext.Sessions (Session(..), Sessions, OpenNodes, unSessions)
import Gargantext.Types (Reload, Handed(..))
import Gargantext.Types (Reload, Handed)
import Gargantext.Utils.Reactix as R2
type Props =
( frontends :: Frontends
, reload :: R.State Int
, handed :: Handed
, reload :: R.State Int
, route :: AppRoute
, sessions :: Sessions
, showLogin :: R2.Setter Boolean
......@@ -31,7 +32,7 @@ forest props = R.createElement forestCpt props []
forestCpt :: R.Component Props
forestCpt = R.hooksComponent "G.C.Forest.forest" cpt where
cpt { frontends, reload: extReload, route, sessions, showLogin } _ = do
cpt { frontends, handed, reload: extReload, route, sessions, showLogin } _ = do
-- NOTE: this is a hack to reload the tree view on demand
reload <- R.useState' (0 :: Reload)
openNodes <- R2.useLocalStorageState R2.openNodesKey (Set.empty :: OpenNodes)
......@@ -44,9 +45,10 @@ forestCpt = R.hooksComponent "G.C.Forest.forest" cpt where
/\ fst extReload
/\ fst reload
/\ fst asyncTasks
/\ handed
)
(cpt' openNodes asyncTasks reload showLogin)
cpt' openNodes asyncTasks reload showLogin (frontends /\ route /\ sessions /\ _ /\ _ /\ _ /\ _) = do
cpt' openNodes asyncTasks reload showLogin (frontends /\ route /\ sessions /\ _ /\ _ /\ _ /\ _ /\ handed) = do
pure $ R.fragment $ A.cons (plus showLogin) trees
where
trees = tree <$> unSessions sessions
......@@ -54,11 +56,11 @@ forestCpt = R.hooksComponent "G.C.Forest.forest" cpt where
treeView { root: treeId
, asyncTasks
, frontends
, handed
, mCurrentRoute: Just route
, openNodes
, reload
, session: s
, handed: RightHanded -- TODO enabling user to change it and save locally
}
plus :: R2.Setter Boolean -> R.Element
......
......@@ -63,20 +63,20 @@ treeView props = R.createElement treeViewCpt props []
cpt { root
, asyncTasks
, frontends
, handed
, mCurrentRoute
, openNodes
, reload
, session
, handed
} _children = pure
$ treeLoadView { root
, asyncTasks
, frontends
, handed
, mCurrentRoute
, openNodes
, reload
, session
, handed
}
treeLoadView :: Record Props -> R.Element
......@@ -88,22 +88,22 @@ treeLoadView p = R.createElement treeLoadViewCpt p []
cpt { root
, asyncTasks
, frontends
, handed
, mCurrentRoute
, openNodes
, reload
, session
, handed
} _children = do
let fetch _ = getNodeTree session root
let paint loaded = loadedTreeView { asyncTasks
, frontends
, handed
, mCurrentRoute
, openNodes
, reload
, session
, tasks: tasksStruct root asyncTasks reload
, tree: loaded
, handed
}
useLoader { root, counter: fst reload } fetch paint
......@@ -126,26 +126,26 @@ loadedTreeView p = R.createElement loadedTreeViewCpt p []
where
cpt { asyncTasks
, frontends
, handed
, mCurrentRoute
, openNodes
, reload
, session
, tasks
, tree
, handed
} _ = pure $ H.ul { className: "tree " <> if handed == GT.RightHanded
then "flex-start"
else "flex-end"
}
[ toHtml { asyncTasks
, frontends
, handed
, mCurrentRoute
, openNodes
, reload
, session
, tasks
, tree
, handed
}
]
......@@ -198,12 +198,12 @@ toHtml p@{ asyncTasks
, dispatch: pAction
, folderOpen
, frontends
, handed
, mCurrentRoute
, name
, nodeType
, session
, tasks
, handed
} ]
<> childNodes ( Record.merge commonProps
{ asyncTasks
......@@ -230,9 +230,9 @@ childNodes { folderOpen: (false /\ _) } = []
childNodes props@{ asyncTasks, children, reload, handed } =
map (\ctree@(NTree (LNode {id}) _) -> H.ul {} [
toHtml (Record.merge commonProps { asyncTasks
, handed
, tasks: tasksStruct id asyncTasks reload
, tree: ctree
, handed
}
)]
) $ sorted children
......
......@@ -51,7 +51,7 @@ type NodeMainSpanProps =
nodeMainSpan :: Record NodeMainSpanProps
-> R.Element
nodeMainSpan p@{ dispatch, folderOpen, frontends, session, handed} = R.createElement el p []
nodeMainSpan p@{ dispatch, folderOpen, frontends, handed, session } = R.createElement el p []
where
el = R.hooksComponent "G.C.F.T.N.NodeMainSpan" cpt
cpt props@{id, mCurrentRoute, name, nodeType, tasks: { onTaskFinish, tasks }} _ = do
......@@ -61,11 +61,13 @@ nodeMainSpan p@{ dispatch, folderOpen, frontends, session, handed} = R.createEle
popoverRef <- R.useRef null
let ordering =
case handed of
GT.LeftHanded -> reverse
GT.RightHanded -> identity
pure $ H.span (dropProps droppedFile isDragOver)
$ (if handed == GT.LeftHanded
then reverse
else identity)
$
$ ordering
[ chevronIcon nodeType folderOpen
, folderIcon nodeType folderOpen
, if showBox then
......
......@@ -42,6 +42,7 @@ type GraphId = Int
type LayoutProps =
( frontends :: Frontends
, graphId :: GraphId
, handed :: Types.Handed
, mCurrentRoute :: AppRoute
, session :: Session
, sessions :: Sessions
......@@ -86,7 +87,17 @@ explorer props = R.createElement explorerCpt props []
explorerCpt :: R.Component Props
explorerCpt = R.hooksComponent "G.C.GraphExplorer.explorer" cpt
where
cpt props@{frontends, graph, graphId, graphVersion, mCurrentRoute, mMetaData, session, sessions, showLogin, treeReload } _ = do
cpt props@{ frontends
, graph
, graphId
, graphVersion
, handed
, mCurrentRoute
, mMetaData
, session
, sessions
, showLogin
, treeReload } _ = do
dataRef <- R.useRef graph
graphRef <- R.useRef null
graphVersionRef <- R.useRef (fst graphVersion)
......@@ -125,6 +136,7 @@ explorerCpt = R.hooksComponent "G.C.GraphExplorer.explorer" cpt
[ rowControls [ Controls.controls controls ]
, R2.row [
tree { frontends
, handed
, mCurrentRoute
, reload: props.treeReload
, sessions
......@@ -165,9 +177,9 @@ explorerCpt = R.hooksComponent "G.C.GraphExplorer.explorer" cpt
tree :: Record TreeProps -> R.Element
tree { show: false } = RH.div { id: "tree" } []
tree { frontends, mCurrentRoute: route, reload, sessions, showLogin } =
tree { frontends, handed, mCurrentRoute: route, reload, sessions, showLogin } =
RH.div {className: "col-md-2 graph-tree"} [
forest { frontends, reload, route, sessions, showLogin }
forest { frontends, handed, reload, route, sessions, showLogin }
]
mSidebar :: Maybe GET.MetaData
......@@ -180,6 +192,7 @@ explorerCpt = R.hooksComponent "G.C.GraphExplorer.explorer" cpt
type TreeProps =
(
frontends :: Frontends
, handed :: Types.Handed
, mCurrentRoute :: AppRoute
, reload :: R.State Int
, sessions :: Sessions
......
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