[toestand] more fixes and refactorings, code still doesn't compile

src/Gargantext/AsyncTasks.purs

 module Gargantext.AsyncTasks where
 
+import Gargantext.Prelude
+
+import DOM.Simple.Console (log2)
 import Data.Argonaut (decodeJson)
 import Data.Argonaut.Parser (jsonParser)
 import Data.Array as A
 import Data.Either (Either(..))
 import Data.Map as Map
 import Data.Maybe (Maybe(..), maybe, fromMaybe)
-import Data.Tuple (snd)
-import DOM.Simple.Console (log2)
+import Data.Tuple (fst, snd)
 import Effect (Effect)
-import Reactix as R
-import Web.Storage.Storage as WSS
-
-import Gargantext.Prelude
 import Gargantext.Types as GT
 import Gargantext.Utils as GU
 import Gargantext.Utils.Reactix as R2
 import Gargantext.Utils.Reload as GUR
-import Gargantext.Utils.Toestand
+import Gargantext.Utils.Toestand as T2
+import Reactix as R
+import Toestand as T
+import Web.Storage.Storage as WSS
 
 localStorageKey :: String
 localStorageKey = "garg-async-tasks"
@@ -44,20 +45,25 @@ getAsyncTasks = R2.getls >>= WSS.getItem localStorageKey >>= handleMaybe
 getTasks :: Record ReductorProps -> GT.NodeID -> Array GT.AsyncTaskWithType
 getTasks { storage } nodeId = fromMaybe [] $ Map.lookup nodeId storage
 
