Merge branch '289-dev-graph-view-refresh' of...

Merge branch '289-dev-graph-view-refresh' of ssh://gitlab.iscpif.fr:20022/gargantext/purescript-gargantext into dev-merge

dist/styles/sass.css

@@ -141,7 +141,7 @@
 }
 .graph-container #controls-container {
   position: absolute;
-  z-index: 999;
+  z-index: 900;
   backdrop-filter: blur(4px);
   background: rgba(255, 255, 255, 0.75);
   left: 0;
@@ -171,7 +171,7 @@
 }
 
 #dafixedtop {
-  z-index: 999;
+  z-index: 910;
 }
 
 #logo-designed {
@@ -540,7 +540,7 @@ li .leaf:hover a.settings {
   position: fixed;
   top: 3.7em;
   width: 15%;
-  z-index: 999;
+  z-index: 900;
 }
 
 .left-handed .forest-layout {

dist/styles/sass.css.map

-{"version":3,"sourceRoot":"","sources":["../../src/sass/_menu.sass","../../src/sass/_context_menu.sass","../../src/sass/_graph.sass","../../src/sass/_login.sass","../../src/sass/_tree.sass","../../src/sass/_code_editor.sass","../../src/sass/_styles.sass","../../src/sass/_range_slider.sass","../../src/sass/_annotation.sass","../../src/sass/_folder_view.sass"],"names":[],"mappings":"AAAA;AAEA;AACA;AACA;AACA;AACA;AAEA;EACI;EACA;;;AAEJ;EACI;EACA;EACA;EACA;;;AAEJ;EACE;;;AAEF;AACI;EACA;;;AAEJ;AACI;EACA;;;AAGJ;AACA;EACI;;;AAEJ;EACI;EACA;EACA;EACA;;;AAEJ;EACE;EACA;;;AAEF;EACE;;;AC7CF;EACE;EACA;EACA;EACA;EACA;;;AAEF;EACE;;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;;AAEF;EACE;EACA;EACA;;;AAEF;EACE;;;AClBF;EACE;EACA;EACA;;;AAEF;AAkCE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAxCA;EAZA;EACA;EAEA;EAWE;EACA;EACA;EACA;;AAEA;EACE;EACA;;AAEF;EACE;EACA;;AAGA;EACE;EACA;;AACN;EACE;;AACF;EACE;;AAEF;EApCA;EACA;EAEA;EAmCE;EACA;;AACF;EACE;;AACF;EACE;;AAWF;EAEE;EACA;EACA;EACA;EAEA;EACA;EACA;;AAEA;EACE;;AAEJ;EACE;;AAEA;EACE;;AAEJ;EACE;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;ACrFJ;EAEE;;;AAQF;EACE;;AACA;EACE;EACA;;;AAEJ;EACE;;;AAEF;EACE;;;AAEF;EACE;;;AAEF;EACE;;;AAGF;EACE;;AAEE;EACE;EACA;;AACA;EACE;;;AAIJ;EACE;EACA;EACA;EACA;;;AAKJ;EACE;EACA;EACA;;;AAGJ;EACE;EACA;EACA;EACA;EACA;;AACA;EACE;EACA;;AACF;EACE;EACA;;AACA;EACE;EACA;EACA;EACA;;AACA;EACE;;AACF;EACE;EACA;EACA;EACA;;AACA;EACE;;AACN;EACE;EACA;EACA;EACA;;;AAGN;EACE;EACA;EACA;EACA;EACA;;AAGE;EACE;;;AAEN;EACE;EACA;EACA;EACA;EACA;;AAGE;EACE;;;AAEN;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;;;AAEJ;EACE;EACA;;;AAGF;EACE;EACA;EACA;EACA;;AACA;EACE;EACA;;;AAGF;EACE;;;AAEJ;EACI;EACA;;;AAGF;EACE;;;AAEJ;EACE;;;AAEF;EACE;EACA;;;AAEF;EACE;EACA;EACA;;;AAEF;EACE;EACA;;;AAEF;EACE;;;ACzKF;EACE;;;AAGA;EACE;EACA;EACA;;AAEA;EACE;EACA;;AAGA;EACE;;AACF;EACE;;AAEJ;EACE;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;;AAGN;EACE;;;AAIA;EACE;;AACA;EACE;EACA;EACA;EACA;;AACF;EACE;EACA;EACA;EACA;EACA;;AACF;EACE;;AACF;EACE;EACA;EACA;EAEA;EACA;EACA;;AAEA;EACE;;AACF;EACE;;AAGN;EACE;;AACF;EACE;;AACA;EACE;EACA;;AAEE;EACE;EACA;;AACF;EACE;EACA;;AAIR;EACE;;AACF;EACE;;AACA;EACE;EACA;;AAEE;EACE;EACA;;AACF;EACE;EACA;;AACF;EACE;EACA;;AAEV;EACE;;AACF;EACE;;AAEE;EACE;;AACF;EACE;;AACN;EACE;;AAEE;EACE;;;AAGR;EACE;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EAEE;EACA;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;;AAEF;EACE;;;AAIF;EACE;;AAEA;EACE;;;AAGN;EACE;;AACF;EACE;;AACF;EACE;;;AAEJ;EACE;EACA;EACA;EACA;EACA;;;AAEA;EACE;;;AAEF;EACE;;;AC9JA;EACE;EACA;EACA;EACA;;AACA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AACA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EApCR;EACA;EACA;EACA;EACA;EACA;EACA;EAlBA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AA0CM;EACE;EACA;EACA;EACA;EACA;EA5CR;EACA;EACA;EACA;EACA;EACA;EACA;EAlBA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAkDE;EACE;EACA;EACA;EACA;EACA;EACA;;AACF;EACE;EACA;EACA;;AACA;EACE;EACA;;AACF;EACE;EACA;;AACF;EACE;EACA;;AAGE;EACE;;AAEF;EACE;;;ACtFZ;EACE;;;AAEA;EAEE;EACA;EACA;EACA;EACA;EACA;;AACA;EACE;;AAGE;EACE;EACA;;AAEF;EACE;EACA;;;AAER;EAEE;EACA;EACA;EACA;EACA;EACA;;AACA;EACE;;AAGE;EACE;EACA;;AAEF;EACE;EACA;;;AAEV;EACE;;AACA;EACE;;AACF;EACE;EACA;EACA;;;AAIA;EACE;;AACA;EACE;EACA;;AACF;EACE;;AACA;EACE;;AACJ;EACE;;;AAER;EACE;;;AAEF;EACE;;;AAEF;EACE;;;AAEF;AAGI;EACE;;AACF;EACE;;;AAEN;EACE;EACA;EACA;;;AAIA;EACE;;AACF;EACE;;;AAEJ;EACE;;AACA;EACE;;;AAEJ;EACE;EACA;;;ACtGF;EACE;AACA;EACA;;AAEA;EACE;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;EAEA;EAEA;;AAEA;EACE;EAEA;EACA;EACA;;;AAGN;EACE;;;ACxBJ;EACE;;AAEA;EANE;EACA;;AAQF;EAbE;EACA;;AAeF;EAhBE;EACA;;AAkBF;EAnBE;EACA;;AAqBF;EA1BE;EACA,kBANyB;;AAkC3B;EA7BE;EACA,kBAPqB;;AAsCvB;EAhCE;EACA,kBAJoB;;;AAuCtB;EApCE;EACA,kBANyB;;AA4C3B;EAvCE;EACA,kBAPqB;;AAgDvB;EA1CE;EACA,kBAJoB;;;ACRxB;EACE;EACA;EACA;EACA","file":"sass.css"}
\ No newline at end of file
+{"version":3,"sourceRoot":"","sources":["../../src/sass/_menu.sass","../../src/sass/_context_menu.sass","../../src/sass/_graph.sass","../../src/sass/_login.sass","../../src/sass/_tree.sass","../../src/sass/_code_editor.sass","../../src/sass/_styles.sass","../../src/sass/_range_slider.sass","../../src/sass/_annotation.sass","../../src/sass/_folder_view.sass"],"names":[],"mappings":"AAAA;AAEA;AACA;AACA;AACA;AACA;AAEA;EACI;EACA;;;AAEJ;EACI;EACA;EACA;EACA;;;AAEJ;EACE;;;AAEF;AACI;EACA;;;AAEJ;AACI;EACA;;;AAGJ;AACA;EACI;;;AAEJ;EACI;EACA;EACA;EACA;;;AAEJ;EACE;EACA;;;AAEF;EACE;;;AC7CF;EACE;EACA;EACA;EACA;EACA;;;AAEF;EACE;;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;;AAEF;EACE;EACA;EACA;;;AAEF;EACE;;;AClBF;EACE;EACA;EACA;;;AAEF;AAkCE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAxCA;EAZA;EACA;EAEA;EAWE;EACA;EACA;EACA;;AAEA;EACE;EACA;;AAEF;EACE;EACA;;AAGA;EACE;EACA;;AACN;EACE;;AACF;EACE;;AAEF;EApCA;EACA;EAEA;EAmCE;EACA;;AACF;EACE;;AACF;EACE;;AAWF;EAEE;EAEA;EACA;EACA;EAEA;EACA;EACA;;AAEA;EACE;;AAEJ;EACE;;AAEA;EACE;;AAEJ;EACE;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;ACtFJ;EAEE;;;AAQF;EACE;;AACA;EACE;EACA;;;AAEJ;EACE;;;AAEF;EACE;;;AAEF;EACE;;;AAEF;EACE;;;AAGF;EACE;;AAEE;EACE;EACA;;AACA;EACE;;;AAIJ;EACE;EACA;EACA;EACA;;;AAKJ;EACE;EACA;EACA;;;AAGJ;EACE;EACA;EACA;EACA;EACA;;AACA;EACE;EACA;;AACF;EACE;EACA;;AACA;EACE;EACA;EACA;EACA;;AACA;EACE;;AACF;EACE;EACA;EACA;EACA;;AACA;EACE;;AACN;EACE;EACA;EACA;EACA;;;AAGN;EACE;EACA;EACA;EACA;EACA;;AAGE;EACE;;;AAEN;EACE;EACA;EACA;EACA;EACA;;AAGE;EACE;;;AAEN;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;;;AAEJ;EACE;EACA;;;AAGF;EACE;EACA;EACA;EACA;;AACA;EACE;EACA;;;AAGF;EACE;;;AAEJ;EACI;EACA;;;AAGF;EACE;;;AAEJ;EACE;;;AAEF;EACE;EACA;;;AAEF;EACE;EACA;EACA;;;AAEF;EACE;EACA;;;AAEF;EACE;;;ACzKF;EACE;;;AAGA;EACE;EACA;EACA;;AAEA;EACE;EACA;;AAGA;EACE;;AACF;EACE;;AAEJ;EACE;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;;AAGN;EACE;;;AAIA;EACE;;AACA;EACE;EACA;EACA;EACA;;AACF;EACE;EACA;EACA;EACA;EACA;;AACF;EACE;;AACF;EACE;EACA;EACA;EAEA;EACA;EACA;;AAEA;EACE;;AACF;EACE;;AAGN;EACE;;AACF;EACE;;AACA;EACE;EACA;;AAEE;EACE;EACA;;AACF;EACE;EACA;;AAIR;EACE;;AACF;EACE;;AACA;EACE;EACA;;AAEE;EACE;EACA;;AACF;EACE;EACA;;AACF;EACE;EACA;;AAEV;EACE;;AACF;EACE;;AAEE;EACE;;AACF;EACE;;AACN;EACE;;AAEE;EACE;;;AAGR;EACE;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EAEE;EACA;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;;AAEF;EACE;;;AAIF;EACE;;AAEA;EACE;;;AAGN;EACE;;AACF;EACE;;AACF;EACE;;;AAEJ;EACE;EACA;EACA;EACA;EACA;;;AAEA;EACE;;;AAEF;EACE;;;AC9JA;EACE;EACA;EACA;EACA;;AACA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AACA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EApCR;EACA;EACA;EACA;EACA;EACA;EACA;EAlBA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AA0CM;EACE;EACA;EACA;EACA;EACA;EA5CR;EACA;EACA;EACA;EACA;EACA;EACA;EAlBA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAkDE;EACE;EACA;EACA;EACA;EACA;EACA;;AACF;EACE;EACA;EACA;;AACA;EACE;EACA;;AACF;EACE;EACA;;AACF;EACE;EACA;;AAGE;EACE;;AAEF;EACE;;;ACtFZ;EACE;;;AAEA;EAEE;EACA;EACA;EACA;EACA;EACA;;AACA;EACE;;AAGE;EACE;EACA;;AAEF;EACE;EACA;;;AAER;EAEE;EACA;EACA;EACA;EACA;EACA;;AACA;EACE;;AAGE;EACE;EACA;;AAEF;EACE;EACA;;;AAEV;EACE;;AACA;EACE;;AACF;EACE;EACA;EACA;;;AAIA;EACE;;AACA;EACE;EACA;;AACF;EACE;;AACA;EACE;;AACJ;EACE;;;AAER;EACE;;;AAEF;EACE;;;AAEF;EACE;;;AAEF;AAGI;EACE;;AACF;EACE;;;AAEN;EACE;EACA;EACA;;;AAIA;EACE;;AACF;EACE;;;AAEJ;EACE;;AACA;EACE;;;AAEJ;EACE;EACA;;;ACtGF;EACE;AACA;EACA;;AAEA;EACE;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;EAEA;EAEA;;AAEA;EACE;EAEA;EACA;EACA;;;AAGN;EACE;;;ACxBJ;EACE;;AAEA;EANE;EACA;;AAQF;EAbE;EACA;;AAeF;EAhBE;EACA;;AAkBF;EAnBE;EACA;;AAqBF;EA1BE;EACA,kBANyB;;AAkC3B;EA7BE;EACA,kBAPqB;;AAsCvB;EAhCE;EACA,kBAJoB;;;AAuCtB;EApCE;EACA,kBANyB;;AA4C3B;EAvCE;EACA,kBAPqB;;AAgDvB;EA1CE;EACA,kBAJoB;;;ACRxB;EACE;EACA;EACA;EACA","file":"sass.css"}
\ No newline at end of file

src/Gargantext/Components/FolderView.purs

@@ -97,13 +97,14 @@ type FolderProps =
 
 folder :: R2.Component FolderProps
 folder = R.createElement folderCpt
-
 folderCpt :: R.Component FolderProps
 folderCpt = here.component "folderCpt" cpt where
   cpt {style, text, nodeId, sid, nodeType} _ = do
-    pure $ H.a {className: "btn btn-primary", href: "/#/" <> getFolderPath nodeType sid nodeId}  [ H.i { className: icon style nodeType } []
-                                                                   , H.br {}
-                                                                   , H.text text]
+    pure $ H.a { className: "btn btn-primary"
+               , href: "/#/" <> getFolderPath nodeType sid nodeId }
+      [ H.i { className: icon style nodeType } []
+      , H.br {}
+      , H.text text ]
   
   icon :: FolderStyle -> GT.NodeType -> String
   icon FolderUp _ = "fa fa-folder-open"

src/Gargantext/Components/Forest/Tree.purs

@@ -51,10 +51,10 @@ type Universal =
 
 -- Shared by every component here + nodeSpan
 type Global =
-  ( frontends  :: Frontends
-  , handed     :: Handed
-  , route      :: T.Box AppRoute
-  , tasks       :: T.Box GAT.Storage
+  ( frontends :: Frontends
+  , handed    :: Handed
+  , route     :: T.Box AppRoute
+  , tasks     :: T.Box GAT.Storage
   | Universal )
 
 -- Shared by every component here
@@ -69,7 +69,6 @@ type LoaderProps = ( session :: Session, root :: ID | Common )
 -- | Loads and renders the tree starting at the given root node id.
 treeLoader :: R2.Component LoaderProps
 treeLoader = R.createElement treeLoaderCpt
-
 treeLoaderCpt :: R.Component LoaderProps
 treeLoaderCpt = here.component "treeLoader" cpt where
 -- treeLoaderCpt :: R.Memo LoaderProps
@@ -96,7 +95,6 @@ type TreeProps = ( tree :: FTree | NodeProps )
 
 tree :: R2.Leaf TreeProps
 tree props = R.createElement treeCpt props []
-
 treeCpt :: R.Component TreeProps
 treeCpt = here.component "tree" cpt where
   cpt p@{ reload, session, tree: NTree (LNode { id, name, nodeType }) children } _ = do
@@ -134,7 +132,6 @@ type ChildrenTreeProps =
 
 renderChildren :: R2.Component ChildrenTreeProps
 renderChildren = R.createElement renderChildrenCpt
-
 renderChildrenCpt :: R.Component ChildrenTreeProps
 renderChildrenCpt = here.component "renderChildren" cpt where
   cpt p@{ childProps: { folderOpen } } _ = do
@@ -147,7 +144,6 @@ renderChildrenCpt = here.component "renderChildren" cpt where
 
 renderTreeChildren :: R2.Component ChildrenTreeProps
 renderTreeChildren = R.createElement renderTreeChildrenCpt
-
 renderTreeChildrenCpt :: R.Component ChildrenTreeProps
 renderTreeChildrenCpt = here.component "renderTreeChildren" cpt where
   cpt p@{ childProps: { children'
@@ -180,7 +176,6 @@ type ChildLoaderProps = ( id :: ID, render :: R2.Leaf TreeProps | NodeProps )
 
 childLoader :: R2.Component ChildLoaderProps
 childLoader = R.createElement childLoaderCpt
-
 childLoaderCpt :: R.Component ChildLoaderProps
 childLoaderCpt = here.component "childLoader" cpt where
   cpt p@{ render } _ = do

src/Gargantext/Components/Forest/Tree/Node/Tools/SubTree.purs

@@ -39,7 +39,6 @@ type SubTreeParamsProps =
 
 subTreeView :: R2.Component SubTreeParamsProps
 subTreeView = R.createElement subTreeViewCpt
-
 subTreeViewCpt :: R.Component SubTreeParamsProps
 subTreeViewCpt = here.component "subTreeView" cpt
   where
@@ -86,7 +85,6 @@ type CorpusTreeProps =
 
 subTreeViewLoaded :: R2.Component CorpusTreeProps
 subTreeViewLoaded = R.createElement subTreeViewLoadedCpt
-
 subTreeViewLoadedCpt :: R.Component CorpusTreeProps
 subTreeViewLoadedCpt = here.component "subTreeViewLoaded" cpt
   where
@@ -107,7 +105,6 @@ newtype CorpusTreeRenderProps = CorpusTreeRenderProps
 
 subTreeTreeView :: CorpusTreeRenderProps -> Array R.Element -> R.Element
 subTreeTreeView = R2.ntCreateElement subTreeTreeViewCpt
-
 subTreeTreeViewCpt :: R2.NTComponent CorpusTreeRenderProps
 subTreeTreeViewCpt = here.ntComponent "subTreeTreeView" cpt where
   cpt (CorpusTreeRenderProps p@{ action

src/Gargantext/Components/Graph.purs

@@ -9,7 +9,6 @@ import Data.Either (Either(..))
 import Data.Generic.Rep (class Generic)
 import Data.Maybe (Maybe(..))
 import Data.Nullable (Nullable)
-import DOM.Simple.Console (log, log2)
 import DOM.Simple.Types (Element)
 import Reactix as R
 import Reactix.DOM.HTML as RH
@@ -70,12 +69,12 @@ graphCpt = here.component "graph" cpt where
 
       R.useEffectOnce $ do
         pure $ do
-          log "[graphCpt (Cleanup)]"
+          here.log "[graphCpt (Cleanup)]"
           Sigmax.dependOnSigma (R.readRef sigmaRef) "[graphCpt (Cleanup)] no sigma" $ \sigma -> do
             Sigma.stopForceAtlas2 sigma
-            log2 "[graphCpt (Cleanup)] forceAtlas stopped for" sigma
+            here.log2 "[graphCpt (Cleanup)] forceAtlas stopped for" sigma
             Sigma.kill sigma
-            log "[graphCpt (Cleanup)] sigma killed"
+            here.log "[graphCpt (Cleanup)] sigma killed"
 
       -- NOTE: This div is not empty after sigma initializes.
       -- When we change state, we make it empty though.
@@ -93,7 +92,7 @@ graphCpt = here.component "graph" cpt where
           Nothing -> do
             eSigma <- Sigma.sigma {settings: sigmaSettings}
             case eSigma of
-              Left err -> log2 "[graphCpt] error creating sigma" err
+              Left err -> here.log2 "[graphCpt] error creating sigma" err
               Right sig -> do
                 Sigmax.writeSigma rSigma $ Just sig
 
@@ -115,7 +114,7 @@ graphCpt = here.component "graph" cpt where
 
                 Sigmax.setEdges sig false
 
-                -- log2 "[graph] startForceAtlas" startForceAtlas
+                -- here.log2 "[graph] startForceAtlas" startForceAtlas
                 if startForceAtlas then
                   Sigma.startForceAtlas2 sig fa2
                 else

src/Gargantext/Components/GraphExplorer.purs

 module Gargantext.Components.GraphExplorer where
 
-import Gargantext.Prelude hiding (max,min)
-
 import Data.Array as A
 import Data.FoldableWithIndex (foldMapWithIndex)
 import Data.Int (toNumber)
@@ -21,21 +19,18 @@ import Record as Record
 import Record.Extra as RX
 import Toestand as T
 
-import Gargantext.AsyncTasks as GAT
+import Gargantext.Prelude hiding (max,min)
+
 import Gargantext.Components.App.Data (Boxes)
 import Gargantext.Components.Graph as Graph
 import Gargantext.Components.GraphExplorer.Controls as Controls
-import Gargantext.Components.GraphExplorer.Search (nodeSearchControl)
 import Gargantext.Components.GraphExplorer.Sidebar.Types as GEST
-import Gargantext.Components.GraphExplorer.ToggleButton as Toggle
 import Gargantext.Components.GraphExplorer.Types as GET
 import Gargantext.Data.Louvain as Louvain
-import Gargantext.Ends (Frontends, Backend)
 import Gargantext.Hooks.Loader (useLoader)
-import Gargantext.Hooks.Sigmax as Sigmax
 import Gargantext.Hooks.Sigmax.Types as SigmaxT
-import Gargantext.Routes (SessionRoute(NodeAPI), AppRoute)
-import Gargantext.Sessions (OpenNodes, Session, Sessions, get)
+import Gargantext.Routes (SessionRoute(NodeAPI))
+import Gargantext.Sessions (Session, get)
 import Gargantext.Types as Types
 import Gargantext.Utils.Range as Range
 import Gargantext.Utils.Reactix as R2
@@ -45,54 +40,42 @@ here :: R2.Here
 here = R2.here "Gargantext.Components.GraphExplorer"
 
 type BaseProps =
-  ( backend        :: T.Box (Maybe Backend)
-  , boxes          :: Boxes
-  , frontends      :: Frontends
+  ( boxes          :: Boxes
   , graphId        :: GET.GraphId
-  , handed         :: T.Box Types.Handed
-  , route          :: T.Box AppRoute
-  , sessions       :: T.Box Sessions
-  , showLogin      :: T.Box Boolean
-  , tasks          :: T.Box GAT.Storage
   )
 
 type LayoutProps =
   ( session      :: Session
   | BaseProps )
 
-type GraphWriteProps =
+type Props =
   ( graph          :: SigmaxT.SGraph
   , hyperdataGraph :: GET.HyperdataGraph
-  , mMetaData'     :: Maybe GET.MetaData
   | LayoutProps
   )
 
-type Props =
-  ( graph          :: SigmaxT.SGraph
-  , hyperdataGraph :: GET.HyperdataGraph
-  | LayoutProps
+type GraphWriteProps =
+  ( mMetaData'     :: Maybe GET.MetaData
+  | Props
   )
 
 --------------------------------------------------------------
 explorerLayout :: R2.Component LayoutProps
 explorerLayout = R.createElement explorerLayoutCpt
-
 explorerLayoutCpt :: R.Component LayoutProps
 explorerLayoutCpt = here.component "explorerLayout" cpt where
-  cpt props@{ backend, boxes: { graphVersion }, graphId, session } _ = do
+  cpt props@{ boxes: { graphVersion }, graphId, session } _ = do
     graphVersion' <- T.useLive T.unequal graphVersion
 
     useLoader graphId (getNodes session graphVersion') handler
     where
-      handler loaded = explorerWriteGraph (Record.merge props { graph, hyperdataGraph: loaded, mMetaData' }) []
-        -- explorer (Record.merge props { graph, graphVersion, hyperdataGraph: loaded, mMetaData })
+      handler loaded@(GET.HyperdataGraph { graph: hyperdataGraph }) =
+        explorerWriteGraph (Record.merge props { graph, hyperdataGraph: loaded, mMetaData' }) []
         where
-          GET.HyperdataGraph { graph: hyperdataGraph } = loaded
           Tuple mMetaData' graph = convert hyperdataGraph
 
 explorerWriteGraph :: R2.Component GraphWriteProps
 explorerWriteGraph = R.createElement explorerWriteGraphCpt
-
 explorerWriteGraphCpt :: R.Component GraphWriteProps
 explorerWriteGraphCpt = here.component "explorerWriteGraph" cpt where
   cpt props@{ boxes: { sidePanelGraph, sidePanelState }
@@ -108,41 +91,24 @@ explorerWriteGraphCpt = here.component "explorerWriteGraph" cpt where
                        , showControls: false
                        , sideTab: GET.SideTabLegend }) sidePanelGraph
 
-      -- { mGraph, mMetaData, sideTab } <- GEST.focusedSidePanel sidePanelGraph
-
-      -- R.useEffect' $ do
-      --   here.log2 "writing graph" graph
-      --   T.write_ (Just graph) mGraph
-      --   T.write_ mMetaData' mMetaData
-
       pure $ explorer (RX.pick props :: Record Props) []
 
 --------------------------------------------------------------
 explorer :: R2.Component Props
 explorer = R.createElement explorerCpt
-
 explorerCpt :: R.Component Props
 explorerCpt = here.component "explorer" cpt
   where
-    cpt props@{ backend
-              , boxes: boxes@{ graphVersion, reloadForest, showTree, sidePanelGraph, sidePanelState }
-              , frontends
+    cpt props@{ boxes: boxes@{ graphVersion, handed, reloadForest, showTree, sidePanelGraph, sidePanelState }
               , graph
               , graphId
-              , handed
               , hyperdataGraph
-              , route
               , session
-              , sessions
-              , showLogin
-              , tasks
               } _ = do
       { mMetaData, sideTab } <- GEST.focusedSidePanel sidePanelGraph
-      handed' <- T.useLive T.unequal handed
       graphVersion' <- T.useLive T.unequal graphVersion
-      graphVersionRef <- R.useRef graphVersion'
+      handed' <- T.useLive T.unequal handed
       mMetaData' <- T.useLive T.unequal mMetaData
-      -- sideTab <- T.useBox GET.SideTabLegend
 
       let startForceAtlas = maybe true (\(GET.MetaData { startForceAtlas: sfa }) -> sfa) mMetaData'
 
@@ -160,127 +126,68 @@ explorerCpt = here.component "explorer" cpt
                                             , session
                                             , showTree
                                             , sidePanel: sidePanelGraph
-                                            , sidePanelState
-                                            }
-      multiSelectEnabled' <- T.useLive T.unequal controls.multiSelectEnabled
-      showTree' <- T.useLive T.unequal controls.showTree
-      multiSelectEnabledRef <- R.useRef multiSelectEnabled'
+                                            , sidePanelState }
 
-      forestOpen <- T.useBox $ (Set.empty :: OpenNodes)
-      R.useEffectOnce' $ do
-        R2.loadLocalStorageState R2.openNodesKey forestOpen
-        T.listen (R2.listenLocalStorageState R2.openNodesKey) forestOpen
-
-      R.useEffect' $ do
-        let readData = R.readRef dataRef
-        let gv = R.readRef graphVersionRef
-        if SigmaxT.eqGraph readData graph then
-          pure unit
-        else do
-          -- Graph data changed, reinitialize sigma.
-          let rSigma = R.readRef controls.sigmaRef
-          Sigmax.cleanupSigma rSigma "explorerCpt"
-          R.setRef dataRef graph
-          R.setRef graphVersionRef graphVersion'
-          -- Reinitialize bunch of state as well.
-          T.write_ SigmaxT.emptyNodeIds controls.removedNodeIds
-          T.write_ SigmaxT.emptyNodeIds controls.selectedNodeIds
-          T.write_ SigmaxT.EShow controls.showEdges
-          T.write_ forceAtlasS controls.forceAtlasState
-          T.write_ Graph.Init controls.graphStage
-          T.write_ Types.InitialClosed controls.sidePanelState
+      -- graphVersionRef <- R.useRef graphVersion'
+      -- R.useEffect' $ do
+      --   let readData = R.readRef dataRef
+      --   let gv = R.readRef graphVersionRef
+      --   if SigmaxT.eqGraph readData graph then
+      --     pure unit
+      --   else do
+      --     -- Graph data changed, reinitialize sigma.
+      --     let rSigma = R.readRef controls.sigmaRef
+      --     Sigmax.cleanupSigma rSigma "explorerCpt"
+      --     R.setRef dataRef graph
+      --     R.setRef graphVersionRef graphVersion'
+      --     -- Reinitialize bunch of state as well.
+      --     T.write_ SigmaxT.emptyNodeIds controls.removedNodeIds
+      --     T.write_ SigmaxT.emptyNodeIds controls.selectedNodeIds
+      --     T.write_ SigmaxT.EShow controls.showEdges
+      --     T.write_ forceAtlasS controls.forceAtlasState
+      --     T.write_ Graph.Init controls.graphStage
+      --     T.write_ Types.InitialClosed controls.sidePanelState
 
       pure $
         RH.div { className: "graph-meta-container" }
         [ RH.div { className: "graph-container" }
-          [ inner handed'
+          [ RH.div { className: "container-fluid " <> hClass handed' }
             [ RH.div { id: "controls-container" } [ Controls.controls controls [] ]
             , RH.div { className: "row graph-row" }
               [ RH.div { ref: graphRef, id: "graph-view", className: "col-md-12" } []
               , graphView { controls
                           , elRef: graphRef
-                          , graphId
                           , graph
                           , hyperdataGraph
                           , mMetaData
-                          , multiSelectEnabledRef
                           } []
               ]
             ]
           ]
         ]
 
-    inner h = RH.div { className: "container-fluid " <> hClass }
-      where
-        hClass = case h of
-          Types.LeftHanded  -> "lefthanded"
-          Types.RightHanded -> "righthanded"
-
-type TopBar =
-  (
-    boxes    :: Boxes
-  )
-
-topBar :: R2.Component TopBar
-topBar = R.createElement topBarCpt
-
-topBarCpt :: R.Component TopBar
-topBarCpt = here.component "topBar" cpt where
-  cpt { boxes: { showTree
-               , sidePanelGraph
-               , sidePanelState } } _ = do
-    { mGraph, multiSelectEnabled, selectedNodeIds, showControls } <- GEST.focusedSidePanel sidePanelGraph
-
-    mGraph' <- T.useLive T.unequal mGraph
-
-    let search = case mGraph' of
-          Just graph -> nodeSearchControl { graph
-                                         , multiSelectEnabled
-                                         , selectedNodeIds } []
-          Nothing -> RH.div {} []
-
-    pure $ RH.form { className: "d-flex" }
-      [ Toggle.treeToggleButton { state: showTree } []
-      , Toggle.controlsToggleButton { state: showControls } []
-      , Toggle.sidebarToggleButton { state: sidePanelState } []
-      , search
-      -- [ col [ spaces [ Toggle.treeToggleButton { state: showTree } [] ]]
-      -- , col [ spaces [ Toggle.controlsToggleButton { state: showControls } [] ]]
-      -- , col [ spaces [ Toggle.sidebarToggleButton { state: sidePanelState } [] ]]
-      -- , col [ spaces [ search ] ]
-      ]
-    where
-      -- rowToggle  = RH.div { id: "toggle-container" }
-      rowToggle  = RH.ul { className: "navbar-nav ml-auto mr-auto" }
-      -- col       = RH.div { className: "col-md-4" }
-      col = RH.li { className: "nav-item" }
-      -- spaces    = RH.div { className: "flex-space-between" }
-      spaces = RH.a { className: "nav-link" }
+    hClass h = case h of
+      Types.LeftHanded  -> "lefthanded"
+      Types.RightHanded -> "righthanded"
 
 type GraphProps = (
-    controls              :: Record Controls.Controls
-  , elRef                 :: R.Ref (Nullable Element)
-  , graphId               :: GET.GraphId
-  , graph                 :: SigmaxT.SGraph
-  , hyperdataGraph        :: GET.HyperdataGraph
-  , mMetaData             :: T.Box (Maybe GET.MetaData)
-  , multiSelectEnabledRef :: R.Ref Boolean
+    controls       :: Record Controls.Controls
+  , elRef          :: R.Ref (Nullable Element)
+  , graph          :: SigmaxT.SGraph
+  , hyperdataGraph :: GET.HyperdataGraph
+  , mMetaData      :: T.Box (Maybe GET.MetaData)
 )
 
 graphView :: R2.Component GraphProps
---graphView sigmaRef props = R.createElement (R.memo el memoCmp) props []
 graphView = R.createElement graphViewCpt
-
 graphViewCpt :: R.Component GraphProps
 graphViewCpt = here.component "graphView" cpt
   where
     cpt { controls
         , elRef
-        , graphId
         , graph
         , hyperdataGraph: GET.HyperdataGraph { mCamera }
-        , mMetaData
-        , multiSelectEnabledRef } _children = do
+        , mMetaData } _children = do
       edgeConfluence' <- T.useLive T.unequal controls.edgeConfluence
       edgeWeight' <- T.useLive T.unequal controls.edgeWeight
       mMetaData' <- T.useLive T.unequal mMetaData
@@ -291,6 +198,8 @@ graphViewCpt = here.component "graphView" cpt
       showEdges' <- T.useLive T.unequal controls.showEdges
       showLouvain' <- T.useLive T.unequal controls.showLouvain
 
+      multiSelectEnabledRef <- R.useRef multiSelectEnabled'
+
       -- TODO Cache this?
       let louvainGraph =
             if showLouvain' then

src/Gargantext/Components/GraphExplorer/Controls.purs

@@ -67,7 +67,6 @@ initialLocalControls = do
 
 controls :: R2.Component Controls
 controls = R.createElement controlsCpt
-
 controlsCpt :: R.Component Controls
 controlsCpt = here.component "controls" cpt
   where
@@ -246,14 +245,9 @@ useGraphControls { forceAtlasS
     }
   forceAtlasState <- T.useBox forceAtlasS
   graphStage      <- T.useBox Graph.Init
-  -- multiSelectEnabled <- T.useBox false
   nodeSize <- T.useBox $ Range.Closed { min: 0.0, max: 100.0 }
-  -- removedNodeIds <- T.useBox SigmaxT.emptyNodeIds
-  -- selectedNodeIds <- T.useBox SigmaxT.emptyNodeIds
-  -- showControls    <- T.useBox false
   showEdges <- T.useBox SigmaxT.EShow
   showLouvain <- T.useBox false
-  -- sidePanelState   <- T.useBox GT.InitialClosed
   sigma <- Sigmax.initSigma
   sigmaRef <- R.useRef sigma
 

src/Gargantext/Components/GraphExplorer/ControlsToggleButton.purs

@@ -2,7 +2,6 @@ module Gargantext.Components.GraphExplorer.ControlsToggleButton
   ( Props, controlsToggleButton, controlsToggleButtonCpt
   ) where
 
-import Data.Tuple.Nested ((/\))
 import Reactix as R
 import Reactix.DOM.HTML as H
 import Toestand as T
@@ -16,7 +15,7 @@ here = R2.here "Gargantext.Components.GraphExplorer.ControlsToggleButton"
 
 type Props = ( state :: T.Box Boolean )
 
-controlsToggleButton :: Record Props -> R.Element
+controlsToggleButton :: R2.Leaf Props
 controlsToggleButton props = R.createElement controlsToggleButtonCpt props []
 
 controlsToggleButtonCpt :: R.Component Props

src/Gargantext/Components/GraphExplorer/SlideButton.purs

@@ -34,7 +34,7 @@ sizeButtonCpt :: R.Component Props
 sizeButtonCpt = here.component "sizeButton" cpt where
   cpt { state, caption, min, max, onChange } _ = do
     defaultValue <- T.useLive T.unequal state
-    pure $ H.span { class: "range-simple" }
+    pure $ H.span { className: "range-simple" }
       [ H.label {} [ R2.small {} [ H.text caption ] ]
       , H.input { type: "range"
                 , className: "form-control"

src/Gargantext/Components/GraphExplorer/ToggleButton.purs

@@ -35,7 +35,6 @@ type Props = (
 
 toggleButton :: R2.Component Props
 toggleButton = R.createElement toggleButtonCpt
-
 toggleButtonCpt :: R.Component Props
 toggleButtonCpt = here.component "toggleButton" cpt
   where
@@ -46,9 +45,9 @@ toggleButtonCpt = here.component "toggleButton" cpt
         , style } _ = do
       state' <- T.useLive T.unequal state
 
-      pure $ H.button { className: "btn btn-outline-" <> style <> " " <> cls state' <> " mx-2"
-                      , on: { click: onClick }
-                      } [ R2.small {} [ H.text (text onMessage offMessage state') ] ]
+      pure $ H.div { className: "btn btn-outline-" <> style <> " " <> cls state' <> " mx-2"
+                   , on: { click: onClick }
+                   } [ R2.small {} [ H.text (text onMessage offMessage state') ] ]
 
     cls true = "active"
     cls false = ""
@@ -61,7 +60,6 @@ type ControlsToggleButtonProps = (
 
 controlsToggleButton :: R2.Component ControlsToggleButtonProps
 controlsToggleButton = R.createElement controlsToggleButtonCpt
-
 controlsToggleButtonCpt :: R.Component ControlsToggleButtonProps
 controlsToggleButtonCpt = here.component "controlsToggleButton" cpt
   where
@@ -80,7 +78,6 @@ type EdgesButtonProps = (
 
 edgesToggleButton :: R2.Component EdgesButtonProps
 edgesToggleButton = R.createElement edgesToggleButtonCpt
-
 edgesToggleButtonCpt :: R.Component EdgesButtonProps
 edgesToggleButtonCpt = here.component "edgesToggleButton" cpt
   where
@@ -105,7 +102,6 @@ type LouvainToggleButtonProps = (
 
 louvainToggleButton :: R2.Component LouvainToggleButtonProps
 louvainToggleButton = R.createElement louvainToggleButtonCpt
-
 louvainToggleButtonCpt :: R.Component LouvainToggleButtonProps
 louvainToggleButtonCpt = here.component "louvainToggleButton" cpt
   where
@@ -124,7 +120,6 @@ type MultiSelectEnabledButtonProps = (
 
 multiSelectEnabledButton :: R2.Component MultiSelectEnabledButtonProps
 multiSelectEnabledButton = R.createElement multiSelectEnabledButtonCpt
-
 multiSelectEnabledButtonCpt :: R.Component MultiSelectEnabledButtonProps
 multiSelectEnabledButtonCpt = here.component "lmultiSelectEnabledButton" cpt
   where
@@ -143,7 +138,6 @@ type ForceAtlasProps = (
 
 pauseForceAtlasButton :: R2.Component ForceAtlasProps
 pauseForceAtlasButton = R.createElement pauseForceAtlasButtonCpt
-
 pauseForceAtlasButtonCpt :: R.Component ForceAtlasProps
 pauseForceAtlasButtonCpt = here.component "forceAtlasToggleButton" cpt
   where
@@ -171,7 +165,6 @@ type TreeToggleButtonProps = (
 
 treeToggleButton :: R2.Component TreeToggleButtonProps
 treeToggleButton = R.createElement treeToggleButtonCpt
-
 treeToggleButtonCpt :: R.Component TreeToggleButtonProps
 treeToggleButtonCpt = here.component "treeToggleButton" cpt
   where
@@ -190,16 +183,15 @@ type SidebarToggleButtonProps = (
 
 sidebarToggleButton :: R2.Component SidebarToggleButtonProps
 sidebarToggleButton = R.createElement sidebarToggleButtonCpt
-
 sidebarToggleButtonCpt :: R.Component SidebarToggleButtonProps
 sidebarToggleButtonCpt = here.component "sidebarToggleButton" cpt
   where
     cpt { state } _ = do
       state' <- T.useLive T.unequal state
 
-      pure $ H.button { className: "btn btn-outline-light " <> cls state'
-                      , on: { click: onClick state }
-                      } [ R2.small {} [ H.text (text onMessage offMessage state') ] ]
+      pure $ H.div { className: "btn btn-outline-light " <> cls state'
+                   , on: { click: onClick state }
+                   } [ R2.small {} [ H.text (text onMessage offMessage state') ] ]
 
     cls GT.Opened = "active"
     cls _         = ""

src/Gargantext/Components/GraphExplorer/TopBar.purs

+module Gargantext.Components.GraphExplorer.TopBar where
+
+import Data.Maybe (Maybe(..))
+import Reactix as R
+import Reactix.DOM.HTML as RH
+import Toestand as T
+
+import Gargantext.Prelude hiding (max,min)
+
+import Gargantext.Components.App.Data (Boxes)
+import Gargantext.Components.GraphExplorer.Search (nodeSearchControl)
+import Gargantext.Components.GraphExplorer.Sidebar.Types as GEST
+import Gargantext.Components.GraphExplorer.ToggleButton as Toggle
+import Gargantext.Utils.Reactix as R2
+
+here :: R2.Here
+here = R2.here "Gargantext.Components.GraphExplorer.TopBar"
+
+type TopBar =
+  (
+    boxes    :: Boxes
+  )
+
+topBar :: R2.Leaf TopBar
+topBar p = R.createElement topBarCpt p []
+topBarCpt :: R.Component TopBar
+topBarCpt = here.component "topBar" cpt where
+  cpt { boxes: { showTree
+               , sidePanelGraph
+               , sidePanelState } } _ = do
+    { mGraph, multiSelectEnabled, selectedNodeIds, showControls } <- GEST.focusedSidePanel sidePanelGraph
+
+    mGraph' <- T.useLive T.unequal mGraph
+
+    let search = case mGraph' of
+          Just graph -> nodeSearchControl { graph
+                                         , multiSelectEnabled
+                                         , selectedNodeIds } []
+          Nothing -> RH.div {} []
+
+    pure $ RH.form { className: "d-flex" }
+      [ Toggle.treeToggleButton { state: showTree } []
+      , Toggle.controlsToggleButton { state: showControls } []
+      , Toggle.sidebarToggleButton { state: sidePanelState } []
+      , search
+      ]
+    where
+      rowToggle  = RH.ul { className: "navbar-nav ml-auto mr-auto" }
+      col = RH.li { className: "nav-item" }
+      spaces = RH.a { className: "nav-link" }

src/Gargantext/Components/Node.purs

@@ -25,8 +25,8 @@ instance decodeNodePoly :: (DecodeJson a)
     obj <- decodeJson json
     id        <- obj .: "id"
     typename  <- obj .: "typename"
-    userId    <- obj .: "user_id"
-    parentId  <- obj .: "parent_id"
+    userId    <- obj .: "userId"
+    parentId  <- obj .: "parentId"
     name      <- obj .: "name"
     date      <- obj .: "date"
 

src/Gargantext/Components/Nodes/Annuaire.purs

@@ -191,7 +191,6 @@ type ContactCellsProps =
 
 contactCells :: Record ContactCellsProps -> R.Element
 contactCells p = R.createElement contactCellsCpt p []
-
 contactCellsCpt :: R.Component ContactCellsProps
 contactCellsCpt = here.component "contactCells" cpt where
   cpt { annuaireId, frontends, session
@@ -269,8 +268,8 @@ instance decodeAnnuaireInfo :: DecodeJson AnnuaireInfo where
     obj <- decodeJson json
     id        <- obj .: "id"
     typename  <- obj .: "typename"
-    userId    <- obj .: "user_id"
-    parentId  <- obj .: "parent_id"
+    userId    <- obj .: "userId"
+    parentId  <- obj .: "parentId"
     name      <- obj .: "name"
     date      <- obj .: "date"
     hyperdata <- obj .: "hyperdata"

src/Gargantext/Components/Nodes/Annuaire/User/Contacts/Types.purs

@@ -34,9 +34,9 @@ instance decodeNodeContact :: DecodeJson NodeContact where
     hyperdata <- obj .: "hyperdata"
     id        <- obj .: "id"
     name      <- obj .:! "name"
-    parentId  <- obj .?| "parent_id"
+    parentId  <- obj .?| "parentId"
     typename  <- obj .?| "typename"
-    userId    <- obj .:! "user_id"
+    userId    <- obj .:! "userId"
 
     pure $ NodeContact { id
                    , date
@@ -70,9 +70,9 @@ instance decodeContact' :: DecodeJson Contact' where
     hyperdata <- obj .: "hyperdata"
     id        <- obj .: "id"
     name      <- obj .:! "name"
-    parentId  <- obj .?| "parent_id"
+    parentId  <- obj .?| "parentId"
     typename  <- obj .?| "typename"
-    userId    <- obj .:! "user_id"
+    userId    <- obj .:! "userId"
 
     pure $ Contact' { id
                    , date
@@ -106,9 +106,9 @@ instance decodeContact :: DecodeJson Contact where
     hyperdata <- obj .: "hyperdata"
     id        <- obj .: "id"
     name      <- obj .:! "name"
-    parentId  <- obj .?| "parent_id"
+    parentId  <- obj .?| "parentId"
     typename  <- obj .?| "typename"
-    userId    <- obj .:! "user_id"
+    userId    <- obj .:! "userId"
 
     pure $ Contact { id
                    , date
@@ -139,9 +139,9 @@ instance decodeUser :: DecodeJson User where
     hyperdata <- obj .: "hyperdata"
     id        <- obj .: "id"
     name      <- obj .:! "name"
-    parentId  <- obj .?| "parent_id"
+    parentId  <- obj .?| "parentId"
     typename  <- obj .?| "typename"
-    userId    <- obj .:! "user_id"
+    userId    <- obj .:! "userId"
 
     pure $ User { id
                 , date

src/Gargantext/Components/Router.purs

@@ -17,6 +17,7 @@ import Gargantext.Components.Forest as Forest
 import Gargantext.Components.GraphExplorer as GraphExplorer
 import Gargantext.Components.GraphExplorer.Sidebar as GES
 import Gargantext.Components.GraphExplorer.Sidebar.Types as GEST
+import Gargantext.Components.GraphExplorer.TopBar as GETB
 import Gargantext.Components.Lang (LandingLang(LL_EN))
 import Gargantext.Components.Login (login)
 import Gargantext.Components.MainPage as MainPage
@@ -64,18 +65,18 @@ routerCpt = here.component "router" cpt where
           RightHanded -> "right-handed"
 
     pure $ R.fragment
-      ([ loginModal { boxes } []
-       , topBar { boxes } [] ] <>
+      ([ loginModal { boxes }
+       , topBar { boxes } ] <>
        [ H.div { className: handedClassName } $ reverseHanded handed' $
-         [ forest { boxes } []
-         , mainPage { boxes } []
-         , sidePanel { boxes } []
+         [ forest { boxes }
+         , mainPage { boxes }
+         , sidePanel { boxes }
          ]
        ])
 
 
-loginModal :: R2.Component Props
-loginModal = R.createElement loginModalCpt
+loginModal :: R2.Leaf Props
+loginModal p = R.createElement loginModalCpt p []
 loginModalCpt :: R.Component Props
 loginModalCpt = here.component "loginModal" cpt
   where
@@ -84,8 +85,8 @@ loginModalCpt = here.component "loginModal" cpt
 
         pure $ if showLogin' then login' boxes else H.div {} []
 
-topBar :: R2.Component Props
-topBar = R.createElement topBarCpt
+topBar :: R2.Leaf Props
+topBar p = R.createElement topBarCpt p []
 topBarCpt :: R.Component Props
 topBarCpt = here.component "topBar" cpt where
   cpt props@{ boxes: boxes@{ handed
@@ -93,20 +94,20 @@ topBarCpt = here.component "topBar" cpt where
     route' <- T.useLive T.unequal boxes.route
 
     let children = case route' of
-          GR.PGraphExplorer s g -> [ GraphExplorer.topBar { boxes } [] ]
+          GR.PGraphExplorer s g -> [ GETB.topBar { boxes } ]
           _                     -> []
 
     pure $ TopBar.topBar { handed } children
 
-mainPage :: R2.Component Props
-mainPage = R.createElement mainPageCpt
+mainPage :: R2.Leaf Props
+mainPage p = R.createElement mainPageCpt p []
 mainPageCpt :: R.Component Props
 mainPageCpt = here.component "mainPage" cpt where
   cpt { boxes } _ = do
-    pure $ MainPage.mainPage { boxes } [ renderRoute { boxes } [] ]
+    pure $ MainPage.mainPage { boxes } [ renderRoute { boxes } ]
 
-forest :: R2.Component Props
-forest = R.createElement forestCpt
+forest :: R2.Leaf Props
+forest p = R.createElement forestCpt p []
 forestCpt :: R.Component Props
 forestCpt = here.component "forest" cpt where
   cpt props@{ boxes: boxes@{ backend
@@ -133,8 +134,8 @@ forestCpt = here.component "forest" cpt where
                                , showTree
                                , tasks } []
 
-sidePanel :: R2.Component Props
-sidePanel = R.createElement sidePanelCpt
+sidePanel :: R2.Leaf Props
+sidePanel p = R.createElement sidePanelCpt p []
 sidePanelCpt :: R.Component Props
 sidePanelCpt = here.component "sidePanel" cpt where
   cpt props@{ boxes: boxes@{ graphVersion
@@ -154,8 +155,8 @@ sidePanelCpt = here.component "sidePanel" cpt where
           Opened -> pure $ openedSidePanel (Record.merge { session: s } props) []
           _      -> pure $ H.div {} []
 
-renderRoute :: R2.Component Props
-renderRoute = R.createElement renderRouteCpt
+renderRoute :: R2.Leaf Props
+renderRoute p = R.createElement renderRouteCpt p []
 renderRouteCpt :: R.Component Props
 renderRouteCpt = here.component "renderRoute" cpt where
   cpt props@{ boxes } _ = do
@@ -213,7 +214,6 @@ authedCpt = here.component "authed" cpt where
 
 openedSidePanel :: R2.Component (WithSession Props)
 openedSidePanel = R.createElement openedSidePanelCpt
-
 openedSidePanelCpt :: R.Component (WithSession Props)
 openedSidePanelCpt = here.component "openedSidePanel" cpt where
   cpt props@{ boxes: boxes@{ graphVersion
@@ -263,7 +263,6 @@ openedSidePanelCpt = here.component "openedSidePanel" cpt where
 
 annuaire :: R2.Component SessionNodeProps
 annuaire = R.createElement annuaireCpt
-
 annuaireCpt :: R.Component SessionNodeProps
 annuaireCpt = here.component "annuaire" cpt where
   cpt props@{ boxes, nodeId } _ = do
@@ -275,7 +274,6 @@ annuaireCpt = here.component "annuaire" cpt where
 
 corpus :: R2.Component SessionNodeProps
 corpus = R.createElement corpusCpt
-
 corpusCpt :: R.Component SessionNodeProps
 corpusCpt = here.component "corpus" cpt where
   cpt props@{ boxes, nodeId } _ = do
@@ -291,7 +289,6 @@ type CorpusDocumentProps =
 
 corpusDocument :: R2.Component CorpusDocumentProps
 corpusDocument = R.createElement corpusDocumentCpt
-
 corpusDocumentCpt :: R.Component CorpusDocumentProps
 corpusDocumentCpt = here.component "corpusDocument" cpt
   where
@@ -305,7 +302,6 @@ corpusDocumentCpt = here.component "corpusDocument" cpt
 
 dashboard :: R2.Component SessionNodeProps
 dashboard = R.createElement dashboardCpt
-
 dashboardCpt :: R.Component SessionNodeProps
 dashboardCpt = here.component "dashboard" cpt
   where
@@ -318,7 +314,6 @@ type DocumentProps = ( listId :: ListId | SessionNodeProps )
 
 document :: R2.Component DocumentProps
 document = R.createElement documentCpt
-
 documentCpt :: R.Component DocumentProps
 documentCpt = here.component "document" cpt where
   cpt props@{ boxes, listId, nodeId } _ = do
@@ -331,35 +326,18 @@ documentCpt = here.component "document" cpt where
 
 graphExplorer :: R2.Component SessionNodeProps
 graphExplorer = R.createElement graphExplorerCpt
-
 graphExplorerCpt :: R.Component SessionNodeProps
 graphExplorerCpt = here.component "graphExplorer" cpt where
-  cpt props@{ boxes: boxes@{ backend
-                           , handed
-                           , route
-                           , sessions
-                           , showLogin
-                           , sidePanelGraph
-                           , sidePanelState
-                           , tasks }
+  cpt props@{ boxes
             , nodeId } _ = do
     let sessionProps = RE.pick props :: Record SessionProps
     pure $ authed (Record.merge { content: \session ->
-                                   -- simpleLayout { handed }
-                                   GraphExplorer.explorerLayout { backend
-                                                                , boxes
-                                                                , frontends: defaultFrontends
+                                   GraphExplorer.explorerLayout { boxes
                                                                 , graphId: nodeId
-                                                                , handed
-                                                                , route
-                                                                , session
-                                                                , sessions
-                                                                , showLogin
-                                                                , tasks } [] } sessionProps) []
+                                                                , session } [] } sessionProps) []
 
 home :: R2.Component Props
 home = R.createElement homeCpt
-
 homeCpt :: R.Component Props
 homeCpt = here.component "home" cpt where
   cpt props@{ boxes: boxes@{ backend, sessions, showLogin } } _ = do
@@ -367,7 +345,6 @@ homeCpt = here.component "home" cpt where
 
 lists :: R2.Component SessionNodeProps
 lists = R.createElement listsCpt
-
 listsCpt :: R.Component SessionNodeProps
 listsCpt = here.component "lists" cpt where
   cpt props@{ boxes: { backend
@@ -419,7 +396,6 @@ type RouteFrameProps = (
 
 routeFrame :: R2.Component RouteFrameProps
 routeFrame = R.createElement routeFrameCpt
-
 routeFrameCpt :: R.Component RouteFrameProps
 routeFrameCpt = here.component "routeFrame" cpt where
   cpt props@{ boxes, nodeId, nodeType } _ = do
@@ -429,7 +405,6 @@ routeFrameCpt = here.component "routeFrame" cpt where
 
 team :: R2.Component SessionNodeProps
 team = R.createElement teamCpt
-
 teamCpt :: R.Component SessionNodeProps
 teamCpt = here.component "team" cpt where
   cpt props@{ boxes, nodeId } _ = do
@@ -439,7 +414,6 @@ teamCpt = here.component "team" cpt where
 
 texts :: R2.Component SessionNodeProps
 texts = R.createElement textsCpt
-
 textsCpt :: R.Component SessionNodeProps
 textsCpt = here.component "texts" cpt
   where
@@ -465,7 +439,6 @@ textsCpt = here.component "texts" cpt
 
 user :: R2.Component SessionNodeProps
 user = R.createElement userCpt
-
 userCpt :: R.Component SessionNodeProps
 userCpt = here.component "user" cpt where
   cpt props@{ boxes: boxes@{ reloadForest
@@ -489,7 +462,6 @@ type ContactProps = ( annuaireId :: NodeID | SessionNodeProps )
 
 contact :: R2.Component ContactProps
 contact = R.createElement contactCpt
-
 contactCpt :: R.Component ContactProps
 contactCpt = here.component "contact" cpt where
   cpt props@{ annuaireId

src/Gargantext/Components/TopBar.purs

@@ -84,7 +84,6 @@ logo =
 
 divDropdownLeft :: R2.Component ()
 divDropdownLeft = R.createElement divDropdownLeftCpt
-
 divDropdownLeftCpt :: R.Component ()
 divDropdownLeftCpt = here.component "divDropdownLeft" cpt
   where
@@ -160,14 +159,13 @@ type MenuButtonProps = (
 
 menuButton :: R2.Component MenuButtonProps
 menuButton = R.createElement menuButtonCpt
-
 menuButtonCpt :: R.Component MenuButtonProps
 menuButtonCpt = here.component "menuButton" cpt
   where
     cpt { element: LiNav { title, href, icon, text }, show } _ = do
       pure $ H.a { className: "dropdown-toggle navbar-text"
                 -- , data: {toggle: "dropdown"}
-                , href, title
+                , title
                 , on: { click: \_ -> T.modify_ not show }
                 , role: "button" } [
           H.span { aria: {hidden : true}, className: icon } []
@@ -182,7 +180,6 @@ type MenuElementsProps = (
 
 menuElements :: R2.Component MenuElementsProps
 menuElements = R.createElement menuElementsCpt
-
 menuElementsCpt :: R.Component MenuElementsProps
 menuElementsCpt = here.component "menuElements" cpt
   where

src/Gargantext/Routes.purs

@@ -83,27 +83,27 @@ instance showAppRoute :: Show AppRoute where
 
 
 appPath :: AppRoute -> String
-appPath Home                 = ""
-appPath Login                = "login"
-appPath (Folder s i)         = "folder/"        <> show s <> "/" <> show i
-appPath (FolderPrivate s i)  = "folderPrivate/" <> show s <> "/" <> show i
-appPath (FolderPublic s i)   = "folderPublic/"  <> show s <> "/" <> show i
-appPath (FolderShared s i)   = "folderShared/"  <> show s <> "/" <> show i
-appPath (Team s i)           = "team/"          <> show s <> "/" <> show i
+appPath Home                     = ""
+appPath Login                    = "login"
+appPath (Folder s i)             = "folder/"        <> show s <> "/" <> show i
+appPath (FolderPrivate s i)      = "folderPrivate/" <> show s <> "/" <> show i
+appPath (FolderPublic s i)       = "folderPublic/"  <> show s <> "/" <> show i
+appPath (FolderShared s i)       = "folderShared/"  <> show s <> "/" <> show i
+appPath (Team s i)               = "team/"          <> show s <> "/" <> show i
 appPath (CorpusDocument s c l i) = "corpus/" <> show s <> "/" <> show c <> "/list/" <> show l <> "/document/" <> show i
-appPath (Corpus s i)         = "corpus/"     <> show s <> "/" <> show i
-appPath (Document s l i)     = "list/"       <> show s <> "/" <> show l <> "/document/" <> show i
-appPath (Dashboard s i)      = "dashboard/"  <> show s <> "/" <> show i
-appPath (PGraphExplorer s i) = "graph/"      <> show s <> "/" <> show i
-appPath (Texts s i)          = "texts/"      <> show s <> "/" <> show i
-appPath (Lists s i)          = "lists/"      <> show s <> "/" <> show i
-appPath (Annuaire s i)       = "annuaire/"   <> show s <> "/" <> show i
-appPath (UserPage s i)       = "user/"       <> show s <> "/" <> show i
-appPath (ContactPage s a i)  = "annuaire/"   <> show s <> "/" <> show a <> "/contact/" <> show i
-appPath (RouteFrameWrite s i) = "write/"     <> show s <> "/" <> show i
-appPath (RouteFrameCalc s i)  = "calc/"      <> show s <> "/" <> show i
-appPath (RouteFrameCode s i)  = "code/"      <> show s <> "/" <> show i
-appPath (RouteFile s i)       = "file/"      <> show s <> "/" <> show i
+appPath (Corpus s i)             = "corpus/"     <> show s <> "/" <> show i
+appPath (Document s l i)         = "list/"       <> show s <> "/" <> show l <> "/document/" <> show i
+appPath (Dashboard s i)          = "dashboard/"  <> show s <> "/" <> show i
+appPath (PGraphExplorer s i)     = "graph/"      <> show s <> "/" <> show i
+appPath (Texts s i)              = "texts/"      <> show s <> "/" <> show i
+appPath (Lists s i)              = "lists/"      <> show s <> "/" <> show i
+appPath (Annuaire s i)           = "annuaire/"   <> show s <> "/" <> show i
+appPath (UserPage s i)           = "user/"       <> show s <> "/" <> show i
+appPath (ContactPage s a i)      = "annuaire/"   <> show s <> "/" <> show a <> "/contact/" <> show i
+appPath (RouteFrameWrite s i)    = "write/"     <> show s <> "/" <> show i
+appPath (RouteFrameCalc s i)     = "calc/"      <> show s <> "/" <> show i
+appPath (RouteFrameCode s i)     = "code/"      <> show s <> "/" <> show i
+appPath (RouteFile s i)          = "file/"      <> show s <> "/" <> show i
 
 nodeTypeAppRoute :: NodeType -> SessionId -> Int -> Maybe AppRoute
 nodeTypeAppRoute GT.Annuaire s i       = Just $ Annuaire s i

src/Gargantext/Utils.purs

@@ -9,9 +9,10 @@ import Data.Set as Set
 import Data.Sequence.Ordered as OSeq
 import Data.String as S
 import Data.Unfoldable (class Unfoldable)
+import DOM.Simple.Window (window)
 import Effect (Effect)
 import Prelude
-import Web.HTML (window)
+import Web.HTML as WHTML
 import Web.HTML.Window (location)
 import Web.HTML.Location as WHL
 
@@ -102,6 +103,6 @@ sortWith f = map (\(On _ y) -> y) <<< OSeq.toUnfoldable <<< foldr (\x -> OSeq.in
 
 href :: Effect String
 href = do
-  w <- window
+  w <- WHTML.window
   loc <- location w
   WHL.href loc

src/Gargantext/Utils/Debug.js

+function _debugger(a) {
+  debugger;
+}
+exports._debugger = _debugger;

src/Gargantext/Utils/Debug.purs

+module Gargantext.Utils.Debug where
+
+import Data.Array as A
+import Data.Foldable (foldr)
+import Data.Maybe (Maybe(..))
+import Data.Ord as Ord
+import Effect (Effect)
+import Effect.Uncurried (EffectFn1, runEffectFn1)
+
+import Gargantext.Prelude
+
+foreign import _debugger :: EffectFn1 Unit Unit
+
+debugger :: Unit -> Effect Unit
+debugger = runEffectFn1 _debugger

src/sass/_graph.sass

@@ -56,7 +56,8 @@
   #controls-container
     // position: fixed
     position: absolute
-    z-index: 999 // needs to appear above graph elements
+    // needs to appear above graph elements
+    z-index: 900
     backdrop-filter: blur(4px)
     background: rgba(255,255,255,75%)
     // overflow: auto

src/sass/_login.sass

 #dafixedtop
   // correction for the popover
-  z-index: 999
+  z-index: 910
   // height: 60px
 
 //.logoSmall

src/sass/_tree.sass

@@ -173,7 +173,7 @@ li
   position: fixed
   top: 3.7em
   width: 15%
-  z-index: 999
+  z-index: 900
 .left-handed
   .forest-layout
     left: 80%