+getTasksMaybe :: Maybe Reductor -> GT.NodeID -> Array GT.AsyncTaskWithType
+getTasksMaybe mTasks nodeId = case mTasks of
+    Just tasks -> getTasks (fst tasks) nodeId
+    Nothing -> []
+
 removeTaskFromList :: Array GT.AsyncTaskWithType -> GT.AsyncTaskWithType -> Array GT.AsyncTaskWithType
 removeTaskFromList ts (GT.AsyncTaskWithType { task: GT.AsyncTask { id: id' } }) =
   A.filter (\(GT.AsyncTaskWithType { task: GT.AsyncTask { id: id'' } }) -> id' /= id'') ts
 
 type ReductorProps = (
-    reloadRoot   :: GUR.ReloadS
-  , reloadForest :: GUR.ReloadS
+    reloadForest :: T.Cursor T2.Reload
+  , reloadRoot   :: T.Cursor T2.Reload
   , storage      :: Storage
   )
 
 type Reductor = R2.Reductor (Record ReductorProps) Action
 type ReductorAction = Action -> Effect Unit
 
-useTasks :: GUR.ReloadS -> GUR.ReloadS -> R.Hooks Reductor
+useTasks :: T.Cursor T2.Reload -> T.Cursor T2.Reload -> R.Hooks Reductor
 useTasks reloadRoot reloadForest = R2.useReductor act initializer unit
   where
     act :: R2.Actor (Record ReductorProps) Action
@@ -73,18 +79,18 @@ data Action =
 
 action :: Record ReductorProps -> Action -> Effect (Record ReductorProps)
 action p@{ reloadForest, storage } (Insert nodeId t) = do
-  _ <- GUR.bump reloadForest
+  _ <- GUR.bumpCursor reloadForest
   let newStorage = Map.alter (maybe (Just [t]) (\ts -> Just $ A.cons t ts)) nodeId storage
   pure $ p { storage = newStorage }
 action p (Finish nodeId t) = do
   action p (Remove nodeId t)
 action p@{ reloadRoot, reloadForest, storage } (Remove nodeId t@(GT.AsyncTaskWithType { typ })) = do
   _ <- if GT.asyncTaskTriggersAppReload typ then
-    GUR.bump reloadRoot
+    GUR.bumpCursor reloadRoot
   else
     pure unit
   _ <- if GT.asyncTaskTriggersTreeReload typ then
-    GUR.bump reloadForest
+    GUR.bumpCursor reloadForest
   else
     pure unit
   let newStorage = Map.alter (maybe Nothing $ (\ts -> Just $ removeTaskFromList ts t)) nodeId storage

src/Gargantext/Components/Annotation/AnnotatedField.purs

@@ -11,7 +11,6 @@
 -- | 2. We will need a more ambitious search algorithm for skipgrams.
 module Gargantext.Components.Annotation.AnnotatedField where
 
-import Prelude
 import Data.Maybe ( Maybe(..), maybe )
 import Data.Tuple ( Tuple )
 import Data.Tuple.Nested ( (/\) )
@@ -22,14 +21,17 @@ import Reactix as R
 import Reactix.DOM.HTML as HTML
 import Reactix.SyntheticEvent as E
 
+import Gargantext.Prelude
+
 import Gargantext.Types (CTabNgramType(..), TermList)
 import Gargantext.Components.Annotation.Utils ( termBootstrapClass, termClass )
 import Gargantext.Components.NgramsTable.Core
 import Gargantext.Components.Annotation.Menu ( annotationMenu, MenuType(..) )
 import Gargantext.Utils.Selection as Sel
+import Gargantext.Utils.Reactix as R2
 
-thisModule :: String
-thisModule = "Gargantext.Components.Annotation.AnnotatedField"
+here :: R2.Here
+here = R2.here "Gargantext.Components.Annotation.AnnotatedField"
 
 type Props =
   ( ngrams       :: NgramsTable
@@ -46,7 +48,7 @@ annotatedField :: Record Props -> R.Element
 annotatedField p = R.createElement annotatedFieldComponent p []
 
 annotatedFieldComponent :: R.Component Props
-annotatedFieldComponent = R.hooksComponentWithModule thisModule "annotatedField" cpt
+annotatedFieldComponent = here.component "annotatedField" cpt
   where
     cpt {ngrams,setTermList,text: fieldText} _ = do
       (_ /\ setRedrawMenu) <- R.useState' false

src/Gargantext/Components/Annotation/Menu.purs

@@ -16,8 +16,8 @@ import Gargantext.Components.Annotation.Utils (termBootstrapClass)
 import Gargantext.Components.ContextMenu.ContextMenu as CM
 import Gargantext.Utils.Reactix as R2
 
-thisModule :: String
-thisModule = "Gargantext.Components.Annotation.Menu"
+here :: R2.Here
+here = R2.here "Gargantext.Components.Annotation.Menu"
 
 data MenuType = NewNgram | SetTermListItem
 
@@ -43,7 +43,7 @@ annotationMenu {x, y, list, menuType, onClose, setList} =
   ]
 
 annotationMenuCpt :: R.Component Props
-annotationMenuCpt = R.hooksComponentWithModule thisModule "annotationMenu" cpt
+annotationMenuCpt = here.component "annotationMenu" cpt
   where
     cpt props _ = pure $ R.fragment $ children props
     children props = A.mapMaybe (addToList props) [ MapTerm, CandidateTerm, StopTerm ]

src/Gargantext/Components/App.purs

@@ -9,14 +9,14 @@ import Gargantext.Sessions as Sessions
 import Reactix as R
 import Toestand as T
 
-thisModule :: String
-thisModule = "Gargantext.Components.App"
+here :: R2.Here
+here = R2.here "Gargantext.Components.App"
 
 app :: R.Element
 app = R.createElement appCpt {} []
 
 appCpt :: R.Component ()
-appCpt = R.hooksComponentWithModule thisModule "app" cpt where
+appCpt = here.component "app" cpt where
   cpt _ _ = do
     cell    <- T.useCell emptyApp     -- global data
     views   <- T.useFieldViews cell   -- read-only access for children

src/Gargantext/Components/AutoUpdate.purs

@@ -13,7 +13,7 @@ import Reactix.DOM.HTML as H
 import Gargantext.Prelude
 import Gargantext.Utils.Reactix as R2
 
-thisModule = "Gargantext.Components.AutoUpdate"
+here = R2.here "Gargantext.Components.AutoUpdate"
 
 
 data Action = Update
@@ -49,7 +49,7 @@ autoUpdate :: Record PropsRow -> R.Element
 autoUpdate props = R.createElement autoUpdateCpt props []
 
 autoUpdateCpt :: R.Component PropsRow
-autoUpdateCpt = R.hooksComponentWithModule thisModule "autoUpdate" cpt
+autoUpdateCpt = here.component "autoUpdate" cpt
   where
     cpt { duration, effect } _ = do
       intervalRef <- R.useRef Nothing

src/Gargantext/Components/Category.purs

@@ -39,8 +39,8 @@ import Gargantext.Sessions (Session, sessionId, get, delete, put)
 import Gargantext.Types (NodeID, NodeType(..), OrderBy(..), TableResult, TabType, showTabType')
 import Gargantext.Utils.CacheAPI as GUC
 
-thisModule :: String
-thisModule = "Gargantext.Components.Category"
+here :: R2.Here
+here = R2.here "Gargantext.Components.Category"
 
 ------------------------------------------------------------------------
 type RatingProps =
@@ -55,7 +55,7 @@ rating :: R2.Component RatingProps
 rating = R.createElement ratingCpt
 
 ratingCpt :: R.Component RatingProps
-ratingCpt = R.hooksComponentWithModule thisModule "rating" cpt
+ratingCpt = here.component "rating" cpt
   where
     cpt { score, nodeId, row: DocumentsView r, session, setLocalCategories } _ = do
       pure $ H.div {className:"flex"} divs
@@ -109,7 +109,7 @@ caroussel :: R2.Component CarousselProps
 caroussel = R.createElement carousselCpt
 
 carousselCpt :: R.Component CarousselProps
-carousselCpt = R.hooksComponentWithModule thisModule "caroussel" cpt
+carousselCpt = here.component "caroussel" cpt
   where
     cpt { category, nodeId, row: DocumentsView r, session, setLocalCategories } _ = do
       pure $ H.div {className:"flex"} divs

src/Gargantext/Components/CodeEditor.purs

@@ -24,8 +24,8 @@ import Gargantext.Prelude
 import Gargantext.Utils.HighlightJS as HLJS
 import Gargantext.Utils.Reactix as R2
 
-thisModule :: String
-thisModule = "Gargantext.Components.CodeEditor"
+here :: R2.Here
+here = R2.here "Gargantext.Components.CodeEditor"
 
 type Code = String
 type Html = String
@@ -108,7 +108,7 @@ codeEditor p = R.createElement codeEditorCpt p []
 -- The overlay is to provide seamless syntax highlighting on top of the textarea.
 -- I took the idea from: https://github.com/satya164/react-simple-code-editor
 codeEditorCpt :: R.Component Props
-codeEditorCpt = R.hooksComponentWithModule thisModule "codeEditor" cpt
+codeEditorCpt = here.component "codeEditor" cpt
   where
     cpt {code, defaultCodeType, onChange} _ = do
       controls <- initControls code defaultCodeType
@@ -204,7 +204,7 @@ toolbar :: Record ToolbarProps -> R.Element
 toolbar p = R.createElement toolbarCpt p []
 
 toolbarCpt :: R.Component ToolbarProps
-toolbarCpt = R.hooksComponentWithModule thisModule "toolbar" cpt
+toolbarCpt = here.component "toolbar" cpt
   where
     cpt props@{controls: {codeType, error, viewType}} _ = do
       pure $
@@ -236,7 +236,7 @@ errorComponent :: Record ErrorComponentProps -> R.Element
 errorComponent p = R.createElement errorComponentCpt p []
 
 errorComponentCpt :: R.Component ErrorComponentProps
-errorComponentCpt = R.hooksComponentWithModule thisModule "errorComponent" cpt
+errorComponentCpt = here.component "errorComponent" cpt
   where
     cpt {error: (Nothing /\ _)} _ = pure $ H.div {} []
     cpt {error: ((Just error) /\ _)} _ = do
@@ -253,7 +253,7 @@ codeTypeSelector :: Record CodeTypeSelectorProps -> R.Element
 codeTypeSelector p = R.createElement codeTypeSelectorCpt p []
 
 codeTypeSelectorCpt :: R.Component CodeTypeSelectorProps
-codeTypeSelectorCpt = R.hooksComponentWithModule thisModule "codeTypeSelector" cpt
+codeTypeSelectorCpt = here.component "codeTypeSelector" cpt
   where
     cpt {codeType, onChange} _ = do
       pure $ R2.select { className: "form-control"
@@ -289,7 +289,7 @@ viewTypeSelector :: Record ViewTypeSelectorProps -> R.Element
 viewTypeSelector p = R.createElement viewTypeSelectorCpt p []
 
 viewTypeSelectorCpt :: R.Component ViewTypeSelectorProps
-viewTypeSelectorCpt = R.hooksComponentWithModule thisModule "viewTypeSelector" cpt
+viewTypeSelectorCpt = here.component "viewTypeSelector" cpt
   where
     cpt {state} _ =
       pure $ H.div { className: "btn-group"

src/Gargantext/Components/ContextMenu/ContextMenu.purs

@@ -21,8 +21,8 @@ import Reactix.DOM.HTML as HTML
 
 import Gargantext.Utils.Reactix as R2
 
-thisModule :: String
-thisModule = "Gargantext.Components.ContextMenu.ContextMenu"
+here :: R2.Here
+here = R2.here "Gargantext.Components.ContextMenu.ContextMenu"
 
 type Props t = (
     x :: Number
@@ -34,7 +34,7 @@ contextMenu :: forall t. R2.Component (Props t)
 contextMenu = R.createElement contextMenuCpt
 
 contextMenuCpt :: forall t. R.Component (Props t)
-contextMenuCpt = R.hooksComponentWithModule thisModule "contextMenu" cpt
+contextMenuCpt = here.component "contextMenu" cpt
   where
     cpt menu@{ x, y, onClose } children = do
       host <- R2.getPortalHost
@@ -108,7 +108,7 @@ contextMenuItem :: Array R.Element -> R.Element
 contextMenuItem = R.createElement contextMenuItemCpt {}
 
 contextMenuItemCpt :: R.Component ()
-contextMenuItemCpt = R.hooksComponentWithModule thisModule "contextMenuItem" cpt
+contextMenuItemCpt = here.component "contextMenuItem" cpt
   where
     cpt _props children = pure $ HTML.li { className: "context-menu-item" } children
 

src/Gargantext/Components/DocsTable.purs

@@ -45,8 +45,8 @@ import Gargantext.Utils.Reactix as R2
 import Gargantext.Utils.Reload as GUR
 import Gargantext.Utils.Toestand as T2
 
-thisModule :: String
-thisModule = "Gargantext.Components.DocsTable"
+here :: R2.Here
+here = R2.here "Gargantext.Components.DocsTable"
 ------------------------------------------------------------------------
 
 type TotalRecords = Int
@@ -98,7 +98,7 @@ docViewLayout :: Record LayoutProps -> R.Element
 docViewLayout props = R.createElement docViewLayoutCpt props []
 
 docViewLayoutCpt :: R.Component LayoutProps
-docViewLayoutCpt = R.hooksComponentWithModule thisModule "docViewLayout" cpt
+docViewLayoutCpt = here.component "docViewLayout" cpt
   where
     cpt layout _children = do
       query <- R.useState' ""
@@ -115,7 +115,7 @@ docView :: R2.Component Props
 docView = R.createElement docViewCpt
 
 docViewCpt :: R.Component Props
-docViewCpt = R.hooksComponentWithModule thisModule "docView" cpt where
+docViewCpt = here.component "docView" cpt where
   cpt { layout: { cacheState
                 , chart
                 , frontends
@@ -153,7 +153,7 @@ docViewCpt = R.hooksComponentWithModule thisModule "docView" cpt where
 searchBar :: R.State Query -> R.Element
 searchBar (query /\ setQuery) = R.createElement el {} []
   where
-    el = R.hooksComponentWithModule thisModule "SearchBar" cpt
+    el = here.component "SearchBar" cpt
     cpt {} _children = do
       queryText <- R.useState' query
 
@@ -240,7 +240,7 @@ pageLayout :: Record PageLayoutProps -> R.Element
 pageLayout props = R.createElement pageLayoutCpt props []
 
 pageLayoutCpt :: R.Component PageLayoutProps
-pageLayoutCpt = R.hooksComponentWithModule thisModule "pageLayout" cpt where
+pageLayoutCpt = here.component "pageLayout" cpt where
   cpt props@{ cacheState
             , frontends
             , listId
@@ -303,7 +303,7 @@ page :: R2.Component PageProps
 page = R.createElement pageCpt
 
 pageCpt :: R.Component PageProps
-pageCpt = R.hooksComponentWithModule thisModule "pageCpt" cpt where
+pageCpt = here.component "pageCpt" cpt where
   cpt { documents, layout, params } _ = do
     paramsS <- R.useState' params
     pure $ pagePaint { documents, layout, params: paramsS } []
@@ -318,7 +318,7 @@ pagePaint :: R2.Component PagePaintProps
 pagePaint = R.createElement pagePaintCpt
 
 pagePaintCpt :: R.Component PagePaintProps
-pagePaintCpt = R.hooksComponentWithModule thisModule "pagePaintCpt" cpt
+pagePaintCpt = here.component "pagePaintCpt" cpt
   where
     cpt { documents, layout, params } _ = do
       localCategories <- R.useState' (mempty :: LocalUserScore)
@@ -350,7 +350,7 @@ pagePaintRaw :: R2.Component PagePaintRawProps
 pagePaintRaw = R.createElement pagePaintRawCpt
 
 pagePaintRawCpt :: R.Component PagePaintRawProps
-pagePaintRawCpt = R.hooksComponentWithModule thisModule "pagePaintRawCpt" cpt where
+pagePaintRawCpt = here.component "pagePaintRawCpt" cpt where
   cpt { documents
       , layout: { frontends
                 , listId
@@ -425,7 +425,7 @@ docChooser :: R2.Component DocChooser
 docChooser = R.createElement docChooserCpt
 
 docChooserCpt :: R.Component DocChooser
-docChooserCpt = R.hooksComponentWithModule thisModule "docChooser" cpt
+docChooserCpt = here.component "docChooser" cpt
   where
     cpt { mCorpusId: Nothing } _ = do
       pure $ H.div {} []

src/Gargantext/Components/FacetsTable.purs

@@ -38,7 +38,7 @@ import Gargantext.Utils (toggleSet, zeroPad)
 import Gargantext.Utils.DecodeMaybe ((.|))
 import Gargantext.Utils.Reactix as R2
 
-thisModule = "Gargantext.Components.FacetsTable"
+here = R2.here "Gargantext.Components.FacetsTable"
 ------------------------------------------------------------------------
 
 type Props =
@@ -119,7 +119,7 @@ docView :: Record Props -> R.Element
 docView props = R.createElement docViewCpt props []
 
 docViewCpt :: R.Component Props
-docViewCpt = R.hooksComponentWithModule thisModule "docView" cpt
+docViewCpt = here.component "docView" cpt
   where
     cpt {frontends, session, nodeId, listId, query, totalRecords, chart, container} _ = do
       deletions <- R.useState' initialDeletions
@@ -173,7 +173,7 @@ docViewGraph :: Record Props -> R.Element
 docViewGraph props = R.createElement docViewCpt props []
 
 docViewGraphCpt :: R.Component Props
-docViewGraphCpt = R.hooksComponentWithModule thisModule "docViewGraph" cpt
+docViewGraphCpt = here.component "docViewGraph" cpt
   where
     cpt {frontends, session, nodeId, listId, query, totalRecords, chart, container} _ = do
       deletions <- R.useState' initialDeletions
@@ -303,7 +303,7 @@ pageLayout :: Record PageLayoutProps -> R.Element
 pageLayout props = R.createElement pageLayoutCpt props []
 
 pageLayoutCpt :: R.Component PageLayoutProps
-pageLayoutCpt = R.hooksComponentWithModule thisModule "pageLayout" cpt
+pageLayoutCpt = here.component "pageLayout" cpt
   where
     cpt {frontends, totalRecords, deletions, container, session, path} _ = do
       useLoader (fst path) loadPage $ \rowsLoaded ->
@@ -313,7 +313,7 @@ page :: Record PageProps -> R.Element
 page props = R.createElement pageCpt props []
 
 pageCpt :: R.Component PageProps
-pageCpt = R.hooksComponentWithModule thisModule "page" cpt
+pageCpt = here.component "page" cpt
   where
     cpt {frontends, totalRecords, container, deletions, rowsLoaded, session, path: path@({nodeId, listId, query} /\ setPath)} _ = do
       pure $ T.table { syncResetButton : [ H.div {} [] ]

src/Gargantext/Components/Footer.purs

 module Gargantext.Components.Footer where
 
-import Gargantext.Prelude
-import Gargantext.Sessions as Sessions
 import Reactix as R
 import Reactix.DOM.HTML as H
 import Toestand as T
 
-thisModule :: String
-thisModule = "Gargantext.Components.Footer"
+import Gargantext.Prelude
+
+import Gargantext.Sessions as Sessions
+import Gargantext.Utils.Reactix as R2
+
+here :: R2.Here
+here = R2.here "Gargantext.Components.Footer"
 
 ---------------------------------------------------------------------------
 type FooterProps s = ( session :: s )
@@ -16,6 +19,6 @@ footer :: forall cell c. T.Read cell c => Record (FooterProps cell) -> R.Element
 footer props = R.createElement footerCpt props []
 
 footerCpt :: forall cell c. T.Read cell c => R.Component (FooterProps cell)
-footerCpt = R.hooksComponentWithModule thisModule "footer" cpt where
+footerCpt = here.component "footer" cpt where
   cpt { session } _ =
     pure $ H.div { className: "container" } [ H.hr {}, H.footer {} [] ]

src/Gargantext/Components/Forest.purs

 module Gargantext.Components.Forest
-  ( forest, forestLayout, forestLayoutWithTopBar
-  , forestLayoutMain, forestLayoutRaw
+  ( forest
+  , forestLayout
+  , forestLayoutWithTopBar
+  , forestLayoutMain
+  , forestLayoutRaw
+  , Common
+  , LayoutProps
   ) where
 
 import Data.Array as A
@@ -22,7 +27,6 @@ import Gargantext.Routes (AppRoute)
 import Gargantext.Sessions (Session(..), Sessions, OpenNodes, unSessions)
 import Gargantext.Types (Handed(..), reverseHanded, switchHanded)
 import Gargantext.Utils.Reactix as R2
-import Gargantext.Utils.Reload as GUR
 import Gargantext.Utils.Toestand as T2
 
 here :: R2.Here
@@ -30,70 +34,102 @@ here = R2.here "Gargantext.Components.Forest"
 
 -- Shared by components here with Tree
 type Common = 
-  ( tasks        :: R.Ref (Maybe GAT.Reductor)
-  , route        :: AppRoute
-  , frontends    :: Frontends
+  ( frontends    :: Frontends
   , handed       :: T.Cursor Handed
   , reloadRoot   :: T.Cursor T2.Reload
+  , route        :: AppRoute
+  , tasks        :: T.Cursor (Maybe GAT.Reductor)
   )
 
 type LayoutProps =
   ( backend      :: T.Cursor Backend
-  , sessions     :: T.Cursor Session
-  , showLogin    :: T.Cursor Boolean
   , reloadForest :: T.Cursor T2.Reload
+  , sessions     :: T.Cursor Sessions
+  , showLogin    :: T.Cursor Boolean
   | Common 
   )
 
-type Props = ( forestOpen :: T.Cursor OpenNodes | LayoutProps )
+type Props = (
+    forestOpen :: T.Cursor OpenNodes
+  | LayoutProps )
   
-type TreeExtra =
-  ( session :: Session, forestOpen :: T.Cursor OpenNodes )
+type TreeExtra = (
+    forestOpen :: T.Cursor OpenNodes
+  , session :: Session
+  )
 
 forest :: R2.Component Props
 forest = R.createElement forestCpt
 
 forestCpt :: R.Component Props
 forestCpt = here.component "forest" cpt where
-  cpt props@{ reloadRoot, tasks, backend, route, frontends, handed
-            , sessions, showLogin, reloadForest } _ = do
+  cpt props@{ backend
+            , forestOpen
+            , frontends
+            , handed
+            , reloadForest
+            , reloadRoot
+            , route
+            , sessions
+            , showLogin
+            , tasks } _ = do
     -- NOTE: this is a hack to reload the forest on demand
     tasks'        <- GAT.useTasks reloadRoot reloadForest
+    R.useEffect' $ do
+      _ <- T.write (Just tasks') tasks
+      pure unit
     handed'       <- T.useLive T.unequal handed
     reloadForest' <- T.useLive T.unequal reloadForest
     reloadRoot'   <- T.useLive T.unequal reloadRoot
+    forestOpen'   <- T.useLive T.unequal forestOpen
+    sessions'     <- T.useLive T.unequal sessions
     -- TODO If `reloadForest` is set, `reload` state should be updated
-    R.useEffect' $ do
-      R.setRef tasks $ Just tasks'
-      GUR.initializeI reloadForest reload
+    -- TODO fix tasks ref
+    -- R.useEffect' $ do
+      -- R.setRef tasks $ Just tasks'
+      -- GUR.initializeI reloadForest reload
     R2.useCache
-      ( frontends /\ route /\ sessions /\ handed' /\ fst forestOpen 
-        /\ reloadForest /\ reloadRoot /\ (fst tasks).storage )
-      (cp handed') where
-        common = RX.pick props :: Record Common
-        cp handed' _ =
-          pure $ H.div { className: "forest" }
-            (A.cons (plus handed' showLogin backend) trees)
-        trees = tree <$> unSessions sessions
-        tree s@(Session {treeId}) =
-          treeLoader { reloadRoot, tasks, route, frontends, handed
-                     , forestOpen, reload, root: treeId, session: s } []
-
-plus :: Handed -> R.Setter Boolean -> R.State (Maybe Backend) -> R.Element
+      ( frontends /\ route /\ sessions' /\ handed' /\ forestOpen'
+        /\ reloadForest' /\ reloadRoot' /\ (fst tasks').storage )
+      (cp handed' sessions' tasks')
+        where
+          common = RX.pick props :: Record Common
+          cp handed' sessions' tasks' _ =
+            pure $ H.div { className: "forest" }
+              (A.cons (plus handed' showLogin backend) (trees handed' sessions' tasks'))
+          trees handed' sessions' tasks' = (tree handed' tasks') <$> unSessions sessions'
+          tree handed' tasks' s@(Session {treeId}) =
+            treeLoader { forestOpen
+                       , frontends
+                       , handed: handed'
+                       , reload: reloadForest
+                       , reloadRoot
+                       , root: treeId
+                       , route
+                       , session: s
+                       , tasks } []
+
+plus :: Handed -> T.Cursor Boolean -> T.Cursor Backend -> R.Element
 plus handed showLogin backend = H.div { className: "row" }
-  H.button { title, className: buttonClass, on: { click } }
-  [ H.div { className: divClass } [ H.text " Log in/out " ] -- fa-lg
-  , H.div {} [ H.text "    " ] ]
+  [ H.button { className: buttonClass
+             , on: { click }
+             , title }
+      [ H.div { className: divClass } [ H.text " Log in/out " ] -- fa-lg
+      , H.div {} [ H.text "    " ] ]
+  ]
   --, H.div { "type": "", className: "fa fa-plus-circle fa-lg"} []
   --, H.div { "type": "", className: "fa fa-minus-circle fa-lg"} []
   -- TODO same as the one in the Login Modal (same CSS)
   -- [ H.i { className: "material-icons md-36"} [] ]
   where
-    click _ = (snd backend) (const Nothing) *> showLogin (const true)
+    click _ = do
+      -- _ <- T.modify (const Nothing) backend
+      _ <- T.write true showLogin
+      pure unit
     title = "Add or remove connections to the server(s)."
     divClass = "fa fa-universal-access"
     buttonClass =
-      "btn btn-primary col-5 " <> switchHanded "ml-1 mr-auto" "mr-1 ml-auto"
+      "btn btn-primary col-5 " <> switchHanded "ml-1 mr-auto" "mr-1 ml-auto" handed
 
 
 forestLayout :: R2.Component LayoutProps
@@ -131,23 +167,45 @@ forestLayoutRaw props = R.createElement forestLayoutRawCpt props
 
 forestLayoutRawCpt :: R.Component LayoutProps
 forestLayoutRawCpt = here.component "forestLayoutRaw" cpt where
-  cpt p@{ reloadRoot, tasks, backend, route, frontends
-        , sessions, showLogin, reloadForest } children = do
-    handed <- T.useLive T.unequal p.handed
+  cpt p@{ backend
+        , frontends
+        , reloadForest
+        , reloadRoot
+        , route
+        , sessions
+        , showLogin
+        , tasks } children = do
+    handed' <- T.useLive T.unequal p.handed
+    forestOpen <- T2.useCursed $ Set.empty
+
     pure $ R2.row $ reverseHanded
-      [ H.div { className: "col-md-2", style: { paddingTop: "60px" } }
-        (A.cons (forest' handed) children) ] where
-        forest' handed =
-          forest
-          { reloadRoot, tasks, backend, route, frontends
-          , handed, sessions, showLogin, reloadForest } []
+      [ H.div { className: "col-md-2"
+              , style: { paddingTop: "60px" } }
+        (A.cons (forest' p.handed forestOpen) children)
+      ] handed'
+      where
+        forest' handed forestOpen =
+          forest { backend
+                 , frontends
+                 , forestOpen
+                 , handed
+                 , reloadForest
+                 , reloadRoot
+                 , route
+                 , sessions
+                 , showLogin
+                 , tasks } []
 
 mainPage :: R2.Component ()
 mainPage = R.createElement mainPageCpt
 
-mainPageCpt :: R.Memo ()
-mainPageCpt = R.memo (here.component "mainPage" cpt) where
-  cpt _ children =
-    pure $ H.div { className: "col-md-10" }
-      [ H.div {id: "page-wrapper"}
-        [ H.div { className: "container-fluid" } children ]]
+-- mainPageCpt :: R.Memo ()
+-- mainPageCpt = R.memo (here.component "mainPage" cpt) where
+mainPageCpt :: R.Component()
+mainPageCpt = here.component "mainPage" cpt
+  where
+    cpt _ children = do
+      pure $ H.div { className: "col-md-10" }
+        [ H.div { id: "page-wrapper" }
+          [ H.div { className: "container-fluid" } children ]
+        ]

src/Gargantext/Components/Forest/Tree.purs

 module Gargantext.Components.Forest.Tree where
 
 import Gargantext.Prelude
-import DOM.Simple.Console (log, log2)
+
 import Data.Array as A
 import Data.Maybe (Maybe(..))
 import Data.Set as Set
 import Data.Traversable (traverse_, traverse)
 import Data.Tuple (snd)
+import DOM.Simple.Console (log, log2)
 import Effect (Effect)
 import Effect.Aff (Aff)
 import Effect.Class (liftEffect)
@@ -15,23 +16,23 @@ import Reactix.DOM.HTML as H
 import Record as Record
 import Record.Extra as RecordE
 import Toestand as T
+import Web.HTML.Event.EventTypes (offline)
 
 import Gargantext.AsyncTasks as GAT
 import Gargantext.Components.Forest.Tree.Node (nodeSpan)
-import Gargantext.Components.Forest.Tree.Node.Tools.SubTree.Types (SubTreeOut(..))
 import Gargantext.Components.Forest.Tree.Node.Action (Action(..))
 import Gargantext.Components.Forest.Tree.Node.Action.Add (AddNodeValue(..), addNode)
+import Gargantext.Components.Forest.Tree.Node.Action.Contact as Contact
 import Gargantext.Components.Forest.Tree.Node.Action.Delete (deleteNode, unpublishNode)
-import Gargantext.Components.Forest.Tree.Node.Action.Move   (moveNodeReq)
-import Gargantext.Components.Forest.Tree.Node.Action.Merge  (mergeNodeReq)
-import Gargantext.Components.Forest.Tree.Node.Action.Link   (linkNodeReq)
+import Gargantext.Components.Forest.Tree.Node.Action.Link (linkNodeReq)
+import Gargantext.Components.Forest.Tree.Node.Action.Merge (mergeNodeReq)
+import Gargantext.Components.Forest.Tree.Node.Action.Move (moveNodeReq)
 import Gargantext.Components.Forest.Tree.Node.Action.Rename (RenameValue(..), rename)
-import Gargantext.Components.Forest.Tree.Node.Action.Share   as Share
-import Gargantext.Components.Forest.Tree.Node.Action.Contact as Contact
+import Gargantext.Components.Forest.Tree.Node.Action.Share as Share
 import Gargantext.Components.Forest.Tree.Node.Action.Update (updateRequest)
 import Gargantext.Components.Forest.Tree.Node.Action.Upload (uploadFile, uploadArbitraryFile)
-import Gargantext.Components.Forest.Tree.Node.Tools.FTree
-  ( FTree, LNode(..), NTree(..), fTreeID )
+import Gargantext.Components.Forest.Tree.Node.Tools.FTree (FTree, LNode(..), NTree(..), fTreeID)
+import Gargantext.Components.Forest.Tree.Node.Tools.SubTree.Types (SubTreeOut(..))
 import Gargantext.Ends (Frontends)
 import Gargantext.Hooks.Loader (useLoader)
 import Gargantext.Routes (AppRoute)
@@ -48,7 +49,7 @@ here = R2.here "Gargantext.Components.Forest.Tree"
 -- Shared by every component here + performAction + nodeSpan
 type Universal =
   ( reloadRoot :: T.Cursor T2.Reload
-  , tasks      :: GAT.Reductor )
+  , tasks      :: T.Cursor (Maybe GAT.Reductor) )
 
 -- Shared by every component here + nodeSpan
 type Global =
@@ -128,7 +129,7 @@ treeCpt = here.component "tree" cpt where
 --- The properties tree shares in common with performAction
 type PACommon =
   ( forestOpen   :: T.Cursor OpenNodes
-  , reloadTree :: T.Cursor T2.Reload
+  , reloadTree   :: T.Cursor T2.Reload
   , session      :: Session
   , tree         :: FTree
   | Universal )
@@ -173,13 +174,21 @@ performAction (DeleteNode nt) p@{ forestOpen
     _                             -> void $ deleteNode session nt id
   _ <- liftEffect $ T.modify (Set.delete (mkNodeId session id)) forestOpen
   performAction RefreshTree p
-performAction (DoSearch task) p@{ tree: (NTree (LNode {id}) _) } = liftEffect $ do
-  (snd p.tasks) $ GAT.Insert id task
+performAction (DoSearch task) p@{ tasks
+                                , tree: (NTree (LNode {id}) _) } = liftEffect $ do
+  mT <- T.read tasks
+  case mT of
+    Just t -> snd t $ GAT.Insert id task
+    Nothing -> pure unit
   log2 "[performAction] DoSearch task:" task
-performAction (UpdateNode params) p@{ tree: (NTree (LNode {id}) _) } = do
+performAction (UpdateNode params) p@{ tasks
+                                    , tree: (NTree (LNode {id}) _) } = do
   task <- updateRequest params p.session id
   liftEffect $ do
-    (snd p.tasks) $ GAT.Insert id task
+    mT <- T.read tasks
+    case mT of
+      Just t -> snd t $ GAT.Insert id task
+      Nothing -> pure unit
     log2 "[performAction] UpdateNode task:" task
 performAction (RenameNode name) p@{ tree: (NTree (LNode {id}) _) } = do
   void $ rename p.session id $ RenameValue { text: name }
@@ -198,15 +207,23 @@ performAction (AddNode name nodeType) p@{ forestOpen
   task <- addNode p.session id $ AddNodeValue {name, nodeType}
   _ <- liftEffect $ T.modify (Set.insert (mkNodeId p.session id)) forestOpen
   performAction RefreshTree p
-performAction (UploadFile nodeType fileType mName blob) p@{ tree: (NTree (LNode { id }) _) } = do
+performAction (UploadFile nodeType fileType mName blob) p@{ tasks
+                                                          , tree: (NTree (LNode { id }) _) } = do
   task <- uploadFile p.session nodeType id fileType {mName, blob}
   liftEffect $ do
-    (snd p.tasks) $ GAT.Insert id task
+    mT <- T.read tasks
+    case mT of
+      Just t -> snd t $ GAT.Insert id task
+      Nothing -> pure unit
     log2 "[performAction] UploadFile, uploaded, task:" task
-performAction (UploadArbitraryFile mName blob) p@{ tree: (NTree (LNode { id }) _) } = do
+performAction (UploadArbitraryFile mName blob) p@{ tasks
+                                                 , tree: (NTree (LNode { id }) _) } = do
   task <- uploadArbitraryFile p.session id { blob, mName }
   liftEffect $ do
-    (snd p.tasks) $ GAT.Insert id task
+    mT <- T.read tasks
+    case mT of
+      Just t -> snd t $ GAT.Insert id task
+      Nothing -> pure unit
     log2 "[performAction] UploadArbitraryFile, uploaded, task:" task
 performAction DownloadNode _ = liftEffect $ log "[performAction] DownloadNode"
 performAction (MoveNode {params}) p@{ forestOpen

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

 module Gargantext.Components.Forest.Tree.Node where
 
 import Gargantext.Prelude
+
 import Data.Array (reverse)
 import Data.Maybe (Maybe(..))
 import Data.Nullable (null)
 import Data.Symbol (SProxy(..))
+import Data.Tuple (snd)
 import Data.Tuple.Nested ((/\))
 import Effect (Effect)
 import Effect.Aff (Aff, launchAff)
@@ -14,30 +16,31 @@ import Reactix as R
 import Reactix.DOM.HTML as H
 import Record as Record
 import Toestand as T
+import Web.HTML.Event.EventTypes (offline)
 
 import Gargantext.AsyncTasks as GAT
-import Gargantext.Components.Forest.Tree.Node.Settings (SettingsBox(..), settingsBox)
 import Gargantext.Components.Forest.Tree.Node.Action (Action(..))
-import Gargantext.Components.Forest.Tree.Node.Action.Upload.Types (FileType(..), UploadFileBlob(..))
 import Gargantext.Components.Forest.Tree.Node.Action.Upload (DroppedFile(..), fileTypeView)
+import Gargantext.Components.Forest.Tree.Node.Action.Upload.Types (FileType(..), UploadFileBlob(..))
 import Gargantext.Components.Forest.Tree.Node.Box (nodePopupView)
 import Gargantext.Components.Forest.Tree.Node.Box.Types (CommonProps)
+import Gargantext.Components.Forest.Tree.Node.Settings (SettingsBox(..), settingsBox)
+import Gargantext.Components.Forest.Tree.Node.Tools (nodeLink)
 import Gargantext.Components.Forest.Tree.Node.Tools.ProgressBar (asyncProgressBar, BarType(..))
 import Gargantext.Components.Forest.Tree.Node.Tools.Sync (nodeActionsGraph, nodeActionsNodeList)
-import Gargantext.Components.Forest.Tree.Node.Tools (nodeLink)
 import Gargantext.Components.GraphExplorer.API as GraphAPI
 import Gargantext.Components.Lang (Lang(EN))
 import Gargantext.Components.Nodes.Corpus (loadCorpusWithChild)
 import Gargantext.Ends (Frontends)
 import Gargantext.Hooks.Loader (useLoader)
 import Gargantext.Routes as Routes
-import Gargantext.Version as GV
 import Gargantext.Sessions (Session, sessionId)
 import Gargantext.Types (Name, ID, reverseHanded)
 import Gargantext.Types as GT
 import Gargantext.Utils.Popover as Popover
 import Gargantext.Utils.Reactix as R2
 import Gargantext.Utils.Toestand as T2
+import Gargantext.Version as GV
 
 here :: R2.Here
 here = R2.here "Gargantext.Components.Forest.Tree.Node"
@@ -53,7 +56,7 @@ type NodeMainSpanProps =
   , reloadRoot    :: T.Cursor T2.Reload
   , route         :: Routes.AppRoute
   , setPopoverRef :: R.Ref (Maybe (Boolean -> Effect Unit))
-  , tasks         :: GAT.Reductor
+  , tasks         :: T.Cursor (Maybe GAT.Reductor)
   | CommonProps
   )
 
@@ -74,10 +77,7 @@ nodeMainSpan = R.createElement nodeMainSpanCpt
 nodeMainSpanCpt :: R.Component NodeMainSpanProps
 nodeMainSpanCpt = here.component "nodeMainSpan" cpt
   where
-    cpt props@{ reloadRoot
-              , tasks: (tasks /\ dispatchAsyncTasks)
-              , route
-              , dispatch
+    cpt props@{ dispatch
               , folderOpen
               , frontends
               , handed
@@ -85,8 +85,11 @@ nodeMainSpanCpt = here.component "nodeMainSpan" cpt
               , isLeaf
               , name
               , nodeType
+              , reloadRoot
+              , route
               , session
               , setPopoverRef
+              , tasks
               } _ = do
       -- only 1 popup at a time is allowed to be opened
       droppedFile   <- R.useState' (Nothing :: Maybe DroppedFile)
@@ -96,6 +99,8 @@ nodeMainSpanCpt = here.component "nodeMainSpan" cpt
         R.setRef setPopoverRef $ Just $ Popover.setOpen popoverRef
       let isSelected = Just route == Routes.nodeTypeAppRoute nodeType (sessionId session) id
 
+      tasks' <- T.read tasks
+
       pure $ H.span (dropProps droppedFile isDragOver)
         $ GT.reverseHanded
         [ folderIcon  { folderOpen, nodeType } []
@@ -110,7 +115,7 @@ nodeMainSpanCpt = here.component "nodeMainSpan" cpt
                                                        , onFinish: onTaskFinish id t
                                                        , session
                                                        }
-                                ) $ GAT.getTasks tasks id
+                                ) $ GAT.getTasksMaybe tasks' id
                            )
                 , if nodeType == GT.NodeUser
                         then GV.versionView {session}
@@ -135,7 +140,10 @@ nodeMainSpanCpt = here.component "nodeMainSpan" cpt
                 ] handed
         where
           onTaskFinish id t _ = do
-            dispatchAsyncTasks $ GAT.Finish id t
+            mT <- T.read tasks
+            case mT of
+              Just t' -> snd t' $ GAT.Finish id t
+              Nothing -> pure unit
             T2.reload reloadRoot
 
           SettingsBox {show: showBox} = settingsBox nodeType

src/Gargantext/Components/Forest/Tree/Node/Action/Add.purs

@@ -20,7 +20,7 @@ import Gargantext.Types  as GT
 import Gargantext.Types (NodeType(..))
 import Gargantext.Utils.Reactix as R2
 
-thisModule = "Gargantext.Components.Forest.Tree.Node.Action.Add"
+here = R2.here "Gargantext.Components.Forest.Tree.Node.Action.Add"
 
 ----------------------------------------------------------------------
 addNode :: Session -> GT.ID -> AddNodeValue -> Aff (Array GT.ID)
@@ -64,7 +64,7 @@ addNodeView :: Record CreateNodeProps
             -> R.Element
 addNodeView p@{ dispatch, nodeType, nodeTypes } = R.createElement el p []
   where
-    el = R.hooksComponentWithModule thisModule "addNodeView" cpt
+    el = here.component "addNodeView" cpt
     cpt {id, name} _ = do
       nodeName@(name' /\ setNodeName) <- R.useState' "Name"
       nodeType'@(nt /\ setNodeType)   <- R.useState' $ fromMaybe Folder $ head nodeTypes

src/Gargantext/Components/Forest/Tree/Node/Action/Link.purs

@@ -20,7 +20,7 @@ import Gargantext.Types  as GT
 import Gargantext.Utils.Argonaut (genericSumDecodeJson, genericSumEncodeJson)
 import Gargantext.Utils.Reactix as R2
 
-thisModule = "Gargantext.Components.Forest.Tree.Node.Action.Link"
+here = R2.here "Gargantext.Components.Forest.Tree.Node.Action.Link"
 
 
 data LinkNodeReq = LinkNodeReq { nodeType :: GT.NodeType
@@ -59,7 +59,7 @@ linkNode :: R2.Component SubTreeParamsIn
 linkNode = R.createElement linkNodeCpt
 
 linkNodeCpt :: R.Component SubTreeParamsIn
-linkNodeCpt = R.hooksComponentWithModule thisModule "linkNode" cpt
+linkNodeCpt = here.component "linkNode" cpt
   where
     cpt p@{dispatch, subTreeParams, id, nodeType, session, handed} _ = do
 

src/Gargantext/Components/Forest/Tree/Node/Action/Merge.purs

@@ -16,7 +16,7 @@ import Gargantext.Sessions (Session, put_)
 import Gargantext.Types  as GT
 import Gargantext.Utils.Reactix as R2
 
-thisModule = "Gargantext.Components.Forest.Tree.Node.Action.Merge"
+here = R2.here "Gargantext.Components.Forest.Tree.Node.Action.Merge"
 
 mergeNodeReq :: Session -> GT.ID -> GT.ID -> Aff (Array GT.ID)
 mergeNodeReq session fromId toId =
@@ -26,7 +26,7 @@ mergeNode :: R2.Component SubTreeParamsIn
 mergeNode = R.createElement mergeNodeCpt
 
 mergeNodeCpt :: R.Component SubTreeParamsIn
-mergeNodeCpt = R.hooksComponentWithModule thisModule "mergeNode" cpt
+mergeNodeCpt = here.component "mergeNode" cpt
   where
     cpt p@{dispatch, subTreeParams, id, nodeType, session, handed} _ = do
       action@(valAction /\ setAction) :: R.State Action <- R.useState' (MergeNode {params:Nothing})

src/Gargantext/Components/Forest/Tree/Node/Action/Move.purs

@@ -16,8 +16,8 @@ import Gargantext.Sessions (Session, put_)
 import Gargantext.Types as GT
 import Gargantext.Utils.Reactix as R2
 
-thisModule :: String
-thisModule = "Gargantext.Components.Forest.Tree.Node.Action.Move"
+here :: R2.Here
+here = R2.here "Gargantext.Components.Forest.Tree.Node.Action.Move"
 
 moveNodeReq :: Session -> GT.ID -> GT.ID -> Aff (Array GT.ID)
 moveNodeReq session fromId toId =
@@ -27,7 +27,7 @@ moveNode :: R2.Component SubTreeParamsIn
 moveNode = R.createElement moveNodeCpt
 
 moveNodeCpt :: R.Component SubTreeParamsIn
-moveNodeCpt = R.hooksComponentWithModule thisModule "moveNode" cpt
+moveNodeCpt = here.component "moveNode" cpt
   where
     cpt { dispatch, handed, id, nodeType, session, subTreeParams } _ = do
       action@(valAction /\ setAction) :: R.State Action <- R.useState' (MoveNode {params: Nothing})

src/Gargantext/Components/Forest/Tree/Node/Action/Search/Frame.purs

@@ -20,7 +20,7 @@ import Gargantext.Components.Forest.Tree.Node.Action.Search.Types (DataField(..)
 import Gargantext.Prelude (discard, identity, pure, unit, ($), (<>), (==), class Show, show)
 import Gargantext.Utils.Reactix as R2
 
-thisModule = "Gargantext.Components.Forest.Tree.Node.Action.Search.Frame"
+here = R2.here "Gargantext.Components.Forest.Tree.Node.Action.Search.Frame"
 
 --------------------
 
@@ -43,7 +43,7 @@ searchIframes :: Record SearchIFramesProps -> R.Element
 searchIframes props = R.createElement searchIframesCpt props []
 
 searchIframesCpt :: R.Component SearchIFramesProps
-searchIframesCpt = R.hooksComponentWithModule thisModule "searchIframes" cpt
+searchIframesCpt = here.component "searchIframes" cpt
   where
     cpt { iframeRef, search: search@(search' /\ _) } _ = do
       pure $ if isIsTex_Advanced search'.datafield
@@ -64,7 +64,7 @@ divIframe :: Record IFrameProps -> R.Element
 divIframe props = R.createElement divIframeCpt props []
 
 divIframeCpt :: R.Component IFrameProps
-divIframeCpt = R.hooksComponentWithModule thisModule "divIframe" cpt
+divIframeCpt = here.component "divIframe" cpt
   where
     cpt { frameSource, iframeRef, search: search@(search' /\ _) } _ = do
       pure $ H.div { className: "frame-search card" }
@@ -79,7 +79,7 @@ iframeWith :: Record IFrameProps -> R.Element
 iframeWith props = R.createElement iframeWithCpt props []
 
 iframeWithCpt :: R.Component IFrameProps
-iframeWithCpt = R.hooksComponentWithModule thisModule "iframeWith" cpt
+iframeWithCpt = here.component "iframeWith" cpt
   where
     cpt { frameSource, iframeRef, search: (search /\ setSearch) } _ =
       pure $ H.iframe { src: src frameSource search.term

src/Gargantext/Components/Forest/Tree/Node/Action/Search/SearchBar.purs

@@ -14,9 +14,10 @@ import Gargantext.Components.Lang (Lang)
 import Gargantext.Prelude (Unit, pure, ($))
 import Gargantext.Sessions (Session)
 import Gargantext.Types as GT
+import Gargantext.Utils.Reactix as R2
 
-thisModule :: String
-thisModule = "Gargantext.Components.Forest.Tree.Node.Action.Search.SearchBar"
+here :: R2.Here
+here = R2.here "Gargantext.Components.Forest.Tree.Node.Action.Search.SearchBar"
 
 type Props = ( langs     :: Array Lang
              , onSearch  :: GT.AsyncTaskWithType -> Effect Unit
@@ -28,7 +29,7 @@ searchBar :: Record Props -> R.Element
 searchBar props = R.createElement searchBarCpt props []
 
 searchBarCpt :: R.Component Props
-searchBarCpt = R.hooksComponentWithModule thisModule "searchBar" cpt
+searchBarCpt = here.component "searchBar" cpt
   where
     cpt {langs, onSearch, search: search@(s /\ _), session} _ = do
       --onSearchChange session s

src/Gargantext/Components/Forest/Tree/Node/Action/Search/SearchField.purs

@@ -23,8 +23,8 @@ import Gargantext.Components.Forest.Tree.Node.Action.Search.Frame (searchIframes
 import Gargantext.Types as GT
 import Gargantext.Utils.Reactix as R2
 
-thisModule :: String
-thisModule = "Gargantext.Components.Forest.Tree.Node.Action.Search.SearchField"
+here :: R2.Here
+here = R2.here "Gargantext.Components.Forest.Tree.Node.Action.Search.SearchField"
 
 defaultSearch :: Search
 defaultSearch = { databases: Empty
@@ -49,9 +49,9 @@ searchField :: Record Props -> R.Element
 searchField p = R.createElement searchFieldComponent p []
   where
     --searchFieldComponent :: R.Memo Props
-    --searchFieldComponent = R.memo (R.hooksComponentWithModule thisModule "searchField" cpt) eqProps
+    --searchFieldComponent = R.memo (here.component "searchField" cpt) eqProps
     searchFieldComponent :: R.Component Props
-    searchFieldComponent = R.hooksComponentWithModule thisModule "searchField" cpt
+    searchFieldComponent = here.component "searchField" cpt
 
     cpt props@{onSearch, search: search@(s /\ _)} _ = do
       iframeRef <- R.useRef    null
@@ -268,7 +268,7 @@ databaseInput :: R2.Component DatabaseInputProps
 databaseInput = R.createElement databaseInputCpt
 
 databaseInputCpt :: R.Component DatabaseInputProps
-databaseInputCpt = R.hooksComponentWithModule thisModule "databaseInput" cpt
+databaseInputCpt = here.component "databaseInput" cpt
   where
     cpt { databases
         , search: (search /\ setSearch) } _ = do
@@ -340,7 +340,7 @@ searchInput :: Record SearchInputProps -> R.Element
 searchInput p = R.createElement searchInputCpt p []
 
 searchInputCpt :: R.Component SearchInputProps
-searchInputCpt = R.hooksComponentWithModule thisModule "searchInput" cpt
+searchInputCpt = here.component "searchInput" cpt
   where
     cpt {search: (search@{ term } /\ setSearch)} _ = do
       valueRef <- R.useRef term
@@ -381,7 +381,7 @@ submitButton :: Record SubmitButtonProps -> R.Element
 submitButton p = R.createElement submitButtonComponent p []
 
 submitButtonComponent :: R.Component SubmitButtonProps
-submitButtonComponent = R.hooksComponentWithModule thisModule "submitButton" cpt
+submitButtonComponent = here.component "submitButton" cpt
   where
     cpt {onSearch, search: (mySearch /\ _), session} _ =
       pure $

src/Gargantext/Components/Forest/Tree/Node/Action/Share.purs

@@ -20,9 +20,10 @@ import Gargantext.Sessions (Session, post)
 import Gargantext.Types (ID)
 import Gargantext.Types as GT
 import Gargantext.Utils.Argonaut (genericSumDecodeJson, genericSumEncodeJson)
+import Gargantext.Utils.Reactix as R2
 
-thisModule :: String
-thisModule = "Gargantext.Components.Forest.Tree.Node.Action.Share"
+here :: R2.Here
+here = R2.here "Gargantext.Components.Forest.Tree.Node.Action.Share"
 
 ------------------------------------------------------------------------
 shareReq :: Session -> ID -> ShareNodeParams -> Aff ID
@@ -59,7 +60,7 @@ shareNode :: Record SubTreeParamsIn -> R.Element
 shareNode p = R.createElement shareNodeCpt p []
 
 shareNodeCpt :: R.Component SubTreeParamsIn
-shareNodeCpt = R.hooksComponentWithModule thisModule "shareNode" cpt
+shareNodeCpt = here.component "shareNode" cpt
   where
     cpt p@{dispatch, subTreeParams, id, nodeType, session, handed} _ = do
       action@(valAction /\ setAction) :: R.State Action <- R.useState' (Action.SharePublic {params: Nothing})

src/Gargantext/Components/Forest/Tree/Node/Action/Upload.purs

@@ -32,7 +32,7 @@ import Gargantext.Types (NodeType(..), ID)
 import Gargantext.Types         as GT
 import Gargantext.Utils.Reactix as R2
 
-thisModule = "Gargantext.Components.Forest.Tree.Node.Action.Upload"
+here = R2.here "Gargantext.Components.Forest.Tree.Node.Action.Upload"
 
 -- UploadFile Action
 
@@ -73,7 +73,7 @@ uploadFileView :: Record Props -> R.Element
 uploadFileView props = R.createElement uploadFileViewCpt props []
 
 uploadFileViewCpt :: R.Component Props
-uploadFileViewCpt = R.hooksComponentWithModule thisModule "uploadFileView" cpt
+uploadFileViewCpt = here.component "uploadFileView" cpt
   where
     cpt {dispatch, id, nodeType} _ = do
       mFile    :: R.State (Maybe UploadFile) <- R.useState' Nothing
@@ -151,7 +151,7 @@ uploadButton :: Record UploadButtonProps -> R.Element
 uploadButton props = R.createElement uploadButtonCpt props []
 
 uploadButtonCpt :: R.Component UploadButtonProps
-uploadButtonCpt = R.hooksComponentWithModule thisModule "uploadButton" cpt
+uploadButtonCpt = here.component "uploadButton" cpt
   where
     cpt { dispatch
         , fileType: (fileType /\ setFileType)
@@ -199,7 +199,7 @@ fileTypeView :: Record FileTypeProps -> R.Element
 fileTypeView p = R.createElement fileTypeViewCpt p []
 
 fileTypeViewCpt :: R.Component FileTypeProps
-fileTypeViewCpt = R.hooksComponentWithModule thisModule "fileTypeView" cpt
+fileTypeViewCpt = here.component "fileTypeView" cpt
   where
     cpt { dispatch
         , droppedFile: Just (DroppedFile {blob, fileType}) /\ setDroppedFile
@@ -338,7 +338,7 @@ uploadTermListView :: Record Props -> R.Element
 uploadTermListView props = R.createElement uploadTermListViewCpt props []
 
 uploadTermListViewCpt :: R.Component Props
-uploadTermListViewCpt = R.hooksComponentWithModule thisModule "uploadTermListView" cpt
+uploadTermListViewCpt = here.component "uploadTermListView" cpt
   where
     cpt {dispatch, id, nodeType} _ = do
       mFile :: R.State (Maybe UploadFile) <- R.useState' Nothing
@@ -384,7 +384,7 @@ uploadTermButton :: Record UploadTermButtonProps -> R.Element
 uploadTermButton props = R.createElement uploadTermButtonCpt props []
 
 uploadTermButtonCpt :: R.Component UploadTermButtonProps
-uploadTermButtonCpt = R.hooksComponentWithModule thisModule "uploadTermButton" cpt
+uploadTermButtonCpt = here.component "uploadTermButton" cpt
   where
     cpt {dispatch, id, mFile: (mFile /\ setMFile), nodeType} _ = do
         pure $ H.button {className: "btn btn-primary", disabled, on: {click: onClick}} [ H.text "Upload" ]

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

@@ -16,8 +16,8 @@ import Gargantext.Sessions (Session, get)
 import Gargantext.Types as GT
 import Gargantext.Utils.Reactix as R2
 
-thisModule :: String
-thisModule = "Gargantext.Components.Forest.Tree.Node.Tools.ProgressBar"
+here :: R2.Here
+here = R2.here "Gargantext.Components.Forest.Tree.Node.Tools.ProgressBar"
 
 
 data BarType = Bar | Pie
@@ -35,7 +35,7 @@ asyncProgressBar :: Record Props -> R.Element
 asyncProgressBar p = R.createElement asyncProgressBarCpt p []
 
 asyncProgressBarCpt :: R.Component Props
-asyncProgressBarCpt = R.hooksComponentWithModule thisModule "asyncProgressBar" cpt
+asyncProgressBarCpt = here.component "asyncProgressBar" cpt
   where
     cpt props@{ asyncTask: (GT.AsyncTaskWithType {task: GT.AsyncTask {id}})
               , barType
@@ -81,7 +81,7 @@ progressIndicator :: Record ProgressIndicatorProps -> R.Element
 progressIndicator p = R.createElement progressIndicatorCpt p []
 
 progressIndicatorCpt :: R.Component ProgressIndicatorProps
-progressIndicatorCpt = R.hooksComponentWithModule thisModule "progressIndicator" cpt
+progressIndicatorCpt = here.component "progressIndicator" cpt
   where
     cpt { barType: Bar, label, progress } _ = do
       pure $

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

@@ -18,9 +18,10 @@ import Gargantext.Hooks.Loader (useLoader)
 import Gargantext.Routes as GR
 import Gargantext.Sessions (Session(..), get)
 import Gargantext.Types as GT
+import Gargantext.Utils.Reactix as R2
 
-thisModule :: String
-thisModule = "Gargantext.Components.Forest.Tree.Node.Tools.SubTree"
+here :: R2.Here
+here = R2.here "Gargantext.Components.Forest.Tree.Node.Tools.SubTree"
 
 type SubTreeParamsIn =
   ( subTreeParams :: SubTreeParams
@@ -38,7 +39,7 @@ subTreeView :: Record SubTreeParamsProps -> R.Element
 subTreeView props = R.createElement subTreeViewCpt props []
 
 subTreeViewCpt :: R.Component SubTreeParamsProps
-subTreeViewCpt = R.hooksComponentWithModule thisModule "subTreeView" cpt
+subTreeViewCpt = here.component "subTreeView" cpt
   where
     cpt params@{ action
                , dispatch
@@ -86,7 +87,7 @@ subTreeViewLoaded :: Record CorpusTreeProps -> R.Element
 subTreeViewLoaded props = R.createElement subTreeViewLoadedCpt props []
 
 subTreeViewLoadedCpt :: R.Component CorpusTreeProps
-subTreeViewLoadedCpt = R.hooksComponentWithModule thisModule "subTreeViewLoadedCpt" cpt
+subTreeViewLoadedCpt = here.component "subTreeViewLoadedCpt" cpt
   where
     cpt p@{dispatch, id, nodeType, session, tree, handed} _ = do
       pure $ H.div {className:"tree"}
@@ -101,7 +102,7 @@ subTreeTreeView :: Record CorpusTreeProps -> R.Element
 subTreeTreeView props = R.createElement subTreeTreeViewCpt props []
 
 subTreeTreeViewCpt :: R.Component CorpusTreeProps
-subTreeTreeViewCpt = R.hooksComponentWithModule thisModule "subTreeTreeViewCpt" cpt
+subTreeTreeViewCpt = here.component "subTreeTreeViewCpt" cpt
   where
     cpt p@{ id
           , tree: NTree (LNode { id: targetId

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

@@ -15,7 +15,7 @@ import Gargantext.Types as GT
 import Gargantext.Sessions (Session)
 import Gargantext.Utils.Reactix as R2
 
-thisModule = "Gargantext.Components.Forest.Tree.Node.Tools.Sync"
+here = R2.here "Gargantext.Components.Forest.Tree.Node.Tools.Sync"
 
 
 -- | Sync Node (Graph)
@@ -30,7 +30,7 @@ nodeActionsGraph :: Record NodeActionsGraphProps -> R.Element
 nodeActionsGraph p = R.createElement nodeActionsGraphCpt p []
 
 nodeActionsGraphCpt :: R.Component NodeActionsGraphProps
-nodeActionsGraphCpt = R.hooksComponentWithModule thisModule "nodeActionsGraph" cpt
+nodeActionsGraphCpt = here.component "nodeActionsGraph" cpt
   where
     cpt { id, graphVersions, session, refresh } _ = do
       pure $ H.div { className: "node-actions" } [
@@ -50,7 +50,7 @@ graphUpdateButton :: Record GraphUpdateButtonProps -> R.Element
 graphUpdateButton p = R.createElement graphUpdateButtonCpt p []
 
 graphUpdateButtonCpt :: R.Component GraphUpdateButtonProps
-graphUpdateButtonCpt = R.hooksComponentWithModule thisModule "graphUpdateButton" cpt
+graphUpdateButtonCpt = here.component "graphUpdateButton" cpt
   where
     cpt { id, session, refresh } _ = do
       enabled <- R.useState' true
@@ -86,7 +86,7 @@ nodeActionsNodeList :: Record NodeActionsNodeListProps -> R.Element
 nodeActionsNodeList p = R.createElement nodeActionsNodeListCpt p []
 
 nodeActionsNodeListCpt :: R.Component NodeActionsNodeListProps
-nodeActionsNodeListCpt = R.hooksComponentWithModule thisModule "nodeActionsNodeList" cpt
+nodeActionsNodeListCpt = here.component "nodeActionsNodeList" cpt
   where
     cpt props _ = do
       pure $ H.div { className: "node-actions" } [
@@ -105,7 +105,7 @@ nodeListUpdateButton :: Record NodeListUpdateButtonProps -> R.Element
 nodeListUpdateButton p = R.createElement nodeListUpdateButtonCpt p []
 
 nodeListUpdateButtonCpt :: R.Component NodeListUpdateButtonProps
-nodeListUpdateButtonCpt = R.hooksComponentWithModule thisModule "nodeListUpdateButton" cpt
+nodeListUpdateButtonCpt = here.component "nodeListUpdateButton" cpt
   where
     cpt { listId, nodeId, nodeType, session, refresh } _ = do
       enabled <- R.useState' true

src/Gargantext/Components/Graph.purs

@@ -22,7 +22,7 @@ import Gargantext.Hooks.Sigmax.Types as SigmaxTypes
 import Gargantext.Hooks.Sigmax.Sigma as Sigma
 import Gargantext.Utils.Reactix as R2
 
-thisModule = "Gargantext.Components.Graph"
+here = R2.here "Gargantext.Components.Graph"
 
 type OnProps  = ()
 
@@ -47,7 +47,7 @@ graph :: forall s fa2. Record (Props s fa2) -> R.Element
 graph props = R.createElement graphCpt props []
 
 graphCpt :: forall s fa2. R.Component (Props s fa2)
-graphCpt = R.hooksComponentWithModule thisModule "graph" cpt
+graphCpt = here.component "graph" cpt
   where
     cpt props _ = do
       stageHooks props

src/Gargantext/Components/GraphExplorer.purs

@@ -19,6 +19,7 @@ import Partial.Unsafe (unsafePartial)
 import Reactix as R
 import Reactix.DOM.HTML as RH
 import Record as Record
+import Toestand as T
 
 import Gargantext.AsyncTasks as GAT
 import Gargantext.Components.Forest (forest)
@@ -33,25 +34,26 @@ 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 (Session, Sessions, get)
+import Gargantext.Sessions (OpenNodes, Session, Sessions, get)
 import Gargantext.Types as Types
 import Gargantext.Utils.Range as Range
 import Gargantext.Utils.Reactix as R2
 import Gargantext.Utils.Reload as GUR
+import Gargantext.Utils.Toestand as T2
 
-thisModule :: String
-thisModule = "Gargantext.Components.GraphExplorer"
+here :: R2.Here
+here = R2.here "Gargantext.Components.GraphExplorer"
 
 type LayoutProps = (
-    tasks :: R.Ref (Maybe GAT.Reductor)
-  , backend       :: R.State (Maybe Backend)
-  , route  :: AppRoute
+    backend       :: T.Cursor Backend
   , frontends     :: Frontends
   , graphId       :: GET.GraphId
-  , handed        :: Types.Handed
+  , handed        :: T.Cursor Types.Handed
+  , route         :: AppRoute
   , session       :: Session
-  , sessions      :: Sessions
-  , showLogin     :: R.State Boolean
+  , sessions      :: T.Cursor Sessions
+  , showLogin     :: T.Cursor Boolean
+  , tasks         :: T.Cursor (Maybe GAT.Reductor)
   )
 
 type Props =
@@ -67,7 +69,7 @@ explorerLayout :: Record LayoutProps -> R.Element
 explorerLayout props = R.createElement explorerLayoutCpt props []
 
 explorerLayoutCpt :: R.Component LayoutProps
-explorerLayoutCpt = R.hooksComponentWithModule thisModule "explorerLayout" cpt
+explorerLayoutCpt = here.component "explorerLayout" cpt
   where
     cpt props _ = do
       graphVersion <- GUR.new
@@ -76,7 +78,7 @@ explorerLayoutCpt = R.hooksComponentWithModule thisModule "explorerLayout" cpt
 explorerLayoutView :: GUR.ReloadS -> Record LayoutProps -> R.Element
 explorerLayoutView graphVersion p = R.createElement el p []
   where
-    el = R.hooksComponentWithModule thisModule "explorerLayoutView" cpt
+    el = here.component "explorerLayoutView" cpt
     cpt props@{ graphId, session } _ = do
       useLoader graphId (getNodes session graphVersion) handler
       where
@@ -91,7 +93,7 @@ explorer :: Record Props -> R.Element
 explorer props = R.createElement explorerCpt props []
 
 explorerCpt :: R.Component Props
-explorerCpt = R.hooksComponentWithModule thisModule "explorer" cpt
+explorerCpt = here.component "explorer" cpt
   where
     cpt props@{ tasks
               , backend
@@ -107,6 +109,7 @@ explorerCpt = R.hooksComponentWithModule thisModule "explorer" cpt
               , sessions
               , showLogin
               } _ = do
+      handed' <- T.useLive T.unequal handed
 
       let startForceAtlas = maybe true (\(GET.MetaData { startForceAtlas }) -> startForceAtlas) mMetaData
 
@@ -117,17 +120,19 @@ explorerCpt = R.hooksComponentWithModule thisModule "explorer" cpt
       dataRef <- R.useRef graph
       graphRef <- R.useRef null
       graphVersionRef <- R.useRef (GUR.value graphVersion)
-      reloadForest <- GUR.new
-      reloadForest <- GUR.newIInitialized reloadForest
+      reloadForest <- T2.useCursed 0
+      -- reloadForest <- GUR.newIInitialized reloadForest
       controls <- Controls.useGraphControls { forceAtlasS
-                                           , graph
-                                           , graphId
-                                           , hyperdataGraph
-                                           , session
-                                           , reloadForest: \_ -> GUR.bump reloadForest
-                                           }
+                                            , graph
+                                            , graphId
+                                            , hyperdataGraph
+                                            , session
+                                            , reloadForest: \_ -> GUR.bumpCursor reloadForest
+                                            }
       multiSelectEnabledRef <- R.useRef $ fst controls.multiSelectEnabled
 
+      forestOpen <- T2.useCursed $ Set.empty
+
       R.useEffect' $ do
         let readData = R.readRef dataRef
         let gv = R.readRef graphVersionRef
@@ -158,20 +163,21 @@ explorerCpt = R.hooksComponentWithModule thisModule "explorer" cpt
                     ]
             ]
         , RH.div { className: "graph-container" } [
-            inner handed [
+            inner handed' [
               rowControls [ Controls.controls controls ]
-            , RH.div { className: "row graph-row" } $ mainLayout handed $
-                tree { tasks
-                    , backend
-                    , route
-                    , frontends
-                    , handed
-                    , reload: reloadForest
-                    , sessions
-                    , show: fst controls.showTree
-                    , showLogin: snd showLogin
-                    , reloadForest
-                    }
+            , RH.div { className: "row graph-row" } $ mainLayout handed' $
+                tree { backend
+                     , forestOpen
+                     , frontends
+                     , handed
+                     , reload: reloadForest
+                     , route
+                     , reloadForest
+                     , sessions
+                     , show: fst controls.showTree
+                     , showLogin: showLogin
+                     , tasks
+                     }
                 /\
                 RH.div { ref: graphRef, id: "graph-view", className: "col-md-12" } []
                 /\
@@ -185,15 +191,15 @@ explorerCpt = R.hooksComponentWithModule thisModule "explorer" cpt
                           }
                 /\
                 mSidebar mMetaData { frontends
-                                  , graph
-                                  , graphId
-                                  , graphVersion
-                                  , removedNodeIds : controls.removedNodeIds
-                                  , session
-                                  , selectedNodeIds: controls.selectedNodeIds
-                                  , showSidePanel  :   controls.showSidePanel
-                                  , reloadForest
-                                  }
+                                   , graph
+                                   , graphId
+                                   , graphVersion
+                                   , removedNodeIds : controls.removedNodeIds
+                                   , session
+                                   , selectedNodeIds: controls.selectedNodeIds
+                                   , showSidePanel  :   controls.showSidePanel
+                                   , reloadForest
+                                   }
             ]
           ]
         ]
@@ -220,17 +226,18 @@ explorerCpt = R.hooksComponentWithModule thisModule "explorer" cpt
 
     tree :: Record TreeProps -> R.Element
     tree { show: false } = RH.div { id: "tree" } []
-    tree { tasks, backend, frontends, handed, route, reload, sessions, showLogin, reloadForest } =
+    tree { backend, forestOpen, frontends, handed, reload, route, sessions, showLogin, reloadForest, tasks } =
       RH.div {className: "col-md-2 graph-tree"} [
-        forest { reloadRoot: reload
-               , tasks
-               , backend
-               , route
+        forest { backend
+               , forestOpen
                , frontends
                , handed
+               , reloadForest
+               , reloadRoot: reload
+               , route
                , sessions
                , showLogin
-               , reloadForest } []
+               , tasks } []
       ]
 
     mSidebar :: Maybe GET.MetaData
@@ -240,17 +247,18 @@ explorerCpt = R.hooksComponentWithModule thisModule "explorer" cpt
     mSidebar (Just metaData) props =
       Sidebar.sidebar (Record.merge props { metaData })
 
-type TreeProps =
-  ( tasks :: R.Ref (Maybe GAT.Reductor)
-  , backend       :: R.State (Maybe Backend)
-  , route  :: AppRoute
-  , frontends     :: Frontends
-  , handed        :: Types.Handed
-  , reload        :: GUR.ReloadS
-  , sessions      :: Sessions
-  , show          :: Boolean
-  , showLogin     :: R.Setter Boolean
-  , reloadForest  :: GUR.ReloadWithInitializeRef
+type TreeProps = (
+    backend      :: T.Cursor Backend
+  , forestOpen :: T.Cursor OpenNodes
+  , frontends    :: Frontends
+  , handed       :: T.Cursor Types.Handed
+  , reload       :: T.Cursor T2.Reload
+  , reloadForest :: T.Cursor T2.Reload
+  , route        :: AppRoute
+  , sessions     :: T.Cursor Sessions
+  , show         :: Boolean
+  , showLogin    :: T.Cursor Boolean
+  , tasks        :: T.Cursor (Maybe GAT.Reductor)
   )
 
 type MSidebarProps =
@@ -258,11 +266,11 @@ type MSidebarProps =
   , graph           :: SigmaxT.SGraph
   , graphId         :: GET.GraphId
   , graphVersion    :: GUR.ReloadS
+  , reloadForest    :: T.Cursor T2.Reload
   , removedNodeIds  :: R.State SigmaxT.NodeIds
-  , showSidePanel   :: R.State GET.SidePanelState
   , selectedNodeIds :: R.State SigmaxT.NodeIds
   , session         :: Session
-  , reloadForest    :: GUR.ReloadS
+  , showSidePanel   :: R.State GET.SidePanelState
   )
 
 type GraphProps = (
@@ -280,7 +288,7 @@ graphView :: Record GraphProps -> R.Element
 graphView props = R.createElement graphViewCpt props []
 
 graphViewCpt :: R.Component GraphProps
-graphViewCpt = R.hooksComponentWithModule thisModule "graphView" cpt
+graphViewCpt = here.component "graphView" cpt
   where
     cpt { controls
         , elRef

src/Gargantext/Components/GraphExplorer/Button.purs

@@ -29,7 +29,7 @@ import Gargantext.Hooks.Sigmax.Sigma as Sigma
 import Gargantext.Sessions (Session)
 import Gargantext.Utils.Reactix as R2
 
-thisModule = "Gargantext.Components.GraphExplorer.Button"
+here = R2.here "Gargantext.Components.GraphExplorer.Button"
 
 type Props = (
     onClick :: forall e. e -> Effect Unit
@@ -40,7 +40,7 @@ simpleButton :: Record Props -> R.Element
 simpleButton props = R.createElement simpleButtonCpt props []
 
 simpleButtonCpt :: R.Component Props
-simpleButtonCpt = R.hooksComponentWithModule thisModule "simpleButton" cpt
+simpleButtonCpt = here.component "simpleButton" cpt
   where
     cpt {onClick, text} _ = do
       pure $ H.button { className: "btn btn-outline-primary"

src/Gargantext/Components/GraphExplorer/Controls.purs

@@ -19,6 +19,7 @@ import Effect.Timer (setTimeout)
 import Prelude
 import Reactix as R
 import Reactix.DOM.HTML as RH
+import Toestand as T
 
 import Gargantext.Components.Graph as Graph
 import Gargantext.Components.GraphExplorer.Button (centerButton, cameraButton)
@@ -32,40 +33,42 @@ import Gargantext.Hooks.Sigmax.Types as SigmaxT
 import Gargantext.Sessions (Session)
 import Gargantext.Utils.Range as Range
 import Gargantext.Utils.Reactix as R2
+import Gargantext.Utils.Toestand as T2
 
-thisModule = "Gargantext.Components.GraphExplorer.Controls"
+here :: R2.Here
+here = R2.here "Gargantext.Components.GraphExplorer.Controls"
 
-type Controls =
-  ( edgeConfluence :: R.State Range.NumberRange
-  , edgeWeight :: R.State Range.NumberRange
-  , forceAtlasState :: R.State SigmaxT.ForceAtlasState
-  , graph           :: SigmaxT.SGraph
-  , graphId         :: GET.GraphId
-  , graphStage      :: R.State Graph.Stage
-  , hyperdataGraph  :: GET.HyperdataGraph
-  , multiSelectEnabled :: R.State Boolean
-  , nodeSize        :: R.State Range.NumberRange
-  , removedNodeIds  :: R.State SigmaxT.NodeIds
-  , selectedNodeIds :: R.State SigmaxT.NodeIds
-  , session         :: Session
-  , showControls    :: R.State Boolean
-  , showEdges       :: R.State SigmaxT.ShowEdgesState
-  , showLouvain     :: R.State Boolean
-  , showSidePanel   :: R.State GET.SidePanelState
-  , showTree        :: R.State Boolean
-  , sigmaRef        :: R.Ref Sigmax.Sigma
-  , reloadForest      :: Unit -> Effect Unit
+type Controls = (
+    edgeConfluence     :: T.Cursor Range.NumberRange
+  , edgeWeight         :: T.Cursor Range.NumberRange
+  , forceAtlasState    :: T.Cursor SigmaxT.ForceAtlasState
+  , graph              :: SigmaxT.SGraph
+  , graphId            :: GET.GraphId
+  , graphStage         :: T.Cursor Graph.Stage
+  , hyperdataGraph     :: GET.HyperdataGraph
+  , multiSelectEnabled :: T.Cursor Boolean
+  , nodeSize           :: T.Cursor Range.NumberRange
+  , reloadForest       :: Unit -> Effect Unit
+  , removedNodeIds     :: T.Cursor SigmaxT.NodeIds
+  , selectedNodeIds    :: T.Cursor SigmaxT.NodeIds
+  , session            :: Session
+  , showControls       :: T.Cursor Boolean
+  , showEdges          :: T.Cursor SigmaxT.ShowEdgesState
+  , showLouvain        :: T.Cursor Boolean
+  , showSidePanel      :: T.Cursor GET.SidePanelState
+  , showTree           :: T.Cursor Boolean
+  , sigmaRef           :: R.Ref Sigmax.Sigma
   )
 
-type LocalControls =
-  ( labelSize :: R.State Number
-  , mouseSelectorSize :: R.State Number
+type LocalControls = (
+    labelSize         :: T.Cursor Number
+  , mouseSelectorSize :: T.Cursor Number
   )
 
 initialLocalControls :: R.Hooks (Record LocalControls)
 initialLocalControls = do
-  labelSize <- R.useState' 14.0
-  mouseSelectorSize <- R.useState' 15.0
+  labelSize <- T2.useCursed 14.0
+  mouseSelectorSize <- T2.useCursed 15.0
 
   pure $ {
     labelSize
@@ -76,7 +79,7 @@ controls :: Record Controls -> R.Element
 controls props = R.createElement controlsCpt props []
 
 controlsCpt :: R.Component Controls
-controlsCpt = R.hooksComponentWithModule thisModule "controls" cpt
+controlsCpt = here.component "controls" cpt
   where
     cpt props _ = do
       localControls <- initialLocalControls
@@ -213,22 +216,22 @@ useGraphControls { forceAtlasS
                  , hyperdataGraph
                  , session
                  , reloadForest } = do
-  edgeConfluence <- R.useState' $ Range.Closed { min: 0.0, max: 1.0 }
-  edgeWeight <- R.useState' $ Range.Closed {
+  edgeConfluence <- T2.useCursed $ Range.Closed { min: 0.0, max: 1.0 }
+  edgeWeight <- T2.useCursed $ Range.Closed {
       min: 0.0
     , max: I.toNumber $ Seq.length $ SigmaxT.graphEdges graph
     }
-  forceAtlasState <- R.useState' forceAtlasS
-  graphStage      <- R.useState' Graph.Init
-  multiSelectEnabled <- R.useState' false
-  nodeSize <- R.useState' $ Range.Closed { min: 0.0, max: 100.0 }
-  removedNodeIds <- R.useState' SigmaxT.emptyNodeIds
-  selectedNodeIds <- R.useState' SigmaxT.emptyNodeIds
-  showControls    <- R.useState' false
-  showEdges <- R.useState' SigmaxT.EShow
-  showLouvain <- R.useState' false
-  showSidePanel   <- R.useState' GET.InitialClosed
-  showTree <- R.useState' false
+  forceAtlasState <- T2.useCursed forceAtlasS
+  graphStage      <- T2.useCursed Graph.Init
+  multiSelectEnabled <- T2.useCursed false
+  nodeSize <- T2.useCursed $ Range.Closed { min: 0.0, max: 100.0 }
+  removedNodeIds <- T2.useCursed SigmaxT.emptyNodeIds
+  selectedNodeIds <- T2.useCursed SigmaxT.emptyNodeIds
+  showControls    <- T2.useCursed false
+  showEdges <- T2.useCursed SigmaxT.EShow
+  showLouvain <- T2.useCursed false
+  showSidePanel   <- T2.useCursed GET.InitialClosed
+  showTree <- T2.useCursed false
   sigma <- Sigmax.initSigma
   sigmaRef <- R.useRef sigma
 

src/Gargantext/Components/GraphExplorer/ControlsToggleButton.purs

@@ -9,7 +9,7 @@ import Reactix.DOM.HTML as H
 
 import Gargantext.Utils.Reactix as R2
 
-thisModule = "Gargantext.Components.GraphExplorer.ControlsToggleButton"
+here = R2.here "Gargantext.Components.GraphExplorer.ControlsToggleButton"
 
 type Props = ( state :: R.State Boolean )
 
@@ -17,7 +17,7 @@ controlsToggleButton :: Record Props -> R.Element
 controlsToggleButton props = R.createElement controlsToggleButtonCpt props []
 
 controlsToggleButtonCpt :: R.Component Props
-controlsToggleButtonCpt = R.hooksComponentWithModule thisModule "controlsToggleButton" cpt
+controlsToggleButtonCpt = here.component "controlsToggleButton" cpt
   where
     cpt {state} _ = do
       let (open /\ setOpen) = state

src/Gargantext/Components/GraphExplorer/Legend.purs

@@ -12,7 +12,7 @@ import Reactix.DOM.HTML as RH
 import Gargantext.Components.GraphExplorer.Types (Legend(..), intColor)
 import Gargantext.Utils.Reactix as R2
 
-thisModule = "Gargantext.Components.GraphExplorer.Legend"
+here = R2.here "Gargantext.Components.GraphExplorer.Legend"
 
 type Props = ( items :: Seq Legend )
 
@@ -20,7 +20,7 @@ legend :: Record Props -> R.Element
 legend props = R.createElement legendCpt props []
 
 legendCpt :: R.Component Props
-legendCpt = R.hooksComponentWithModule thisModule "legend" cpt
+legendCpt = here.component "legend" cpt
   where
     cpt {items} _ = pure $ RH.div {} [foldMap entry items]
 

src/Gargantext/Components/GraphExplorer/RangeControl.purs

@@ -15,7 +15,7 @@ import Gargantext.Components.RangeSlider as RS
 import Gargantext.Utils.Range as Range
 import Gargantext.Utils.Reactix as R2
 
-thisModule = "Gargantext.Components.GraphExplorer.RangeControl"
+here = R2.here "Gargantext.Components.GraphExplorer.RangeControl"
 
 type Props = (
     caption :: String
@@ -26,7 +26,7 @@ rangeControl :: Record Props -> R.Element
 rangeControl props = R.createElement rangeControlCpt props []
 
 rangeControlCpt :: R.Component Props
-rangeControlCpt = R.hooksComponentWithModule thisModule "rangeButton" cpt
+rangeControlCpt = here.component "rangeButton" cpt
   where
     cpt {caption, sliderProps} _ = do
       pure $

src/Gargantext/Components/GraphExplorer/Search.purs

@@ -17,7 +17,7 @@ import Gargantext.Hooks.Sigmax.Types as SigmaxT
 import Gargantext.Utils (queryMatchesLabel)
 import Gargantext.Utils.Reactix as R2
 
-thisModule = "Gargantext.Components.GraphExplorer.Search"
+here = R2.here "Gargantext.Components.GraphExplorer.Search"
 
 type Props = (
     graph           :: SigmaxT.SGraph
@@ -37,7 +37,7 @@ nodeSearchControl :: Record Props -> R.Element
 nodeSearchControl props = R.createElement sizeButtonCpt props []
 
 sizeButtonCpt :: R.Component Props
-sizeButtonCpt = R.hooksComponentWithModule thisModule "nodeSearchControl" cpt
+sizeButtonCpt = here.component "nodeSearchControl" cpt
   where
     cpt {graph, multiSelectEnabled, selectedNodeIds} _ = do
       search@(search' /\ setSearch) <- R.useState' ""

src/Gargantext/Components/GraphExplorer/Sidebar.purs

@@ -14,9 +14,11 @@ import Data.Tuple.Nested ((/\))
 import Effect (Effect)
 import Effect.Aff (Aff, launchAff_)
 import Effect.Class (liftEffect)
+import Partial.Unsafe (unsafePartial)
 import Reactix as R
 import Reactix.DOM.HTML as RH
 import Reactix.DOM.HTML as H
+import Toestand as T
 
 import Gargantext.Prelude
 
@@ -35,28 +37,29 @@ import Gargantext.Sessions (Session)
 import Gargantext.Types (CTabNgramType, TabSubType(..), TabType(..), TermList(..), modeTabType)
 import Gargantext.Utils.Reactix as R2
 import Gargantext.Utils.Reload as GUR
-import Partial.Unsafe (unsafePartial)
+import Gargantext.Utils.Toestand as T2
 
-thisModule = "Gargantext.Components.GraphExplorer.Sidebar"
+here :: R2.Here
+here = R2.here "Gargantext.Components.GraphExplorer.Sidebar"
 
-type Props =
-  ( frontends       :: Frontends
+type Props = (
+    frontends       :: Frontends
   , graph           :: SigmaxT.SGraph
   , graphId         :: Int
   , graphVersion    :: GUR.ReloadS
   , metaData        :: GET.MetaData
-  , removedNodeIds  :: R.State SigmaxT.NodeIds
-  , selectedNodeIds :: R.State SigmaxT.NodeIds
+  , reloadForest    :: T.Cursor T2.Reload
+  , removedNodeIds  :: T.Cursor SigmaxT.NodeIds
+  , selectedNodeIds :: T.Cursor SigmaxT.NodeIds
   , session         :: Session
-  , showSidePanel   :: R.State GET.SidePanelState
-  , reloadForest      :: GUR.ReloadS
+  , showSidePanel   :: T.Cursor GET.SidePanelState
   )
 
 sidebar :: Record Props -> R.Element
 sidebar props = R.createElement sidebarCpt props []
 
 sidebarCpt :: R.Component Props
-sidebarCpt = R.hooksComponentWithModule thisModule "sidebar" cpt
+sidebarCpt = here.component "sidebar" cpt
   where
     cpt {showSidePanel: (GET.Closed /\ _)} _children = do
       pure $ RH.div {} []
@@ -68,22 +71,40 @@ sidebarCpt = R.hooksComponentWithModule thisModule "sidebar" cpt
         , sideTab (fst showSidePanel) props
         ]
 
-sideTabNav :: R.State SidePanelState -> Array SideTab -> R.Element
-sideTabNav (sidePanel /\ setSidePanel) sideTabs =
-  R.fragment [ H.div { className: "text-primary center"} [H.text ""]
-                     , H.div {className: "nav nav-tabs"} (liItem <$> sideTabs)
-                     -- , H.div {className: "center"} [ H.text "Doc sideTabs"]
-             ]
-    where
-      liItem :: SideTab -> R.Element
-      liItem  tab =
-        H.div { className : "nav-item nav-link"
-                          <> if (Opened tab) == sidePanel
-                               then " active"
-                               else ""
-            , on: { click: \_ -> setSidePanel $ const (Opened tab)
-                  }
-            } [ H.text $ show tab ]
+type SideTabNavProps = (
+    sidePanel :: T.Cursor GET.SidePanelState
+  , sideTabs  :: Array SideTab
+  )
+
+sideTabNav :: R2.Component SideTabNavProps
+sideTabNav = R.createElement sideTabNavCpt
+
+sideTabNavCpt :: R.Component SideTabNavProps
+sideTabNavCpt = here.component "sideTabNav" cpt
+  where
+    cpt { sidePanel
+        , sideTabs } _ = do
+      sidePanel' <- T.useLive T.unequal sidePanel
+
+      pure $ R.fragment [ H.div { className: "text-primary center"} [H.text ""]
+                        , H.div { className: "nav nav-tabs"} (liItem sidePanel' <$> sideTabs)
+                            -- , H.div {className: "center"} [ H.text "Doc sideTabs"]
+                        ]
+      where
+        liItem :: GET.SidePanelState -> SideTab -> R.Element
+        liItem sidePanel' tab =
+          H.div { className : "nav-item nav-link"
+                            <> if (Opened tab) == sidePanel'
+                                 then " active"
+                                 else ""
+              , on: { click: \_ -> T.write (Opened tab) sidePanel
+                    }
+              } [ H.text $ show tab ]
+
+type SideTabProps = (
+    frontends       :: Frontends
+  , metaData        :: GET.MetaData
+  )
 
 sideTab :: SidePanelState -> Record Props -> R.Element
 sideTab (Opened SideTabLegend) props@{metaData} =
@@ -101,7 +122,7 @@ sideTab (Opened SideTabData) props =
                              props.metaData
                              props.session
                              (SigmaxT.nodesGraphMap props.graph)
-                             props.selectedNodeIds
+                             selectedNodeIds'
                      ]
             ]
     where
@@ -191,7 +212,7 @@ onClickRemove rType props' nodesMap' e = do
 
 
 
-badge :: R.State SigmaxT.NodeIds -> Record SigmaxT.Node -> R.Element
+badge :: T.Cursor SigmaxT.NodeIds -> Record SigmaxT.Node -> R.Element
 badge (_ /\ setNodeIds) {id, label} =
   RH.a { className: "badge badge-pill badge-light"
        , on: { click: onClick }
@@ -200,10 +221,10 @@ badge (_ /\ setNodeIds) {id, label} =
     onClick e = do
       setNodeIds $ const $ Set.singleton id
 
-badges :: SigmaxT.SGraph -> R.State SigmaxT.NodeIds -> Seq.Seq (Record SigmaxT.Node)
+badges :: SigmaxT.SGraph -> T.Cursor SigmaxT.NodeIds -> Seq.Seq (Record SigmaxT.Node)
 badges graph (selectedNodeIds /\ _) = SigmaxT.graphNodes $ SigmaxT.nodesById graph selectedNodeIds
 
-neighbourBadges :: SigmaxT.SGraph -> R.State SigmaxT.NodeIds -> Seq.Seq (Record SigmaxT.Node)
+neighbourBadges :: SigmaxT.SGraph -> T.Cursor SigmaxT.NodeIds -> Seq.Seq (Record SigmaxT.Node)
 neighbourBadges graph (selectedNodeIds /\ _) = SigmaxT.neighbours graph selectedNodes
   where
     selectedNodes = SigmaxT.graphNodes $ SigmaxT.nodesById graph selectedNodeIds
@@ -271,10 +292,10 @@ query :: SearchType
       -> GET.MetaData
       -> Session
       -> SigmaxT.NodesMap
-      -> R.State SigmaxT.NodeIds
+      -> SigmaxT.NodeIds
       -> R.Element
-query _ _ _ _ _ (selectedNodeIds /\ _) | Set.isEmpty selectedNodeIds = RH.div {} []
-query searchType frontends (GET.MetaData metaData) session nodesMap (selectedNodeIds /\ _) =
+query _ _ _ _ _ selectedNodeIds | Set.isEmpty selectedNodeIds = RH.div {} []
+query searchType frontends (GET.MetaData metaData) session nodesMap selectedNodeIds =
   query' (head metaData.corpusId)
   where
     query' Nothing         = RH.div {} []

src/Gargantext/Components/GraphExplorer/SlideButton.purs

@@ -16,7 +16,7 @@ import Gargantext.Hooks.Sigmax as Sigmax
 import Gargantext.Hooks.Sigmax.Sigma as Sigma
 import Gargantext.Utils.Reactix as R2
 
-thisModule = "Gargantext.Components.GraphExplorer.SlideButton"
+here = R2.here "Gargantext.Components.GraphExplorer.SlideButton"
 
 type Props = (
     state :: R.State Number
@@ -30,7 +30,7 @@ sizeButton :: Record Props -> R.Element
 sizeButton props = R.createElement sizeButtonCpt props []
 
 sizeButtonCpt :: R.Component Props
-sizeButtonCpt = R.hooksComponentWithModule thisModule "sizeButton" cpt
+sizeButtonCpt = here.component "sizeButton" cpt
   where
     cpt {state, caption, min, max, onChange} _ = do
       let (value /\ setValue) = state

src/Gargantext/Components/GraphExplorer/ToggleButton.purs

@@ -22,7 +22,7 @@ import Gargantext.Utils.Reactix as R2
 import Reactix as R
 import Reactix.DOM.HTML as H
 
-thisModule = "Gargantext.Components.GraphExplorer.ToggleButton"
+here = R2.here "Gargantext.Components.GraphExplorer.ToggleButton"
 
 type Props = (
     state :: R.State Boolean
@@ -36,7 +36,7 @@ toggleButton :: Record Props -> R.Element
 toggleButton props = R.createElement toggleButtonCpt props []
 
 toggleButtonCpt :: R.Component Props
-toggleButtonCpt = R.hooksComponentWithModule thisModule "toggleButton" cpt
+toggleButtonCpt = here.component "toggleButton" cpt
   where
     cpt {state, onMessage, offMessage, onClick, style} _ = do
       let (toggled /\ _) = state
@@ -68,7 +68,7 @@ edgesToggleButton :: Record EdgesButtonProps -> R.Element
 edgesToggleButton props = R.createElement edgesToggleButtonCpt props []
 
 edgesToggleButtonCpt :: R.Component EdgesButtonProps
-edgesToggleButtonCpt = R.hooksComponentWithModule thisModule "edgesToggleButton" cpt
+edgesToggleButtonCpt = here.component "edgesToggleButton" cpt
   where
     cpt {state: (state /\ setState)} _ = do
       pure $ H.button { className: "btn btn-outline-primary " <> cls state
@@ -111,7 +111,7 @@ pauseForceAtlasButton :: Record ForceAtlasProps -> R.Element
 pauseForceAtlasButton props = R.createElement pauseForceAtlasButtonCpt props []
 
 pauseForceAtlasButtonCpt :: R.Component ForceAtlasProps
-pauseForceAtlasButtonCpt = R.hooksComponentWithModule thisModule "forceAtlasToggleButton" cpt
+pauseForceAtlasButtonCpt = here.component "forceAtlasToggleButton" cpt
   where
     cpt {state: (state /\ setState)} _ = do
       pure $ H.button { className: "btn btn-outline-primary " <> cls state
@@ -142,7 +142,7 @@ treeToggleButton state =
 sidebarToggleButton :: R.State GET.SidePanelState -> R.Element
 sidebarToggleButton (state /\ setState) = R.createElement el {} []
   where
-    el = R.hooksComponentWithModule thisModule "sidebarToggleButton" cpt
+    el = here.component "sidebarToggleButton" cpt
     cpt {} _ = do
       pure $ H.button { className: "btn btn-outline-light " <> cls state
                       , on: { click: onClick}

src/Gargantext/Components/InputWithAutocomplete.purs

@@ -13,7 +13,7 @@ import Reactix.DOM.HTML as H
 
 import Gargantext.Utils.Reactix as R2
 
-thisModule = "Gargantext.Components.InputWithAutocomplete"
+here = R2.here "Gargantext.Components.InputWithAutocomplete"
 
 
 type Completions = Array String
@@ -30,7 +30,7 @@ inputWithAutocomplete :: Record Props -> R.Element
 inputWithAutocomplete props = R.createElement inputWithAutocompleteCpt props []
 
 inputWithAutocompleteCpt :: R.Component Props
-inputWithAutocompleteCpt = R.hooksComponentWithModule thisModule "inputWithAutocomplete" cpt
+inputWithAutocompleteCpt = here.component "inputWithAutocomplete" cpt
   where
     cpt props@{autocompleteSearch, onAutocompleteClick, onEnterPress, state: state@(state' /\ setState)} _ = do
       inputRef <- R.useRef null

src/Gargantext/Components/InputWithEnter.purs

@@ -7,8 +7,8 @@ import Reactix.DOM.HTML as H
 import Gargantext.Prelude
 import Gargantext.Utils.Reactix as R2
 
-thisModule :: String
-thisModule = "Gargantext.Components.InputWithEnter"
+here :: R2.Here
+here = R2.here "Gargantext.Components.InputWithEnter"
 
 type Props a = (
     onEnter :: Unit -> Effect Unit
@@ -25,7 +25,7 @@ inputWithEnter :: forall a. Record (Props a) -> R.Element
 inputWithEnter props = R.createElement inputWithEnterCpt props []
 
 inputWithEnterCpt :: forall a. R.Component (Props a)
-inputWithEnterCpt = R.hooksComponentWithModule thisModule "inputWithEnter" cpt
+inputWithEnterCpt = here.component "inputWithEnter" cpt
   where
     cpt props@{ onEnter, onValueChanged
               , autoFocus, className, defaultValue, placeholder } _ = do

src/Gargantext/Components/Loader.purs

@@ -10,8 +10,8 @@ import Reactix as R
 import Gargantext.Components.LoadingSpinner (loadingSpinner)
 import Gargantext.Utils.Reactix as R2
 
-thisModule :: String
-thisModule = "Gargantext.Components.Loader"
+here :: R2.Here
+here = R2.here "Gargantext.Components.Loader"
 
 type Props path loaded =
   ( path  :: path
@@ -26,7 +26,7 @@ loader path load paint =
   R.createElement loaderCpt {path,load,paint} []
 
 loaderCpt :: forall path loaded. R.Component (Props path loaded)
-loaderCpt = R.hooksComponentWithModule thisModule "loader" cpt where
+loaderCpt = here.component "loader" cpt where
   cpt {path, load, paint} _ = do
     (loaded /\ setLoaded) <- R.useState' Nothing
     R.useEffect3 path load paint $ do

src/Gargantext/Components/LoadingSpinner.purs

@@ -3,8 +3,12 @@ module Gargantext.Components.LoadingSpinner where
 import Reactix as R
 import Reactix.DOM.HTML as H
 
-thisModule :: String
-thisModule = "Gargantext.Components.LoadingSpinner"
+import Gargantext.Prelude
+
+import Gargantext.Utils.Reactix as R2
+
+here :: R2.Here
+here = R2.here "Gargantext.Components.LoadingSpinner"
 
 type Props = ()
 
@@ -12,10 +16,11 @@ loadingSpinner :: Record Props -> R.Element
 loadingSpinner props = R.createElement loadingSpinnerCpt props []
 
 loadingSpinnerCpt :: R.Component Props
-loadingSpinnerCpt = R.staticComponentWithModule thisModule "LoadingSpinner" cpt
+loadingSpinnerCpt = here.component "LoadingSpinner" cpt
   where
     -- cpt _ _ = H.i {className: "spinner fa fa-smile-o fa-spin fa-3x fa-fw"} [H.text ""]
     -- cpt _ _ = H.i {className: "fa fa-globe fa-spin fa-3x fa-fw"} [H.text ""]
 
     -- cpt _ _ = H.i {className: "fa fa-circle-o-notch fa-spin fa-3x fa-fw"} [H.text ""]
-    cpt _ _ = H.i {className: "fa fa-spinner fa-pulse fa-3x fa-fw"} [H.text ""]
+    cpt _ _ = do
+      pure $ H.i {className: "fa fa-spinner fa-pulse fa-3x fa-fw"} [H.text ""]

src/Gargantext/Components/Modal.purs

@@ -17,7 +17,7 @@ import Reactix.DOM.HTML as H
 
 import Gargantext.Utils.Reactix as R2
 
-thisModule = "Gargantext.Components.Modal"
+here = R2.here "Gargantext.Components.Modal"
 
 type Props = ( setVisible :: R.Setter Boolean )
 
@@ -25,7 +25,7 @@ modal :: R2.Component Props
 modal = R.createElement modalCpt
 
 modalCpt :: R.Component Props
-modalCpt = R.hooksComponentWithModule thisModule "modal" cpt
+modalCpt = here.component "modal" cpt
   where
     cpt {setVisible} children = do
       host <- R2.getPortalHost

src/Gargantext/Components/NgramsTable.purs

@@ -256,13 +256,13 @@ tableContainerCpt { dispatch
 
 -- NEXT
 
-type CommonProps =
-  ( afterSync         :: Unit -> Aff Unit
+type CommonProps = (
+    afterSync         :: Unit -> Aff Unit
+  , reloadForest      :: T.Cursor (T2.InitReload T.Cursor)
   , reloadRoot        :: T.Cursor T2.Reload
-  , tasks             :: R.Ref (Maybe GAT.Reductor)
   , sidePanelTriggers :: Record NT.SidePanelTriggers
   , tabNgramType      :: CTabNgramType
-  , reloadForest      :: T.Cursor (T2.InitReload T.Cursor)
+  , tasks             :: T.Cursor (Maybe GAT.Reductor)
   , withAutoUpdate    :: Boolean
   )
 
@@ -281,11 +281,11 @@ loadedNgramsTable = R.createElement loadedNgramsTableCpt
 loadedNgramsTableCpt :: R.Component Props
 loadedNgramsTableCpt = here.component "loadedNgramsTable" cpt where
   cpt props@{ afterSync
-            , reloadRoot
-            , tasks
             , cacheState
             , mTotalRows
             , path: path@(path'@{ listIds, nodeId, params, searchQuery, scoreType, termListFilter, termSizeFilter } /\ setPath)
+            , reloadForest
+            , reloadRoot
             , sidePanelTriggers
             , state: (state@{ ngramsChildren
                             , ngramsLocalPatch
@@ -293,7 +293,7 @@ loadedNgramsTableCpt = here.component "loadedNgramsTable" cpt where
                             , ngramsSelection
                             , ngramsVersion } /\ setState)
             , tabNgramType
-            , reloadForest
+            , tasks
             , versioned: Versioned { data: initTable }
             , withAutoUpdate } _ = do
     pure $ R.fragment $
@@ -540,13 +540,13 @@ mainNgramsTableCpt = here.component "mainNgramsTable" cpt
       case cacheState of
         (NT.CacheOn /\ _) -> do
           let render versioned = mainNgramsTablePaint { afterSync
-                                                      , reloadRoot
-                                                      , tasks
                                                       , cacheState: fst cacheState
                                                       , path: fst path
+                                                      , reloadForest
+                                                      , reloadRoot
                                                       , sidePanelTriggers
                                                       , tabNgramType
-                                                      , reloadForest
+                                                      , tasks
                                                       , versioned
                                                       , withAutoUpdate } []
           useLoaderWithCacheAPI {
@@ -559,13 +559,13 @@ mainNgramsTableCpt = here.component "mainNgramsTable" cpt
         (NT.CacheOff /\ _) -> do
           -- path <- R.useState' path
           let render versionedWithCount = mainNgramsTablePaintNoCache { afterSync
-                                                                      , reloadRoot
-                                                                      , tasks
                                                                       , cacheState: fst cacheState
                                                                       , path
+                                                                      , reloadForest
+                                                                      , reloadRoot
                                                                       , sidePanelTriggers
                                                                       , tabNgramType
-                                                                      , reloadForest
+                                                                      , tasks
                                                                       , versionedWithCount
                                                                       , withAutoUpdate } []
           useLoader (fst path) loader render
@@ -629,27 +629,27 @@ mainNgramsTablePaintCpt :: R.Component MainNgramsTablePaintProps
 mainNgramsTablePaintCpt = here.component "mainNgramsTablePaint" cpt
   where
     cpt props@{ afterSync
-              , reloadRoot
-              , tasks
               , cacheState
               , path
+              , reloadForest
+              , reloadRoot
               , sidePanelTriggers
               , tabNgramType
-              , reloadForest
+              , tasks
               , versioned
               , withAutoUpdate } _ = do
       path' <- R.useState' path
       state <- R.useState' $ initialState versioned
       pure $ loadedNgramsTable { afterSync
-                               , reloadRoot
-                               , tasks
                                , cacheState
                                , mTotalRows: Nothing
                                , path: path'
+                               , reloadForest
+                               , reloadRoot
                                , sidePanelTriggers
                                , state
                                , tabNgramType
-                               , reloadForest
+                               , tasks
                                , versioned
                                , withAutoUpdate
                                } []
@@ -668,13 +668,13 @@ mainNgramsTablePaintNoCacheCpt :: R.Component MainNgramsTablePaintNoCacheProps
 mainNgramsTablePaintNoCacheCpt = here.component "mainNgramsTablePaintNoCache" cpt
   where
     cpt props@{ afterSync
-              , reloadRoot
-              , tasks
               , cacheState
               , path
+              , reloadForest
+              , reloadRoot
               , sidePanelTriggers
               , tabNgramType
-              , reloadForest
+              , tasks
               , versionedWithCount
               , withAutoUpdate } _ = do
       let count /\ versioned = toVersioned versionedWithCount
@@ -683,15 +683,15 @@ mainNgramsTablePaintNoCacheCpt = here.component "mainNgramsTablePaintNoCache" cp
 
       pure $ loadedNgramsTable {
         afterSync
-      , reloadRoot
-      , tasks
       , cacheState
       , mTotalRows: Just count
       , path: path
+      , reloadForest
+      , reloadRoot
       , sidePanelTriggers
       , state
       , tabNgramType
-      , reloadForest
+      , tasks
       , versioned
       , withAutoUpdate
       } []

src/Gargantext/Components/NgramsTable/Components.purs

@@ -23,7 +23,7 @@ import Gargantext.Components.Table as Tbl
 import Gargantext.Types as T
 import Gargantext.Utils.Reactix as R2
 
-thisModule = "Gargantext.Components.NgramsTable.Components"
+here = R2.here "Gargantext.Components.NgramsTable.Components"
 
 type SearchInputProps =
   ( key :: String  -- to prevent refreshing & losing input
@@ -35,7 +35,7 @@ searchInput :: Record SearchInputProps -> R.Element
 searchInput props = R.createElement searchInputCpt props []
 
 searchInputCpt :: R.Component SearchInputProps
-searchInputCpt = R.hooksComponentWithModule thisModule "searchInput" cpt
+searchInputCpt = here.component "searchInput" cpt
   where
     cpt { onSearch, searchQuery } _ = 
       pure $ R2.row [
@@ -78,7 +78,7 @@ selectionCheckbox :: Record SelectionCheckboxProps -> R.Element
 selectionCheckbox props = R.createElement selectionCheckboxCpt props []
 
 selectionCheckboxCpt :: R.Component SelectionCheckboxProps
-selectionCheckboxCpt = R.hooksComponentWithModule thisModule "selectionCheckbox" cpt
+selectionCheckboxCpt = here.component "selectionCheckbox" cpt
   where
     cpt { allNgramsSelected, dispatch, ngramsSelection } _ = do
       ref <- R.useRef null
@@ -113,7 +113,7 @@ renderNgramsTree :: Record RenderNgramsTree -> R.Element
 renderNgramsTree p = R.createElement renderNgramsTreeCpt p []
 
 renderNgramsTreeCpt :: R.Component RenderNgramsTree
-renderNgramsTreeCpt = R.hooksComponentWithModule thisModule "renderNgramsTree" cpt
+renderNgramsTreeCpt = here.component "renderNgramsTree" cpt
   where
     cpt { ngramsTable, ngrams, ngramsStyle, ngramsClick, ngramsEdit} _ =
       pure $ H.ul {} [
@@ -159,7 +159,7 @@ tree :: Record TreeProps -> R.Element
 tree p = R.createElement treeCpt p []
 
 treeCpt :: R.Component TreeProps
-treeCpt = R.hooksComponentWithModule thisModule "tree" cpt
+treeCpt = here.component "tree" cpt
   where
     cpt params@{ ngramsClick, ngramsDepth, ngramsEdit, ngramsStyle, ngramsTable } _ =
       pure $
@@ -210,7 +210,7 @@ renderNgramsItem :: R2.Component RenderNgramsItem
 renderNgramsItem = R.createElement renderNgramsItemCpt
 
 renderNgramsItemCpt :: R.Component RenderNgramsItem
-renderNgramsItemCpt = R.hooksComponentWithModule thisModule "renderNgramsItem" cpt
+renderNgramsItemCpt = here.component "renderNgramsItem" cpt
   where
     cpt { dispatch
         , ngrams

src/Gargantext/Components/NgramsTable/Core.purs

@@ -1177,7 +1177,7 @@ chartsAfterSync :: forall props discard.
   , tabType :: TabType
   | props
   }
-  -> R.Ref (Maybe GAT.Reductor)
+  -> T.Cursor (Maybe GAT.Reductor)
   -> Int
   -> T.Cursor (T2.InitReload T.Cursor)
   -> discard
@@ -1186,10 +1186,10 @@ chartsAfterSync path' tasks nodeId reloadForest _ = do
   task <- postNgramsChartsAsync path'
   liftEffect $ do
     log2 "[chartsAfterSync] Synchronize task" task
-    case R.readRef tasks of
+    mT <- T.read tasks
+    case mT of
       Nothing -> log "[chartsAfterSync] tasks is Nothing"
-      Just tasks' ->
-        snd tasks' (GAT.Insert nodeId task) *> T2.reload reloadForest
+      Just tasks' -> snd tasks' (GAT.Insert nodeId task) *> T2.reload reloadForest
 
 postNgramsChartsAsync :: forall s. CoreParams s -> Aff AsyncTaskWithType
 postNgramsChartsAsync { listIds, nodeId, session, tabType } = do

src/Gargantext/Components/Nodes/Annuaire/Tabs.purs

@@ -59,7 +59,7 @@ type TabsProps =
   , reloadRoot        :: T.Cursor T2.Reload
   , session           :: Session
   , sidePanelTriggers :: Record LTypes.SidePanelTriggers
-  , tasks             :: R.Ref (Maybe GAT.Reductor)
+  , tasks             :: T.Cursor (Maybe GAT.Reductor)
   )
 
 tabs :: R2.Leaf TabsProps
@@ -134,5 +134,5 @@ type NTCommon =
   , reloadRoot        :: T.Cursor T2.Reload
   , session           :: Session
   , sidePanelTriggers :: Record LTypes.SidePanelTriggers
-  , tasks             :: R.Ref (Maybe GAT.Reductor)
+  , tasks             :: T.Cursor (Maybe GAT.Reductor)
   )

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

@@ -157,7 +157,7 @@ type LayoutProps =
   , reloadForest :: T.Cursor (T2.InitReload T.Cursor)
   , reloadRoot   :: T.Cursor T2.Reload
   , session      :: Session
-  , tasks        :: R.Ref (Maybe GAT.Reductor)
+  , tasks        :: T.Cursor (Maybe GAT.Reductor)
   )
 
 type KeyLayoutProps = (

src/Gargantext/Components/Nodes/Annuaire/User/Contact.purs

@@ -130,7 +130,7 @@ listElement = H.li { className: "list-group-item justify-content-between" }
 type BasicProps =
   ( frontends :: Frontends
   , nodeId    :: Int
-  , tasks     :: R.Ref (Maybe GAT.Reductor)
+  , tasks     :: T.Cursor (Maybe GAT.Reductor)
   )
 
 type ReloadProps =

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

@@ -49,15 +49,15 @@ modeTabType' Books = CTabAuthors
 modeTabType' Communication = CTabAuthors
 
 type TabsProps = (
-    reloadRoot        :: T.Cursor T2.Reload
-  , tasks             :: R.Ref (Maybe GAT.Reductor)
-  , cacheState        :: R.State LTypes.CacheState
+    cacheState        :: R.State LTypes.CacheState
   , contactData       :: ContactData'
   , frontends         :: Frontends
   , nodeId            :: Int
+  , reloadForest      :: T.Cursor (T2.InitReload T.Cursor)
+  , reloadRoot        :: T.Cursor T2.Reload
   , session           :: Session
   , sidePanelTriggers :: Record LTypes.SidePanelTriggers
-  , reloadForest      :: T.Cursor (T2.InitReload T.Cursor)
+  , tasks             :: T.Cursor (Maybe GAT.Reductor)
   )
 
 tabs :: Record TabsProps -> R.Element
@@ -131,15 +131,15 @@ tabsCpt = here.component "tabs" cpt
 
 
 type NgramsViewTabsProps = (
-    reloadRoot        :: T.Cursor T2.Reload
-  , tasks             :: R.Ref (Maybe GAT.Reductor)
-  , cacheState        :: R.State LTypes.CacheState
+    cacheState        :: R.State LTypes.CacheState
   , defaultListId     :: Int
   , mode              :: Mode
   , nodeId            :: Int
+  , reloadForest      :: T.Cursor (T2.InitReload T.Cursor)
+  , reloadRoot        :: T.Cursor T2.Reload
   , session           :: Session
   , sidePanelTriggers :: Record LTypes.SidePanelTriggers
-  , reloadForest      :: T.Cursor (T2.InitReload T.Cursor)
+  , tasks             :: T.Cursor (Maybe GAT.Reductor)
   )
 
 ngramsView :: R2.Component NgramsViewTabsProps

src/Gargantext/Components/Nodes/Corpus/Chart/Common.purs

@@ -15,8 +15,8 @@ import Gargantext.Sessions (Session)
 import Gargantext.Utils.CacheAPI as GUC
 import Gargantext.Utils.Reactix as R2
 
-thisModule :: String
-thisModule = "Gargantext.Components.Nodes.Corpus.Chart.Common"
+here :: R2.Here
+here = R2.here "Gargantext.Components.Nodes.Corpus.Chart.Common"
 
 type MetricsLoadViewProps a = (
     getMetrics :: Session -> ReloadPath -> Aff a
@@ -31,7 +31,7 @@ metricsLoadView :: forall a. Record (MetricsLoadViewProps a) -> R.Element
 metricsLoadView p = R.createElement metricsLoadViewCpt p []
 
 metricsLoadViewCpt :: forall a. R.Component (MetricsLoadViewProps a)
-metricsLoadViewCpt = R.hooksComponentWithModule thisModule "metricsLoadView" cpt
+metricsLoadViewCpt = here.component "metricsLoadView" cpt
   where
     cpt { getMetrics, loaded, path, reload, session } _ = do
       useLoader (fst reload /\ path) (getMetrics session) $ \l ->
@@ -51,7 +51,7 @@ metricsWithCacheLoadView p = R.createElement metricsWithCacheLoadViewCpt p []
 
 metricsWithCacheLoadViewCpt :: forall res ret. DecodeJson res =>
                                R.Component (MetricsWithCacheLoadViewProps res ret)
-metricsWithCacheLoadViewCpt = R.hooksComponentWithModule thisModule "metricsWithCacheLoadView" cpt
+metricsWithCacheLoadViewCpt = here.component "metricsWithCacheLoadView" cpt
   where
     cpt { getMetricsHash, handleResponse, loaded, mkRequest, path, reload, session } _ = do
       useLoaderWithCacheAPI { cacheEndpoint: (getMetricsHash session)

src/Gargantext/Components/Nodes/Corpus/Chart/Histo.purs

@@ -21,9 +21,10 @@ import Gargantext.Routes (SessionRoute(..))
 import Gargantext.Sessions (Session, get)
 import Gargantext.Types (ChartType(..))
 import Gargantext.Utils.CacheAPI as GUC
+import Gargantext.Utils.Reactix as R2
 
-thisModule :: String
-thisModule = "Gargantext.Components.Nodes.Corpus.Chart.Histo"
+here :: R2.Here
+here = R2.here "Gargantext.Components.Nodes.Corpus.Chart.Histo"
 
 newtype ChartMetrics = ChartMetrics {
     "data" :: HistoMetrics
@@ -83,7 +84,7 @@ histo :: Record Props -> R.Element
 histo props = R.createElement histoCpt props []
 
 histoCpt :: R.Component Props
-histoCpt = R.hooksComponentWithModule thisModule "histo" cpt
+histoCpt = here.component "histo" cpt
   where
     cpt { path, session } _ = do
       reload <- R.useState' 0

src/Gargantext/Components/Nodes/Corpus/Chart/Metrics.purs

@@ -29,7 +29,7 @@ import Gargantext.Types (ChartType(..), TabType, TermList(..))
 import Gargantext.Utils.CacheAPI as GUC
 import Gargantext.Utils.Reactix as R2
 
-thisModule = "Gargantext.Components.Nodes.Corpus.Chart.Metrics"
+here = R2.here "Gargantext.Components.Nodes.Corpus.Chart.Metrics"
 
 newtype Metric = Metric
   { label :: String
@@ -118,7 +118,7 @@ metrics :: Record Props -> R.Element
 metrics props = R.createElement metricsCpt props []
 
 metricsCpt :: R.Component Props
-metricsCpt = R.hooksComponentWithModule thisModule "etrics" cpt
+metricsCpt = here.component "etrics" cpt
   where
     cpt {path, session} _ = do
       reload <- R.useState' 0

src/Gargantext/Components/Nodes/Corpus/Chart/Pie.purs

@@ -28,8 +28,8 @@ import Gargantext.Types (ChartType(..), TabType)
 import Gargantext.Utils.CacheAPI as GUC
 import Gargantext.Utils.Reactix as R2
 
-thisModule :: String
-thisModule = "Gargantext.Components.Nodes.Corpus.Chart.Pie"
+here :: R2.Here
+here = R2.here "Gargantext.Components.Nodes.Corpus.Chart.Pie"
 
 newtype ChartMetrics = ChartMetrics {
     "data" :: HistoMetrics
@@ -105,7 +105,7 @@ pie :: Record Props -> R.Element
 pie props = R.createElement pieCpt props []
 
 pieCpt :: R.Component Props
-pieCpt = R.hooksComponentWithModule thisModule "pie" cpt
+pieCpt = here.component "pie" cpt
   where
     cpt { path, session } _ = do
       reload <- R.useState' 0
@@ -133,7 +133,7 @@ bar :: Record Props -> R.Element
 bar props = R.createElement barCpt props []
 
 barCpt :: R.Component Props
-barCpt = R.hooksComponentWithModule thisModule "bar" cpt
+barCpt = here.component "bar" cpt
   where
     cpt {path, session} _ = do
       reload <- R.useState' 0

src/Gargantext/Components/Nodes/Corpus/Chart/Tree.purs

@@ -24,7 +24,7 @@ import Gargantext.Types (ChartType(..), TabType)
 import Gargantext.Utils.CacheAPI as GUC
 import Gargantext.Utils.Reactix as R2
 
-thisModule = "Gargantext.Components.Nodes.Corpus.Chart.Tree"
+here = R2.here "Gargantext.Components.Nodes.Corpus.Chart.Tree"
 
 newtype Metrics = Metrics {
     "data" :: Array TreeNode
@@ -77,7 +77,7 @@ tree :: Record Props -> R.Element
 tree props = R.createElement treeCpt props []
 
 treeCpt :: R.Component Props
-treeCpt = R.hooksComponentWithModule thisModule "tree" cpt
+treeCpt = here.component "tree" cpt
   where
     cpt {path, session} _ = do
       reload <- R.useState' 0

src/Gargantext/Components/Nodes/Corpus/Chart/Utils.purs

@@ -17,7 +17,7 @@ import Gargantext.Types as T
 import Gargantext.Utils.Reactix as R2
 import Gargantext.Utils.Reload as GUR
 
-thisModule = "Gargantext.Components.Nodes.Corpus.Chart.Utils"
+here = R2.here "Gargantext.Components.Nodes.Corpus.Chart.Utils"
 
 reloadButtonWrap :: GUR.ReloadS -> R.Element -> R.Element
 reloadButtonWrap setReload el = H.div {} [
@@ -53,7 +53,7 @@ chartUpdateButton :: Record ChartUpdateButtonProps -> R.Element
 chartUpdateButton p = R.createElement chartUpdateButtonCpt p []
 
 chartUpdateButtonCpt :: R.Component ChartUpdateButtonProps
-chartUpdateButtonCpt = R.hooksComponentWithModule thisModule "chartUpdateButton" cpt
+chartUpdateButtonCpt = here.component "chartUpdateButton" cpt
   where
     cpt { chartType
         , path: { corpusId, listId, tabType }

src/Gargantext/Components/Nodes/Corpus/Graph/Tabs.purs

@@ -13,7 +13,7 @@ import Gargantext.Ends (Frontends)
 import Gargantext.Sessions (Session)
 import Gargantext.Utils.Reactix as R2
 
-thisModule = "Gargantext.Components.Nodes.Corpus.Graph.Tabs"
+here = R2.here "Gargantext.Components.Nodes.Corpus.Graph.Tabs"
 
 type Props =
   ( frontends :: Frontends
@@ -27,7 +27,7 @@ tabs props = R.createElement tabsCpt props []
 
 -- TODO no need for Children here
 tabsCpt :: R.Component Props
-tabsCpt = R.hooksComponentWithModule thisModule "tabs" cpt
+tabsCpt = here.component "tabs" cpt
   where
     cpt {frontends, query, session, sides} _ = do
       active <- R.useState' 0

src/Gargantext/Components/Nodes/Lists.purs

@@ -8,6 +8,7 @@ import Effect.Aff (launchAff_)
 import Reactix as R
 import Reactix.DOM.HTML as H
 import Record as Record
+import Toestand as T
 ------------------------------------------------------------------------
 import Gargantext.AsyncTasks as GAT
 import Gargantext.Components.Forest as Forest
@@ -24,12 +25,13 @@ import Gargantext.Sessions (Session, sessionId, getCacheState, setCacheState)
 import Gargantext.Types as GT
 import Gargantext.Utils.Reactix as R2
 import Gargantext.Utils.Reload as GUR
+import Gargantext.Utils.Toestand as T2
 
-thisModule :: String
-thisModule = "Gargantext.Components.Nodes.Lists"
+here :: R2.Here
+here = R2.here "Gargantext.Components.Nodes.Lists"
 ------------------------------------------------------------------------
 type ListsWithForest = (
-    forestProps :: Record Forest.ForestLayoutProps
+    forestProps :: Record Forest.LayoutProps
   , listsProps  :: Record CommonProps
   )
 
@@ -37,7 +39,7 @@ listsWithForest :: R2.Component ListsWithForest
 listsWithForest = R.createElement listsWithForestCpt
 
 listsWithForestCpt :: R.Component ListsWithForest
-listsWithForestCpt = R.hooksComponentWithModule thisModule "listsWithForest" cpt
+listsWithForestCpt = here.component "listsWithForest" cpt
   where
     cpt { forestProps
         , listsProps: listsProps@{ session } } _ = do
@@ -60,7 +62,7 @@ topBar :: R2.Component TopBarProps
 topBar = R.createElement topBarCpt
 
 topBarCpt :: R.Component TopBarProps
-topBarCpt = R.hooksComponentWithModule thisModule "topBar" cpt
+topBarCpt = here.component "topBar" cpt
   where
     cpt { controls } _ = do
       -- empty for now because the button is moved to the side panel
@@ -73,12 +75,12 @@ topBarCpt = R.hooksComponentWithModule thisModule "topBar" cpt
 --------------------------------------------------------
 
 type CommonProps = (
-    reloadRoot     :: GUR.ReloadS
-  , tasks :: R.Ref (Maybe GAT.Reductor)
-  , nodeId        :: Int
+    nodeId        :: Int
+  , reloadForest  :: T.Cursor (T2.InitReload T.Cursor)
+  , reloadRoot    :: T.Cursor T2.Reload
   , session       :: Session
   , sessionUpdate :: Session -> Effect Unit
-  , reloadForest :: GUR.ReloadWithInitializeRef
+  , tasks         :: T.Cursor (Maybe GAT.Reductor)
   )
 
 type Props = (
@@ -95,7 +97,7 @@ listsLayout :: R2.Component Props
 listsLayout = R.createElement listsLayoutCpt
 
 listsLayoutCpt :: R.Component Props
-listsLayoutCpt = R.hooksComponentWithModule thisModule "listsLayout" cpt
+listsLayoutCpt = here.component "listsLayout" cpt
   where
     cpt path@{ nodeId, session } _ = do
       let sid = sessionId session
@@ -111,15 +113,15 @@ listsLayoutWithKey :: Record KeyProps -> R.Element
 listsLayoutWithKey props = R.createElement listsLayoutWithKeyCpt props []
 
 listsLayoutWithKeyCpt :: R.Component KeyProps
-listsLayoutWithKeyCpt = R.hooksComponentWithModule thisModule "listsLayoutWithKey" cpt
+listsLayoutWithKeyCpt = here.component "listsLayoutWithKey" cpt
   where
-    cpt { reloadRoot
-        , tasks
-        , controls
+    cpt { controls
         , nodeId
+        , reloadForest
+        , reloadRoot
         , session
         , sessionUpdate
-        , reloadForest } _ = do
+        , tasks } _ = do
       let path = { nodeId, session }
 
       cacheState <- R.useState' $ getCacheState CacheOn session nodeId
@@ -140,15 +142,15 @@ listsLayoutWithKeyCpt = R.hooksComponentWithModule thisModule "listsLayoutWithKe
               , title: "Corpus " <> name
               , user: authors }
           , Tabs.tabs {
-               reloadRoot
-             , tasks
-             , cacheState
+               cacheState
              , corpusData
              , corpusId
              , key: "listsLayoutWithKey-tabs-" <> (show $ fst cacheState)
+             , reloadForest
+             , reloadRoot
              , session
              , sidePanelTriggers: controls.triggers
-             , reloadForest
+             , tasks
              }
           ]
       where
@@ -166,7 +168,7 @@ sidePanel :: R2.Component SidePanelProps
 sidePanel = R.createElement sidePanelCpt
 
 sidePanelCpt :: R.Component SidePanelProps
-sidePanelCpt = R.hooksComponentWithModule thisModule "sidePanel" cpt
+sidePanelCpt = here.component "sidePanel" cpt
   where
     cpt { controls: { triggers: { toggleSidePanel
                                 , triggerSidePanel
@@ -210,7 +212,7 @@ sidePanelDocView :: R2.Component SidePanelDocView
 sidePanelDocView = R.createElement sidePanelDocViewCpt
 
 sidePanelDocViewCpt :: R.Component SidePanelDocView
-sidePanelDocViewCpt = R.hooksComponentWithModule thisModule "sidePanelDocView" cpt
+sidePanelDocViewCpt = here.component "sidePanelDocView" cpt
   where
     cpt { session } _ = do
       -- pure $ H.h4 {} [ H.text txt ]

src/Gargantext/Components/Nodes/Lists/Tabs.purs

@@ -34,14 +34,14 @@ here :: R2.Here
 here = R2.here "Gargantext.Components.Nodes.Lists.Tabs"
 
 type Props = (
-    reloadRoot        :: T.Cursor T2.Reload
-  , tasks             :: R.Ref (Maybe GAT.Reductor)
-  , cacheState        :: R.State CacheState
+    cacheState        :: R.State CacheState
   , corpusData        :: CorpusData
   , corpusId          :: Int
+  , reloadForest      :: T.Cursor (T2.InitReload T.Cursor)
+  , reloadRoot        :: T.Cursor T2.Reload
   , session           :: Session
   , sidePanelTriggers :: Record SidePanelTriggers
-  , reloadForest      :: T.Cursor (T2.InitReload T.Cursor)
+  , tasks             :: T.Cursor (Maybe GAT.Reductor)
   )
 
 type PropsWithKey = ( key :: String | Props )

src/Gargantext/Components/Nodes/Lists/Types.purs

@@ -13,8 +13,8 @@ import Gargantext.Prelude
 import Gargantext.Types (ListId, NodeID)
 import Gargantext.Utils.Reactix as R2
 
-thisModule :: String
-thisModule = "Gargantext.Components.Nodes.Lists.Types"
+here :: R2.Here
+here = R2.here "Gargantext.Components.Nodes.Lists.Types"
 
 data CacheState = CacheOn | CacheOff
 

src/Gargantext/Components/Nodes/Texts.purs

@@ -38,7 +38,7 @@ here = R2.here "Gargantext.Components.Nodes.Texts"
 
 --------------------------------------------------------
 type TextsWithForest a =
-  ( forestProps :: Record (Forest.ForestLayoutProps a)
+  ( forestProps :: Record (Forest.LayoutProps a)
   , textsProps  :: Record CommonProps
   )
 
@@ -64,7 +64,7 @@ topBar :: R2.Component TopBarProps
 topBar = R.createElement topBarCpt
 
 topBarCpt :: R.Component TopBarProps
-topBarCpt = R.hooksComponentWithModule thisModule "topBar" cpt
+topBarCpt = here.component "topBar" cpt
   where
     cpt { controls } _ = do
       -- empty for now because the button is moved to the side panel
@@ -158,7 +158,7 @@ tabs :: Record TabsProps -> R.Element
 tabs props = R.createElement tabsCpt props []
 
 tabsCpt :: R.Component TabsProps
-tabsCpt = R.hooksComponentWithModule thisModule "tabs" cpt
+tabsCpt = here.component "tabs" cpt
   where
     cpt { cacheState, corpusId, corpusData, frontends, session, sidePanelTriggers } _ = do
       (selected /\ setSelected) <- R.useState' 0
@@ -209,7 +209,7 @@ docView :: forall a. R2.Component (DocViewProps a)
 docView = R.createElement docViewCpt
 
 docViewCpt :: forall a. R.Component (DocViewProps a)
-docViewCpt = R.hooksComponentWithModule thisModule "docView" cpt
+docViewCpt = here.component "docView" cpt
   where
     cpt props _children = do
       pure $ DT.docViewLayout $ docViewLayoutRec props
@@ -329,7 +329,7 @@ sidePanel :: R2.Component SidePanelProps
 sidePanel = R.createElement sidePanelCpt
 
 sidePanelCpt :: R.Component SidePanelProps
-sidePanelCpt = R.hooksComponentWithModule thisModule "sidePanel" cpt
+sidePanelCpt = here.component "sidePanel" cpt
   where
     cpt { controls: { triggers: { currentDocIdRef
                                 , toggleSidePanel
@@ -401,7 +401,7 @@ sidePanelDocView :: R2.Component SidePanelDocView
 sidePanelDocView = R.createElement sidePanelDocViewCpt
 
 sidePanelDocViewCpt :: R.Component SidePanelDocView
-sidePanelDocViewCpt = R.hooksComponentWithModule thisModule "sidePanelDocView" cpt
+sidePanelDocViewCpt = here.component "sidePanelDocView" cpt
   where
     cpt { listId: Nothing } _ = do
       pure $ H.div {} []

src/Gargantext/Components/Nodes/Texts/SidePanelToggleButton.purs

@@ -10,8 +10,8 @@ import Reactix.DOM.HTML as H
 import Gargantext.Components.Nodes.Texts.Types
 import Gargantext.Utils.Reactix as R2
 
-thisModule :: String
-thisModule = "Gargantext.Components.Nodes.Texts.SidePanelToggleButton"
+here :: R2.Here
+here = R2.here "Gargantext.Components.Nodes.Texts.SidePanelToggleButton"
 
 type Props = ( state :: R.State SidePanelState )
 
@@ -19,7 +19,7 @@ sidePanelToggleButton :: R2.Component Props
 sidePanelToggleButton = R.createElement sidePanelToggleButtonCpt
 
 sidePanelToggleButtonCpt :: R.Component Props
-sidePanelToggleButtonCpt = R.hooksComponentWithModule thisModule "sidePanelToggleButton" cpt
+sidePanelToggleButtonCpt = here.component "sidePanelToggleButton" cpt
   where
     cpt { state } _ = do
       let (open /\ setOpen) = state

src/Gargantext/Components/RangeSlider.purs

@@ -28,7 +28,7 @@ import Gargantext.Utils.Math (roundToMultiple)
 import Gargantext.Utils.Range as Range
 import Gargantext.Utils.Reactix as R2
 
-thisModule = "Gargantext.Components.RangeSlider"
+here = R2.here "Gargantext.Components.RangeSlider"
 -- data Axis = X | Y
 
 type Bounds = Range.NumberRange
@@ -55,7 +55,7 @@ data Knob = MinKnob | MaxKnob
 data RangeUpdate = SetMin Number | SetMax Number
 
 rangeSliderCpt :: R.Component Props
-rangeSliderCpt = R.hooksComponentWithModule thisModule "rangeSlider" cpt
+rangeSliderCpt = here.component "rangeSlider" cpt
   where
     cpt props _ = do
       -- rounding precision (i.e. how many decimal digits are in epsilon)

src/Gargantext/Components/Router.purs

@@ -33,10 +33,10 @@ import Gargantext.Utils.Toestand as T2
 here :: R2.Here
 here = R2.here "Gargantext.Components.Router"
 
-type Props =
-  ( cursors :: App.Cursors
+type Props = (
+    cursors :: App.Cursors
+  , tasks   :: T.Cursor (Maybe GAT.Reductor)
   , views   :: App.Views
-  , tasks   :: R.Ref (Maybe GAT.Reductor)
   )
 
 router :: R2.Leaf Props

src/Gargantext/Components/SimpleLayout.purs

@@ -2,6 +2,7 @@ module Gargantext.Components.SimpleLayout where
 
 import Reactix as R
 import Reactix.DOM.HTML as H
+import Toestand as T
 
 import Gargantext.Prelude
 
@@ -10,19 +11,19 @@ import Gargantext.License (license)
 import Gargantext.Types as GT
 import Gargantext.Utils.Reactix as R2
 
-thisModule :: String
-thisModule = "Gargantext.Components.SimpleLayout"
+here :: R2.Here
+here = R2.here "Gargantext.Components.SimpleLayout"
 
 -- Simple layout does not accommodate the tree
 type SimpleLayoutProps = (
-  handed :: R.State GT.Handed
+  handed :: T.Cursor GT.Handed
   )
 
 simpleLayout :: R2.Component SimpleLayoutProps
 simpleLayout = R.createElement simpleLayoutCpt
 
 simpleLayoutCpt :: R.Component SimpleLayoutProps
-simpleLayoutCpt = R.hooksComponentWithModule thisModule "simpleLayout" cpt
+simpleLayoutCpt = here.component "simpleLayout" cpt
   where
     cpt { handed } children = do
       pure $ H.div { className: "simple-layout" } (

src/Gargantext/Components/Table.purs

@@ -17,8 +17,8 @@ import Gargantext.Components.Search (SearchType(..))
 import Gargantext.Utils.Reactix as R2
 import Gargantext.Utils.Reactix (effectLink)
 
-thisModule :: String
-thisModule = "Gargantext.Components.Table"
+here :: R2.Here
+here = R2.here "Gargantext.Components.Table"
 
 type Page = Int
 
@@ -59,7 +59,7 @@ initialParams = stateParams {page: 1, pageSize: PS10, orderBy: Nothing, searchTy
 tableHeaderLayout :: Record TableHeaderLayoutProps -> R.Element
 tableHeaderLayout props = R.createElement tableHeaderLayoutCpt props []
 tableHeaderLayoutCpt :: R.Component TableHeaderLayoutProps
-tableHeaderLayoutCpt = R.hooksComponentWithModule thisModule "tableHeaderLayout" cpt
+tableHeaderLayoutCpt = here.component "tableHeaderLayout" cpt
   where
     cpt { afterCacheStateChange, cacheState, date, desc, query, title, user } _ =
       pure $ R.fragment
@@ -115,7 +115,7 @@ tableHeaderLayoutCpt = R.hooksComponentWithModule thisModule "tableHeaderLayout"
 table :: Record Props -> R.Element
 table props = R.createElement tableCpt props []
 tableCpt :: R.Component Props
-tableCpt = R.hooksComponentWithModule thisModule "table" cpt
+tableCpt = here.component "table" cpt
   where
     cpt {container, syncResetButton, colNames, wrapColElts, totalRecords, rows, params} _ = do
       let
@@ -194,7 +194,7 @@ sizeDD :: Record SizeDDProps -> R.Element
 sizeDD p = R.createElement sizeDDCpt p []
 
 sizeDDCpt :: R.Component SizeDDProps
-sizeDDCpt = R.hooksComponentWithModule thisModule "sizeDD" cpt
+sizeDDCpt = here.component "sizeDD" cpt
   where
     cpt {params: params /\ setParams} _ = do
       pure $ H.span {} [

src/Gargantext/Components/Themes.purs

@@ -12,8 +12,8 @@ import Reactix.DOM.HTML as H
 import Gargantext.Prelude
 import Gargantext.Utils.Reactix as R2
 
-thisModule :: String
-thisModule = "Gargantext.Components.Themes"
+here :: R2.Here
+here = R2.here "Gargantext.Components.Themes"
 
 stylesheetElId :: String
 stylesheetElId = "bootstrap-css"
@@ -57,7 +57,7 @@ themeSwitcher :: R2.Component ThemeSwitcherProps
 themeSwitcher = R.createElement themeSwitcherCpt
 
 themeSwitcherCpt :: R.Component ThemeSwitcherProps
-themeSwitcherCpt = R.hooksComponentWithModule thisModule "themeSwitcher" cpt
+themeSwitcherCpt = here.component "themeSwitcher" cpt
   where
     cpt { theme, themes } _ = do
       currentTheme <- R.useState' theme

src/Gargantext/Components/TopBar.purs

@@ -6,47 +6,52 @@ import Data.Tuple (fst)
 import Data.Tuple.Nested ((/\))
 import Reactix as R
 import Reactix.DOM.HTML as H
+import Toestand as T
 
 import Gargantext.Prelude
 
 import Gargantext.Components.Themes (themeSwitcher, defaultTheme, allThemes)
-import Gargantext.Types (Handed(..))
+import Gargantext.Types (Handed(..), reverseHanded)
 import Gargantext.Utils.Reactix as R2
 
-thisModule :: String
-thisModule = "Gargantext.Components.TopBar"
+here :: R2.Here
+here = R2.here "Gargantext.Components.TopBar"
 
-type TopBarProps = (handed :: R.State Handed)
+type TopBarProps = (
+  handed :: T.Cursor Handed
+  )
 
 topBar :: R2.Component TopBarProps
 topBar = R.createElement topBarCpt
 
 topBarCpt :: R.Component TopBarProps
-topBarCpt = R.hooksComponentWithModule thisModule "topBar" cpt
+topBarCpt = here.component "topBar" cpt
   where
     cpt { handed } _children = do
-      pure $ H.div { id: "dafixedtop"
+      handed' <- T.useLive T.unequal handed
+
+      pure $ H.div { className: "navbar navbar-expand-lg navbar-dark bg-dark fixed-top"
+                   , id: "dafixedtop"
                    , role: "navigation"
-                   , className: "navbar navbar-expand-lg navbar-dark bg-dark fixed-top"
-                   } $ sortHanded [
-                     -- NOTE: first (and only) entry in the sorted array should have the "ml-auto class"
-                     -- https://stackoverflow.com/questions/19733447/bootstrap-navbar-with-left-center-or-right-aligned-items
-                     -- In practice: only apply "ml-auto" to the last element of this list, if handed == LeftHanded
-                     logo
-                   , H.ul { className: "navbar-nav " <> if fst handed == LeftHanded then "ml-auto" else "" } $ sortHanded [
-                       divDropdownLeft {} []
-                     , handButton handed
-                     , smiley
-                     , H.li { className: "nav-item" } [ themeSwitcher { theme: defaultTheme
-                                                                      , themes: allThemes } [] ]
-                     ]
-                   ]
+                   } $ reverseHanded [
+                      -- NOTE: first (and only) entry in the sorted array should have the "ml-auto class"
+                      -- https://stackoverflow.com/questions/19733447/bootstrap-navbar-with-left-center-or-right-aligned-items
+                      -- In practice: only apply "ml-auto" to the last element of this list, if handed == LeftHanded
+                      logo
+                   , H.ul { className: "navbar-nav " <> if handed' == LeftHanded then "ml-auto" else "" } $ reverseHanded [
+                        divDropdownLeft {} []
+                      , handButton handed'
+                      , smiley
+                      , H.li { className: "nav-item" } [ themeSwitcher { theme: defaultTheme
+                                                                       , themes: allThemes } [] ]
+                      ] handed'
+                   ] handed'
           where
-            handButton handed = H.li { title: "If you are Left Handed you can change\n"
-                                           <> "the interface by clicking on me. Click\n"
-                                           <> "again to come back to previous state."
-                                     , className: "nav-item"
-                                     } [handedChooser { handed } []]
+            handButton handed' = H.li { title: "If you are Left Handed you can change\n"
+                                            <> "the interface by clicking on me. Click\n"
+                                            <> "again to come back to previous state."
+                                      , className: "nav-item"
+                                      } [handedChooser { handed } []]
 
             smiley = H.li { title: "Hello! Looking for the tree ?\n"
                                 <> "Just watch on the other side!\n"
@@ -63,7 +68,6 @@ topBarCpt = R.hooksComponentWithModule thisModule "topBar" cpt
                                       ]
                               -}
 
-            sortHanded = if fst handed == LeftHanded then reverse else identity
             -- SB.searchBar {session, databases: allDatabases}
 
 
@@ -82,7 +86,7 @@ divDropdownLeft :: R2.Component ()
 divDropdownLeft = R.createElement divDropdownLeftCpt
 
 divDropdownLeftCpt :: R.Component ()
-divDropdownLeftCpt = R.hooksComponentWithModule thisModule "divDropdownLeft" cpt
+divDropdownLeftCpt = here.component "divDropdownLeft" cpt
   where
     cpt {} _ = do
       show <- R.useState' false
@@ -158,7 +162,7 @@ menuButton :: R2.Component MenuButtonProps
 menuButton = R.createElement menuButtonCpt
 
 menuButtonCpt :: R.Component MenuButtonProps
-menuButtonCpt = R.hooksComponentWithModule thisModule "menuButton" cpt
+menuButtonCpt = here.component "menuButton" cpt
   where
     cpt { element: LiNav { title, href, icon, text }, show: (_ /\ setShow) } _ = do
       pure $ H.a { className: "dropdown-toggle navbar-text"
@@ -180,7 +184,7 @@ menuElements :: R2.Component MenuElementsProps
 menuElements = R.createElement menuElementsCpt
 
 menuElementsCpt :: R.Component MenuElementsProps
-menuElementsCpt = R.hooksComponentWithModule thisModule "menuElements" cpt
+menuElementsCpt = here.component "menuElements" cpt
   where
     cpt { show: false /\ _ } _ = do
       pure $ H.div {} []
@@ -224,24 +228,26 @@ liNav (LiNav { title : title'
 
 
 type HandedChooserProps = (
-  handed :: R.State Handed
+  handed :: T.Cursor Handed
   )
 
 handedChooser :: R2.Component HandedChooserProps
 handedChooser = R.createElement handedChooserCpt
 
 handedChooserCpt :: R.Component HandedChooserProps
-handedChooserCpt = R.hooksComponentWithModule thisModule "handedChooser" cpt
+handedChooserCpt = here.component "handedChooser" cpt
   where
     cpt { handed } _ = do
+      handed' <- T.useLive T.unequal handed
+
       pure $ H.a { className: "nav-link" } [
-        H.span { className: handedClass handed
+        H.span { className: handedClass handed'
                , on: { click: onClick handed } } []
         ]
 
-    handedClass (LeftHanded  /\ _) = "fa fa-hand-o-left"
-    handedClass (RightHanded /\ _) = "fa fa-hand-o-right"
+    handedClass LeftHanded = "fa fa-hand-o-left"
+    handedClass RightHanded = "fa fa-hand-o-right"
 
-    onClick (_ /\ setHanded) = setHanded $ \h -> case h of
+    onClick handed = T.modify (\h -> case h of
       LeftHanded  -> RightHanded
-      RightHanded -> LeftHanded
+      RightHanded -> LeftHanded) handed

src/Gargantext/Utils/Reload.purs

@@ -6,6 +6,7 @@ import Data.Maybe (Maybe(..), fromMaybe)
 import Data.Tuple.Nested ((/\))
 import Effect (Effect)
 import Reactix as R
+import Toestand as T
 
 type Reload  = Int
 type ReloadS = R.State Reload
@@ -17,6 +18,11 @@ new = R.useState' 0
 bump :: ReloadS -> Effect Unit
 bump (_ /\ setReload) = setReload (_ + 1)
 
+bumpCursor :: T.Cursor Reload -> Effect Unit
+bumpCursor c = do
+  _ <- T.modify (_ + 1) c
+  pure unit
+
 value :: ReloadS -> Reload
 value (val /\ _) = val
 

src/Gargantext/Version.purs

@@ -12,9 +12,10 @@ import Gargantext.Config.REST as REST
 import Gargantext.Ends (toUrl)
 import Gargantext.Sessions (Session(..))
 import Gargantext.Sessions as Sessions
+import Gargantext.Utils.Reactix as R2
 
-thisModule :: String
-thisModule = "Gargantext.Version"
+here :: R2.Here
+here = R2.here "Gargantext.Version"
 
 type Version = String
 
@@ -33,7 +34,7 @@ versionView :: Record VersionProps -> R.Element
 versionView props = R.createElement versionCpt props []
 
 versionCpt :: R.Component VersionProps
-versionCpt = R.hooksComponentWithModule thisModule "version" cpt
+versionCpt = here.component "version" cpt
   where
     cpt { session } _ = do
       (versionBack /\ setVer) <- R.useState' "No Backend Version"