Merge branch 'dev-refactor-views-panel' of...

Merge branch 'dev-refactor-views-panel' of ssh://gitlab.iscpif.fr:20022/gargantext/purescript-gargantext into dev-merge

dist/styles/Graph.css

@@ -34,6 +34,12 @@
   background-color: #fff;
   z-index: 1;
 }
+#graph-explorer .lefthanded .graph-tree {
+  left: 80%;
+}
+#graph-explorer .righthanded .graph-tree {
+  left: 0%;
+}
 #graph-explorer #graph-view {
   height: 95%;
 }
@@ -43,7 +49,6 @@
   top: 170px;
   border: 1px white solid;
   background-color: white;
-  left: 70%;
   width: 28%;
 }
 #graph-explorer #sp-container #myTab {
@@ -58,6 +63,12 @@
   display: inline;
   float: left;
 }
+#graph-explorer .lefthanded #sp-container {
+  left: 0%;
+}
+#graph-explorer .righthanded #sp-container {
+  left: 70%;
+}
 #graph-explorer #tree {
   position: absolute;
   z-index: 1;

dist/styles/Graph.sass

@@ -38,6 +38,10 @@
     @include sidePanelCommon
     background-color: #fff
     z-index: 1
+  .lefthanded .graph-tree
+    left: 80%
+  .righthanded .graph-tree
+    left: 0%
 
   #graph-view
     height: 95%
@@ -46,7 +50,6 @@
     @include sidePanelCommon
     border: 1px white solid
     background-color: white
-    left: 70%
     width: 28%
 
     #myTab
@@ -61,6 +64,10 @@
       ul
         display: inline
         float : left
+  .lefthanded #sp-container
+    left: 0%
+  .righthanded #sp-container
+    left: 70%
 
   #tree
     position: absolute

dist/styles/Login.css

@@ -78,6 +78,9 @@ li#rename #rename-a {
   background-color: white;
   border: none;
 }
+#node-popup-tooltip .popup-container .panel .panel-body .spacer {
+  margin: 10px;
+}
 #node-popup-tooltip .popup-container .frame-search.panel {
   border: 1px solid rgba(0, 0, 0, 0.2);
   box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);

dist/styles/Login.sass

@@ -70,6 +70,8 @@ li#rename
         justify-content: center
         background-color: white
         border: none
+        .spacer
+          margin: 10px
     .frame-search.panel
       border: 1px solid rgba(0,0,0,0.2)
       box-shadow: 0 2px 5px rgba(0,0,0,0.2)

dist/styles/Tree.css

@@ -14,16 +14,8 @@
   cursor: wait;
 }
 .tree .node {
-  padding-left: 10px;
   margin-top: 1px;
 }
-.tree .node .name.clickable {
-  color: #337ab7;
-  cursor: pointer;
-}
-.tree .node .name.clickable:hover {
-  text-decoration: underline;
-}
 .tree .lefthanded ul {
   margin-right: 19px;
 }

src/Gargantext/Components/Annotation/AnnotatedField.purs

@@ -28,6 +28,9 @@ import Gargantext.Components.Annotation.Utils ( termBootstrapClass )
 import Gargantext.Components.NgramsTable.Core (NgramsTable, NgramsTerm, findNgramTermList, highlightNgrams, normNgram)
 import Gargantext.Components.Annotation.Menu ( AnnotationMenu, annotationMenu, MenuType(..) )
 import Gargantext.Utils.Selection as Sel
+import Gargantext.Utils.Reactix as R2
+
+thisModule = "Gargantext.Components.Annotation.AnnotatedField"
 
 type Props =
   ( ngrams       :: NgramsTable
@@ -44,7 +47,7 @@ annotatedField :: Record Props -> R.Element
 annotatedField p = R.createElement annotatedFieldComponent p []
 
 annotatedFieldComponent :: R.Component Props
-annotatedFieldComponent = R.hooksComponent "AnnotatedField" cpt
+annotatedFieldComponent = R2.hooksComponent thisModule "annotatedField" cpt
   where
     cpt {ngrams,setTermList,text} _ = do
       mMenu@(_ /\ setMenu) <- R.useState $ const Nothing

src/Gargantext/Components/Annotation/Menu.purs

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

src/Gargantext/Components/App.purs

@@ -35,6 +35,8 @@ import Gargantext.Sessions as Sessions
 import Gargantext.Types as GT
 import Gargantext.Utils.Reactix as R2
 
+thisModule = "Gargantext.Components.App"
+
 -- TODO (what does this mean?)
 -- tree changes endConfig state => trigger endConfig change in outerLayout, layoutFooter etc
 
@@ -42,7 +44,7 @@ app :: {} -> R.Element
 app props = R.createElement appCpt props []
 
 appCpt :: R.Component ()
-appCpt = R.hooksComponent "G.C.App.app" cpt where
+appCpt = R2.hooksComponent thisModule "app" cpt where
   frontends = defaultFrontends
   cpt _ _ = do
     sessions   <- useSessions
@@ -121,7 +123,7 @@ forestLayout :: Record ForestLayoutProps -> R.Element
 forestLayout props = R.createElement forestLayoutCpt props []
 
 forestLayoutCpt :: R.Component ForestLayoutProps
-forestLayoutCpt = R.hooksComponent "G.C.A.forestLayout" cpt
+forestLayoutCpt = R2.hooksComponent thisModule "forestLayout" cpt
   where
     cpt props@{ handed } _ = do
       pure $ R.fragment [ topBar { handed }, forestLayoutMain props ]
@@ -130,7 +132,7 @@ forestLayoutMain :: Record ForestLayoutProps -> R.Element
 forestLayoutMain props = R.createElement forestLayoutMainCpt props []
 
 forestLayoutMainCpt :: R.Component ForestLayoutProps
-forestLayoutMainCpt = R.hooksComponent "G.C.A.forestLayoutMain" cpt
+forestLayoutMainCpt = R2.hooksComponent thisModule "forestLayoutMain" cpt
   where
     cpt { child, frontends, handed, reload, route, sessions, showLogin } _ = do
       let ordering =
@@ -162,7 +164,7 @@ topBar :: Record TopBarProps -> R.Element
 topBar props = R.createElement topBarCpt props []
 
 topBarCpt :: R.Component TopBarProps
-topBarCpt = R.hooksComponent "G.C.A.topBar" cpt
+topBarCpt = R2.hooksComponent thisModule "topBar" cpt
   where
     cpt { handed } _ = do
       pure $ H.div { id: "dafixedtop"
@@ -204,7 +206,7 @@ handedChooser :: Record HandedChooserProps -> R.Element
 handedChooser props = R.createElement handedChooserCpt props []
 
 handedChooserCpt :: R.Component HandedChooserProps
-handedChooserCpt = R.hooksComponent "G.C.A.handedChooser" cpt
+handedChooserCpt = R2.hooksComponent thisModule "handedChooser" cpt
   where
     cpt { handed } _ = do
       pure $ H.li {} [
@@ -337,7 +339,7 @@ footer :: Record FooterProps -> R.Element
 footer props = R.createElement footerCpt props []
 
 footerCpt :: R.Component FooterProps
-footerCpt = R.hooksComponent "G.C.A.footer" cpt
+footerCpt = R2.hooksComponent thisModule "footer" cpt
   where
     cpt { session } _ = do
       pure $ H.div 

src/Gargantext/Components/AutoUpdate.purs

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

src/Gargantext/Components/CodeEditor.purs

@@ -24,6 +24,8 @@ import Gargantext.Prelude
 import Gargantext.Utils.HighlightJS as HLJS
 import Gargantext.Utils.Reactix as R2
 
+thisModule = "Gargantext.Components.CodeEditor"
+
 type Code = String
 type Html = String
 type Error = String
@@ -105,7 +107,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.hooksComponent "G.C.CE.CodeEditor" cpt
+codeEditorCpt = R2.hooksComponent thisModule "codeEditor" cpt
   where
     cpt {code, defaultCodeType, onChange} _ = do
       controls <- initControls code defaultCodeType
@@ -202,7 +204,7 @@ toolbar :: Record ToolbarProps -> R.Element
 toolbar p = R.createElement toolbarCpt p []
 
 toolbarCpt :: R.Component ToolbarProps
-toolbarCpt = R.hooksComponent "G.C.CE.toolbar" cpt
+toolbarCpt = R2.hooksComponent thisModule "toolbar" cpt
   where
     cpt props@{controls: {codeType, error, viewType}} _ = do
       pure $
@@ -231,7 +233,7 @@ errorComponent :: Record ErrorComponentProps -> R.Element
 errorComponent p = R.createElement errorComponentCpt p []
 
 errorComponentCpt :: R.Component ErrorComponentProps
-errorComponentCpt = R.hooksComponent "G.C.CE.ErrorComponent" cpt
+errorComponentCpt = R2.hooksComponent thisModule "errorComponent" cpt
   where
     cpt {error: (Nothing /\ _)} _ = pure $ H.div {} []
     cpt {error: ((Just error) /\ _)} _ = do
@@ -248,7 +250,7 @@ codeTypeSelector :: Record CodeTypeSelectorProps -> R.Element
 codeTypeSelector p = R.createElement codeTypeSelectorCpt p []
 
 codeTypeSelectorCpt :: R.Component CodeTypeSelectorProps
-codeTypeSelectorCpt = R.hooksComponent "G.C.CE.CodeTypeSelector" cpt
+codeTypeSelectorCpt = R2.hooksComponent thisModule "codeTypeSelector" cpt
   where
     cpt {codeType, onChange} _ = do
       pure $ R2.select { className: "form-control"
@@ -284,7 +286,7 @@ viewTypeSelector :: Record ViewTypeSelectorProps -> R.Element
 viewTypeSelector p = R.createElement viewTypeSelectorCpt p []
 
 viewTypeSelectorCpt :: R.Component ViewTypeSelectorProps
-viewTypeSelectorCpt = R.hooksComponent "G.C.CE.ViewTypeSelector" cpt
+viewTypeSelectorCpt = R2.hooksComponent thisModule "viewTypeSelector" cpt
   where
     cpt {state} _ =
       pure $ H.div { className: "btn-group" } [

src/Gargantext/Components/ContextMenu/ContextMenu.purs

@@ -21,13 +21,15 @@ import Reactix.DOM.HTML as HTML
 
 import Gargantext.Utils.Reactix as R2
 
+thisModule = "Gargantext.Components.ContextMenu.ContextMenu"
+
 type Props t = ( x :: Number, y :: Number, setMenu :: R2.Setter (Maybe t) )
 
 contextMenu :: forall t. Record (Props t) -> Array R.Element -> R.Element
 contextMenu = R.createElement contextMenuCpt
 
 contextMenuCpt :: forall t. R.Component (Props t)
-contextMenuCpt = R.hooksComponent "ContextMenu" cpt
+contextMenuCpt = R2.hooksComponent thisModule "contextMenu" cpt
   where
     cpt menu children = do
       host <- R2.getPortalHost
@@ -101,7 +103,7 @@ contextMenuItem :: Array R.Element -> R.Element
 contextMenuItem = R.createElement contextMenuItemCpt {}
 
 contextMenuItemCpt :: R.Component ()
-contextMenuItemCpt = R.hooksComponent "ContextMenuItem" cpt
+contextMenuItemCpt = R2.hooksComponent thisModule "contextMenuItem" cpt
   where
     cpt _props children = pure $ HTML.li { className: "context-menu-item" } children
 

src/Gargantext/Components/DocsTable.purs

@@ -39,6 +39,9 @@ import Gargantext.Routes (SessionRoute(NodeAPI))
 import Gargantext.Sessions (Session, sessionId, get, delete, put)
 import Gargantext.Types (NodeType(..), OrderBy(..), TableResult, TabType, showTabType')
 import Gargantext.Utils.CacheAPI as GUC
+import Gargantext.Utils.Reactix as R2
+
+thisModule = "Gargantext.Components.DocsTable"
 ------------------------------------------------------------------------
 
 type TotalRecords = Int
@@ -159,7 +162,7 @@ docViewLayout :: Record LayoutProps -> R.Element
 docViewLayout props = R.createElement docViewLayoutCpt props []
 
 docViewLayoutCpt :: R.Component LayoutProps
-docViewLayoutCpt = R.hooksComponent "G.C.DocsTable.docViewLayout" cpt
+docViewLayoutCpt = R2.hooksComponent thisModule "docViewLayout" cpt
   where
     cpt layout _children = do
       query <- R.useState' ""
@@ -176,7 +179,7 @@ docView :: Record Props -> R.Element
 docView props = R.createElement docViewCpt props []
 
 docViewCpt :: R.Component Props
-docViewCpt = R.hooksComponent "G.C.DocsTable.docView" cpt where
+docViewCpt = R2.hooksComponent thisModule "docView" cpt where
   cpt { query, params
       , layout: { frontends, session, nodeId, tabType, listId
                 , corpusId, totalRecords, chart, showSearch } } _ = do
@@ -213,7 +216,7 @@ docViewCpt = R.hooksComponent "G.C.DocsTable.docView" cpt where
 searchBar :: R.State Query -> R.Element
 searchBar (query /\ setQuery) = R.createElement el {} []
   where
-    el = R.hooksComponent "SearchBar" cpt
+    el = R2.hooksComponent thisModule "SearchBar" cpt
     cpt {} _children = do
       queryText <- R.useState' query
 
@@ -298,7 +301,7 @@ pageLayout :: Record PageLayoutProps -> R.Element
 pageLayout props = R.createElement pageLayoutCpt props []
 
 pageLayoutCpt :: R.Component PageLayoutProps
-pageLayoutCpt = R.hooksComponent "G.C.DocsTable.pageLayout" cpt where
+pageLayoutCpt = R2.hooksComponent thisModule "pageLayout" cpt where
   cpt props@{ corpusId, frontends, listId, nodeId, params, query, session, tabType } _ =
     useLoaderWithCacheAPI {
         cacheEndpoint: getPageHash session
@@ -334,7 +337,7 @@ page :: T.Params -> Record PageLayoutProps -> Array DocumentsView -> R.Element
 page params layout documents = R.createElement pageCpt { documents, layout, params } []
 
 pageCpt :: R.Component PageProps
-pageCpt = R.hooksComponent "G.C.DocsTable.pageCpt" cpt where
+pageCpt = R2.hooksComponent thisModule "pageCpt" cpt where
   cpt { documents, layout, params } _ = do
     paramsS <- R.useState' params
     pure $ pagePaint { documents, layout, params: paramsS }
@@ -349,7 +352,7 @@ pagePaint :: Record PagePaintProps -> R.Element
 pagePaint props = R.createElement pagePaintCpt props []
 
 pagePaintCpt :: R.Component PagePaintProps
-pagePaintCpt = R.hooksComponent "G.C.DocsTable.pagePaintCpt" cpt where
+pagePaintCpt = R2.hooksComponent thisModule "pagePaintCpt" cpt where
   cpt { layout: { corpusId, frontends, listId, nodeId, session, totalRecords }, documents, params } _ = do
     localCategories <- R.useState' (mempty :: LocalCategories)
     pure $ T.table

src/Gargantext/Components/FacetsTable.purs

@@ -17,6 +17,10 @@ import Data.Tuple (fst, snd)
 import Data.Tuple.Nested ((/\))
 import Effect (Effect)
 import Effect.Aff (Aff, launchAff_)
+import Prelude
+import Reactix as R
+import Reactix.DOM.HTML as H
+
 import Gargantext.Components.Category (Category(..), CategoryQuery(..), favCategory, decodeCategory, putCategories)
 import Gargantext.Components.Search
 import Gargantext.Components.Table as T
@@ -29,9 +33,8 @@ import Gargantext.Types (NodeType(..), OrderBy(..), NodePath(..), NodeID)
 import Gargantext.Utils (toggleSet, zeroPad)
 import Gargantext.Utils.DecodeMaybe ((.|))
 import Gargantext.Utils.Reactix as R2
-import Prelude
-import Reactix as R
-import Reactix.DOM.HTML as H
+
+thisModule = "Gargantext.Components.FacetsTable"
 ------------------------------------------------------------------------
 
 type Props =
@@ -91,7 +94,7 @@ docView :: Record Props -> R.Element
 docView props = R.createElement docViewCpt props []
 
 docViewCpt :: R.Component Props
-docViewCpt = R.hooksComponent "G.C.FacetsTable.DocView" cpt
+docViewCpt = R2.hooksComponent thisModule "docView" cpt
   where
     cpt {frontends, session, nodeId, listId, query, totalRecords, chart, container} _ = do
       deletions <- R.useState' initialDeletions
@@ -142,7 +145,7 @@ docViewGraph :: Record Props -> R.Element
 docViewGraph props = R.createElement docViewCpt props []
 
 docViewGraphCpt :: R.Component Props
-docViewGraphCpt = R.hooksComponent "FacetsDocViewGraph" cpt
+docViewGraphCpt = R2.hooksComponent thisModule "docViewGraph" cpt
   where
     cpt {frontends, session, nodeId, listId, query, totalRecords, chart, container} _ = do
       deletions <- R.useState' initialDeletions
@@ -289,7 +292,7 @@ pageLayout :: Record PageLayoutProps -> R.Element
 pageLayout props = R.createElement pageLayoutCpt props []
 
 pageLayoutCpt :: R.Component PageLayoutProps
-pageLayoutCpt = R.hooksComponent "G.C.FacetsTable.PageLayout" cpt
+pageLayoutCpt = R2.hooksComponent thisModule "pageLayout" cpt
   where
     cpt {frontends, totalRecords, deletions, container, session, path} _ = do
       useLoader (fst path) loadPage $ \documents ->
@@ -299,7 +302,7 @@ page :: Record PageProps -> R.Element
 page props = R.createElement pageCpt props []
 
 pageCpt :: R.Component PageProps
-pageCpt = R.hooksComponent "G.C.FacetsTable.Page" cpt
+pageCpt = R2.hooksComponent thisModule "page" cpt
   where
     cpt {frontends, totalRecords, container, deletions, documents, session, path: path@({nodeId, listId, query} /\ setPath)} _ = do
       pure $ T.table { rows, container, colNames, totalRecords, params, wrapColElts }

src/Gargantext/Components/Forest.purs

@@ -17,6 +17,8 @@ import Gargantext.Sessions (Session(..), Sessions, OpenNodes, unSessions)
 import Gargantext.Types (Reload, Handed(..))
 import Gargantext.Utils.Reactix as R2
 
+thisModule = "Gargantext.Components.Forest"
+
 type Props =
   ( frontends :: Frontends
   , handed    :: Handed
@@ -30,7 +32,7 @@ forest :: Record Props -> R.Element
 forest props = R.createElement forestCpt props []
 
 forestCpt :: R.Component Props
-forestCpt = R.hooksComponent "G.C.Forest.forest" cpt where
+forestCpt = R2.hooksComponent thisModule "forest" cpt where
   cpt { frontends, handed, reload: extReload, route, sessions, showLogin } _ = do
     -- NOTE: this is a hack to reload the tree view on demand
     reload     <- R.useState' (0 :: Reload)

src/Gargantext/Components/Forest/Tree.purs

@@ -33,10 +33,13 @@ import Gargantext.Ends (Frontends)
 import Gargantext.Hooks.Loader (useLoader)
 import Gargantext.Prelude (Unit, bind, discard, map, pure, void, ($), (+), (<>), (==))
 import Gargantext.Routes (AppRoute)
+import Gargantext.Routes as GR
 import Gargantext.Sessions (OpenNodes, Session, mkNodeId, get)
 import Gargantext.Types (ID, Reload, isPublic, publicize)
 import Gargantext.Types as GT
-import Gargantext.Routes as GR
+import Gargantext.Utils.Reactix as R2
+
+thisModule = "Gargantext.Components.Forest.Tree"
 
 ------------------------------------------------------------------------
 type CommonProps =
@@ -58,7 +61,7 @@ treeView :: Record Props -> R.Element
 treeView props = R.createElement treeViewCpt props []
   where
     treeViewCpt :: R.Component Props
-    treeViewCpt = R.hooksComponent "G.C.Tree.treeView" cpt
+    treeViewCpt = R2.hooksComponent thisModule "treeView" cpt
       where
         cpt { root
             , asyncTasks
@@ -83,7 +86,7 @@ treeLoadView :: Record Props -> R.Element
 treeLoadView p = R.createElement treeLoadViewCpt p []
   where
     treeLoadViewCpt :: R.Component Props
-    treeLoadViewCpt = R.hooksComponent "TreeLoadView" cpt
+    treeLoadViewCpt = R2.hooksComponent thisModule "treeLoadView" cpt
       where
         cpt { root
             , asyncTasks
@@ -122,7 +125,7 @@ loadedTreeView :: Record TreeViewProps -> R.Element
 loadedTreeView p = R.createElement loadedTreeViewCpt p []
   where
     loadedTreeViewCpt :: R.Component TreeViewProps
-    loadedTreeViewCpt = R.hooksComponent "LoadedTreeView" cpt
+    loadedTreeViewCpt = R2.hooksComponent thisModule "loadedTreeView" cpt
       where
         cpt { asyncTasks
             , frontends
@@ -183,7 +186,7 @@ toHtml p@{ asyncTasks
          } =
   R.createElement el {} []
     where
-      el          = R.hooksComponent "NodeView" cpt
+      el          = R2.hooksComponent thisModule "nodeView" cpt
       commonProps = RecordE.pick p :: Record CommonProps
       pAction a   = performAction a (RecordE.pick p :: Record PerformActionProps)
 

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

@@ -34,6 +34,8 @@ import Gargantext.Types as GT
 import Gargantext.Utils.Popover as Popover
 import Gargantext.Utils.Reactix as R2
 
+thisModule = "Gargantext.Components.Forest.Tree.Node"
+
 
 -- Main Node
 type NodeMainSpanProps =
@@ -51,7 +53,7 @@ nodeMainSpan :: Record NodeMainSpanProps
              -> R.Element
 nodeMainSpan p@{ dispatch, folderOpen, frontends, handed, session } = R.createElement el p []
   where
-    el = R.hooksComponent "G.C.F.T.N.NodeMainSpan" cpt
+    el = R2.hooksComponent thisModule "nodeMainSpan" cpt
     cpt props@{id, mCurrentRoute, name, nodeType, tasks: { onTaskFinish, tasks }} _ = do
       -- only 1 popup at a time is allowed to be opened
       droppedFile   <- R.useState' (Nothing :: Maybe DroppedFile)
@@ -213,7 +215,7 @@ nodeActions :: Record NodeActionsProps -> R.Element
 nodeActions p = R.createElement nodeActionsCpt p []
 
 nodeActionsCpt :: R.Component NodeActionsProps
-nodeActionsCpt = R.hooksComponent "G.C.F.T.N.B.nodeActions" cpt
+nodeActionsCpt = R2.hooksComponent thisModule "nodeActions" cpt
   where
     cpt { id
         , nodeType: GT.Graph

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

@@ -18,6 +18,9 @@ import Gargantext.Routes as GR
 import Gargantext.Sessions (Session, post)
 import Gargantext.Types  as GT
 import Gargantext.Types (NodeType(..))
+import Gargantext.Utils.Reactix as R2
+
+thisModule = "Gargantext.Components.Forest.Tree.Node.Action.Add"
 
 ----------------------------------------------------------------------
 addNode :: Session -> GT.ID -> AddNodeValue -> Aff (Array GT.ID)
@@ -61,7 +64,7 @@ addNodeView :: Record CreateNodeProps
             -> R.Element
 addNodeView p@{ dispatch, nodeType, nodeTypes } = R.createElement el p []
   where
-    el = R.hooksComponent "AddNodeView" cpt
+    el = R2.hooksComponent thisModule "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/Contact.purs

@@ -4,6 +4,10 @@ import Data.Maybe (Maybe(..))
 import Data.Tuple.Nested ((/\))
 import Effect.Aff (Aff, launchAff)
 import Effect.Uncurried (mkEffectFn1)
+import Prelude (($))
+import Reactix as R
+import Reactix.DOM.HTML as H
+
 import Gargantext.Components.Forest.Tree.Node.Action (Action)
 import Gargantext.Components.Forest.Tree.Node.Action.Contact.Types (AddContactParams(..))
 -- import Gargantext.Components.Forest.Tree.Node.Tools.SubTree (subTreeView, SubTreeParamsIn)
@@ -13,9 +17,8 @@ import Gargantext.Sessions (Session, post)
 import Gargantext.Types (ID)
 import Gargantext.Types as GT
 import Gargantext.Utils.Reactix as R2
-import Prelude (($))
-import Reactix as R
-import Reactix.DOM.HTML as H
+
+thisModule = "Gargantext.Components.Forest.Tree.Node.Action.Contact"
 
 ------------------------------------------------------------------------
 contactReq :: Session -> ID -> AddContactParams -> Aff ID
@@ -38,7 +41,7 @@ textInputBox :: Record TextInputBoxProps -> R.Element
 textInputBox p@{ boxName, boxAction, dispatch, isOpen: (true /\ setIsOpen), params } = R.createElement el p []
   where
     {firstname, lastname} = params
-    el = R.hooksComponent (boxName <> "Box") cpt
+    el = R2.hooksComponent thisModule (boxName <> "Box") cpt
     cpt {id, params:params'} _ = do
       let {firstname, lastname} = params'
       stateFirstname <- R.useState' firstname
@@ -77,7 +80,7 @@ textInputBox p@{ boxName, boxAction, dispatch, isOpen: (true /\ setIsOpen), para
               } []
 textInputBox p@{ boxName, isOpen: (false /\ _) } = R.createElement el p []
   where
-    el = R.hooksComponent (boxName <> "Box") cpt
+    el = R2.hooksComponent thisModule (boxName <> "Box") cpt
     cpt {} _ = pure $ H.div {} []
 
 

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

-module Gargantext.Components.Forest.Tree.Node.Action.Link
-  where
+module Gargantext.Components.Forest.Tree.Node.Action.Link where
 
 import Data.Argonaut as Argonaut
 import Data.Generic.Rep (class Generic)
@@ -7,6 +6,9 @@ import Data.Generic.Rep.Show (genericShow)
 import Data.Maybe (Maybe(..))
 import Data.Tuple.Nested ((/\))
 import Effect.Aff (Aff)
+import Reactix as R
+import Reactix.DOM.HTML as H
+
 import Gargantext.Components.Forest.Tree.Node.Action (Action(..))
 import Gargantext.Components.Forest.Tree.Node.Tools (submitButton, panel)
 import Gargantext.Components.Forest.Tree.Node.Tools.SubTree (subTreeView, SubTreeParamsIn)
@@ -16,8 +18,9 @@ import Gargantext.Sessions (Session, post)
 import Gargantext.Routes as GR
 import Gargantext.Types  as GT
 import Gargantext.Utils.Argonaut (genericSumDecodeJson, genericSumEncodeJson)
-import Reactix as R
-import Reactix.DOM.HTML as H
+import Gargantext.Utils.Reactix as R2
+
+thisModule = "Gargantext.Components.Forest.Tree.Node.Action.Link"
 
 
 data LinkNodeReq = LinkNodeReq { nodeType :: GT.NodeType
@@ -56,7 +59,7 @@ linkNode :: Record SubTreeParamsIn -> R.Element
 linkNode p = R.createElement linkNodeCpt p []
 
 linkNodeCpt :: R.Component SubTreeParamsIn
-linkNodeCpt = R.hooksComponent "G.C.F.T.N.A.L.linkNode" cpt
+linkNodeCpt = R2.hooksComponent thisModule "linkNode" cpt
   where
     cpt p@{dispatch, subTreeParams, id, nodeType, session, handed} _ = do
 

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

-module Gargantext.Components.Forest.Tree.Node.Action.Merge
-  where
+module Gargantext.Components.Forest.Tree.Node.Action.Merge where
 
 import Data.Maybe (Maybe(..))
+import Data.Set as Set
 import Data.Tuple.Nested ((/\))
 import Effect.Aff (Aff)
+import Reactix as R
+import Reactix.DOM.HTML as H
+
 import Gargantext.Components.Forest.Tree.Node.Action (Action(..))
 import Gargantext.Components.Forest.Tree.Node.Tools (submitButton, panel, checkbox, checkboxes)
 import Gargantext.Components.Forest.Tree.Node.Tools.SubTree (subTreeView, SubTreeParamsIn)
@@ -11,9 +14,9 @@ import Gargantext.Prelude
 import Gargantext.Routes (SessionRoute(..))
 import Gargantext.Sessions (Session, put_)
 import Gargantext.Types  as GT
-import Reactix as R
-import Reactix.DOM.HTML as H
-import Data.Set as Set
+import Gargantext.Utils.Reactix as R2
+
+thisModule = "Gargantext.Components.Forest.Tree.Node.Action.Merge"
 
 mergeNodeReq :: Session -> GT.ID -> GT.ID -> Aff (Array GT.ID)
 mergeNodeReq session fromId toId =
@@ -23,7 +26,7 @@ mergeNode :: Record SubTreeParamsIn -> R.Element
 mergeNode p = R.createElement mergeNodeCpt p []
 
 mergeNodeCpt :: R.Component SubTreeParamsIn
-mergeNodeCpt = R.hooksComponent "G.C.F.T.N.A.M.mergeNode" cpt
+mergeNodeCpt = R2.hooksComponent thisModule "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

-module Gargantext.Components.Forest.Tree.Node.Action.Move
-  where
+module Gargantext.Components.Forest.Tree.Node.Action.Move where
 
 import Data.Maybe (Maybe(..))
 import Data.Tuple.Nested ((/\))
 import Effect.Aff (Aff)
+import Reactix as R
+import Reactix.DOM.HTML as H
+
 import Gargantext.Components.Forest.Tree.Node.Action (Action(..))
 import Gargantext.Components.Forest.Tree.Node.Tools (submitButton, panel)
 import Gargantext.Components.Forest.Tree.Node.Tools.SubTree (subTreeView, SubTreeParamsIn)
@@ -11,8 +13,9 @@ import Gargantext.Prelude
 import Gargantext.Routes (SessionRoute(..))
 import Gargantext.Sessions (Session, put_)
 import Gargantext.Types as GT
-import Reactix as R
-import Reactix.DOM.HTML as H
+import Gargantext.Utils.Reactix as R2
+
+thisModule = "Gargantext.Components.Forest.Tree.Node.Action.Move"
 
 moveNodeReq :: Session -> GT.ID -> GT.ID -> Aff (Array GT.ID)
 moveNodeReq session fromId toId =
@@ -22,7 +25,7 @@ moveNode :: Record SubTreeParamsIn -> R.Element
 moveNode p = R.createElement moveNodeCpt p []
 
 moveNodeCpt :: R.Component SubTreeParamsIn
-moveNodeCpt = R.hooksComponent "G.C.F.T.N.A.M.moveNode" cpt
+moveNodeCpt = R2.hooksComponent thisModule "moveNode" cpt
   where
     cpt p@{dispatch, subTreeParams, id, nodeType, session, handed} _ = do
       action@(valAction /\ setAction) :: R.State Action <- R.useState' (MoveNode {params: Nothing})
@@ -35,10 +38,10 @@ moveNodeCpt = R.hooksComponent "G.C.F.T.N.A.M.moveNode" cpt
 
       pure $ panel [ subTreeView { action
                                  , dispatch
+                                 , handed
                                  , id
                                  , nodeType
                                  , session
                                  , subTreeParams
-                                 , handed
                                  }
               ] button

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

@@ -20,6 +20,8 @@ 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"
+
 --------------------
 
 data FrameSource = Istex | Searx
@@ -41,7 +43,7 @@ searchIframes :: Record SearchIFramesProps -> R.Element
 searchIframes props = R.createElement searchIframesCpt props []
 
 searchIframesCpt :: R.Component SearchIFramesProps
-searchIframesCpt = R.hooksComponent "G.C.F.T.N.A.S.F.searchIframes" cpt
+searchIframesCpt = R2.hooksComponent thisModule "searchIframes" cpt
   where
     cpt { iframeRef, search: search@(search' /\ _) } _ = do
       pure $ if isIsTex_Advanced search'.datafield
@@ -62,7 +64,7 @@ divIframe :: Record IFrameProps -> R.Element
 divIframe props = R.createElement divIframeCpt props []
 
 divIframeCpt :: R.Component IFrameProps
-divIframeCpt = R.hooksComponent "G.C.F.T.N.A.S.F.divIframe" cpt
+divIframeCpt = R2.hooksComponent thisModule "divIframe" cpt
   where
     cpt { frameSource, iframeRef, search: search@(search' /\ _) } _ = do
       pure $ H.div { className: "frame-search panel panel-default" }
@@ -77,7 +79,7 @@ iframeWith :: Record IFrameProps -> R.Element
 iframeWith props = R.createElement iframeWithCpt props []
 
 iframeWithCpt :: R.Component IFrameProps
-iframeWithCpt = R.hooksComponent "G.C.F.T.N.A.S.F.iframeWith" cpt
+iframeWithCpt = R2.hooksComponent thisModule "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

@@ -4,14 +4,18 @@ module Gargantext.Components.Forest.Tree.Node.Action.Search.SearchBar
 
 import Data.Tuple.Nested ((/\))
 import Effect (Effect)
+import Reactix as R
+import Reactix.DOM.HTML as H
+
 import Gargantext.Components.Forest.Tree.Node.Action.Search.SearchField (searchField)
 import Gargantext.Components.Forest.Tree.Node.Action.Search.Types -- (Database, SearchQuery(..), defaultSearchQuery, performSearch, Lang(..))
 import Gargantext.Components.Lang (Lang)
 import Gargantext.Prelude (Unit, pure, ($))
 import Gargantext.Sessions (Session)
 import Gargantext.Types as GT
-import Reactix as R
-import Reactix.DOM.HTML as H
+import Gargantext.Utils.Reactix as R2
+
+thisModule = "Gargantext.Components.Forest.Tree.Node.Action.Search.SearchBar"
 
 type Props = ( langs     :: Array Lang
              , onSearch  :: GT.AsyncTaskWithType -> Effect Unit
@@ -23,7 +27,7 @@ searchBar :: Record Props -> R.Element
 searchBar props = R.createElement searchBarCpt props []
 
 searchBarCpt :: R.Component Props
-searchBarCpt = R.hooksComponent "G.C.F.T.N.A.S.SB.searchBar" cpt
+searchBarCpt = R2.hooksComponent thisModule "searchBar" cpt
   where
     cpt {langs, onSearch, search: search@(s /\ _), session} _ = do
       --onSearchChange session s

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

-module Gargantext.Components.Forest.Tree.Node.Action.Search.SearchField
-    where
+module Gargantext.Components.Forest.Tree.Node.Action.Search.SearchField where
 
 import DOM.Simple.Console (log, log2)
 import Data.Maybe (Maybe(..), maybe, fromMaybe)
@@ -11,6 +10,9 @@ import Data.Tuple.Nested ((/\))
 import Effect (Effect)
 import Effect.Aff (launchAff_)
 import Effect.Class (liftEffect)
+import Reactix as R
+import Reactix.DOM.HTML as H
+
 import Gargantext.Components.Forest.Tree.Node.Tools (panel)
 import Gargantext.Components.Forest.Tree.Node.Action.Search.Types (DataField(..), Database(..), IMT_org(..), Org(..), SearchQuery(..), allIMTorgs, allOrgs, dataFields, defaultSearchQuery, doc, performSearch, datafield2database, Search)
 import Gargantext.Components.Lang (Lang)
@@ -19,8 +21,8 @@ import Gargantext.Sessions (Session)
 import Gargantext.Components.Forest.Tree.Node.Action.Search.Frame (searchIframes)
 import Gargantext.Types as GT
 import Gargantext.Utils.Reactix as R2
-import Reactix as R
-import Reactix.DOM.HTML as H
+
+thisModule = "Gargantext.Components.Forest.Tree.Node.Action.Search.SearchField"
 
 defaultSearch :: Search
 defaultSearch = { databases: Empty
@@ -45,9 +47,9 @@ searchField :: Record Props -> R.Element
 searchField p = R.createElement searchFieldComponent p []
 
 --searchFieldComponent :: R.Memo Props
---searchFieldComponent = R.memo (R.hooksComponent "SearchField" cpt) eqProps
+--searchFieldComponent = R.memo (R2.hooksComponent thisModule "searchField" cpt) eqProps
 searchFieldComponent :: R.Component Props
-searchFieldComponent = R.hooksComponent "G.C.F.T.N.A.S.SF.searchField" cpt
+searchFieldComponent = R2.hooksComponent thisModule "searchField" cpt
   where
     cpt props@{onSearch, search: search@(s /\ _)} _ = do
       iframeRef <- R.useRef    null
@@ -335,7 +337,7 @@ searchInput :: Record SearchInputProps -> R.Element
 searchInput p = R.createElement searchInputComponent p []
 
 searchInputComponent :: R.Component SearchInputProps
-searchInputComponent = R.hooksComponent "G.C.S.SearchInput" cpt
+searchInputComponent = R2.hooksComponent thisModule "searchInput" cpt
   where
     cpt {search: (search /\ setSearch)} _ = do
       pure $
@@ -362,7 +364,7 @@ submitButton :: Record SubmitButtonProps -> R.Element
 submitButton p = R.createElement submitButtonComponent p []
 
 submitButtonComponent :: R.Component SubmitButtonProps
-submitButtonComponent = R.hooksComponent "G.C.S.SubmitButton" cpt
+submitButtonComponent = R2.hooksComponent thisModule "submitButton" cpt
   where
     cpt {onSearch, search: (mySearch /\ _), session} _ =
       pure $

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

@@ -6,6 +6,10 @@ import Data.Generic.Rep.Show (genericShow)
 import Data.Maybe (Maybe(..))
 import Data.Tuple.Nested ((/\))
 import Effect.Aff (Aff)
+import Prelude (($))
+import Reactix as R
+import Reactix.DOM.HTML as H
+
 import Gargantext.Components.Forest.Tree.Node.Action (Action)
 import Gargantext.Components.Forest.Tree.Node.Action as Action
 import Gargantext.Components.Forest.Tree.Node.Tools as Tools
@@ -16,9 +20,9 @@ import Gargantext.Sessions (Session, post)
 import Gargantext.Types (ID)
 import Gargantext.Types as GT
 import Gargantext.Utils.Argonaut (genericSumDecodeJson, genericSumEncodeJson)
-import Prelude (($))
-import Reactix as R
-import Reactix.DOM.HTML as H
+import Gargantext.Utils.Reactix as R2
+
+thisModule = "Gargantext.Components.Forest.Tree.Node.Action.Share"
 
 ------------------------------------------------------------------------
 shareReq :: Session -> ID -> ShareNodeParams -> Aff ID
@@ -55,7 +59,7 @@ shareNode :: Record SubTreeParamsIn -> R.Element
 shareNode p = R.createElement shareNodeCpt p []
 
 shareNodeCpt :: R.Component SubTreeParamsIn
-shareNodeCpt = R.hooksComponent "G.C.F.T.N.A.M.shareNode" cpt
+shareNodeCpt = R2.hooksComponent thisModule "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,6 +32,8 @@ import Gargantext.Types (NodeType(..), ID)
 import Gargantext.Types         as GT
 import Gargantext.Utils.Reactix as R2
 
+thisModule = "Gargantext.Components.Forest.Tree.Node.Action.Upload"
+
 -- UploadFile Action
 
 -- | Action : Upload
@@ -71,7 +73,7 @@ uploadFileView :: Record Props -> R.Element
 uploadFileView props = R.createElement uploadFileViewCpt props []
 
 uploadFileViewCpt :: R.Component Props
-uploadFileViewCpt = R.hooksComponent "G.C.F.T.N.A.U.UploadFileView" cpt
+uploadFileViewCpt = R2.hooksComponent thisModule "uploadFileView" cpt
   where
     cpt {dispatch, id, nodeType} _ = do
       mFile    :: R.State (Maybe UploadFile) <- R.useState' Nothing
@@ -140,7 +142,7 @@ uploadButton :: Record UploadButtonProps -> R.Element
 uploadButton props = R.createElement uploadButtonCpt props []
 
 uploadButtonCpt :: R.Component UploadButtonProps
-uploadButtonCpt = R.hooksComponent "G.C.F.T.N.A.U.uploadButton" cpt
+uploadButtonCpt = R2.hooksComponent thisModule "uploadButton" cpt
   where
     cpt { dispatch
         , fileType: (fileType /\ setFileType)
@@ -187,7 +189,7 @@ fileTypeView :: Record FileTypeProps -> R.Element
 fileTypeView p = R.createElement fileTypeViewCpt p []
 
 fileTypeViewCpt :: R.Component FileTypeProps
-fileTypeViewCpt = R.hooksComponent "G.C.F.T.N.A.U.fileTypeView" cpt
+fileTypeViewCpt = R2.hooksComponent thisModule "fileTypeView" cpt
   where
     cpt { dispatch
         , droppedFile: Just (DroppedFile {blob, fileType}) /\ setDroppedFile
@@ -326,7 +328,7 @@ uploadTermListView :: Record Props -> R.Element
 uploadTermListView props = R.createElement uploadTermListViewCpt props []
 
 uploadTermListViewCpt :: R.Component Props
-uploadTermListViewCpt = R.hooksComponent "G.C.F.T.N.A.U.UploadTermListView" cpt
+uploadTermListViewCpt = R2.hooksComponent thisModule "uploadTermListView" cpt
   where
     cpt {dispatch, id, nodeType} _ = do
       mFile :: R.State (Maybe UploadFile) <- R.useState' Nothing
@@ -372,7 +374,7 @@ uploadTermButton :: Record UploadTermButtonProps -> R.Element
 uploadTermButton props = R.createElement uploadTermButtonCpt props []
 
 uploadTermButtonCpt :: R.Component UploadTermButtonProps
-uploadTermButtonCpt = R.hooksComponent "G.C.F.T.N.A.U.uploadTermButton" cpt
+uploadTermButtonCpt = R2.hooksComponent thisModule "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/Box.purs

@@ -35,6 +35,8 @@ import Gargantext.Types as GT
 import Gargantext.Utils (glyphicon, glyphiconActive)
 import Gargantext.Utils.Reactix as R2
 
+thisModule = "Gargantext.Components.Forest.Tree.Node.Box"
+
 
 type CommonProps =
   ( dispatch :: Action -> Aff Unit
@@ -48,7 +50,7 @@ nodePopupView :: Record NodePopupProps -> R.Element
 nodePopupView p = R.createElement nodePopupCpt p []
 
 nodePopupCpt :: R.Component NodePopupProps
-nodePopupCpt = R.hooksComponent "G.C.F.T.N.B.nodePopupView" cpt
+nodePopupCpt = R2.hooksComponent thisModule "nodePopupView" cpt
   where
     cpt p _ = do
       isOpen    <- R.useState' false
@@ -140,7 +142,7 @@ nodePopupCpt = R.hooksComponent "G.C.F.T.N.B.nodePopupView" cpt
                   -> R.Element
         panelBody nodePopupState {dispatch: d, nodeType} =
           H.div {className: "panel-body flex-space-between"}
-                $ [ H.p { "style": {"margin":"10px"} } []
+                $ [ H.p { class: "spacer" } []
                   , H.div { className: "flex-center" }
                           [ buttonClick { action: doc
                                         , state: nodePopupState
@@ -200,7 +202,7 @@ buttonClick :: Record ButtonClickProps -> R.Element
 buttonClick p = R.createElement buttonClickCpt p []
 
 buttonClickCpt :: R.Component ButtonClickProps
-buttonClickCpt = R.hooksComponent "G.C.F.T.N.B.buttonClick" cpt
+buttonClickCpt = R2.hooksComponent thisModule "buttonClick" cpt
   where
     cpt {action: todo, state: (node@{action} /\ setNodePopup), nodeType} _ = do
       pure $ H.div {className: "col-md-1"}
@@ -260,7 +262,7 @@ panelAction :: Record PanelActionProps -> R.Element
 panelAction p = R.createElement panelActionCpt p []
 
 panelActionCpt :: R.Component PanelActionProps
-panelActionCpt = R.hooksComponent "G.C.F.T.N.B.panelAction" cpt
+panelActionCpt = R2.hooksComponent thisModule "panelAction" cpt
   where
     cpt {action: Documentation nodeType}                  _ = actionDoc      nodeType
     cpt {action: Download, id, nodeType, session}         _ = actionDownload nodeType id session

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

-module Gargantext.Components.Forest.Tree.Node.Tools 
-  where
+module Gargantext.Components.Forest.Tree.Node.Tools where
 
 import Data.Maybe (fromMaybe, Maybe(..))
 import Data.Nullable (null)
@@ -25,6 +24,8 @@ import Gargantext.Utils (toggleSet)
 import Gargantext.Utils.Reactix as R2
 import Gargantext.Utils.ReactTooltip as ReactTooltip
 
+thisModule = "Gargantext.Components.Forest.Tree.Node.Tools"
+
 ------------------------------------------------------------------------
 
 type Body    = Array R.Element
@@ -36,9 +37,7 @@ panel bodies submit =
     where
       panelBody bs =
           H.div {className: "panel-body"}
-          [ H.div { className: "row"
-                  , style: {"margin":"10px"}
-                  }
+          [ H.div { className: "row spacer" }
                   [ H.div { className: "col-md-12" } bs
                           -- TODO add type for text or form here
                           -- [ H.form {className: "form-horizontal"} bs ]
@@ -65,7 +64,7 @@ type TextInputBoxProps =
 textInputBox :: Record TextInputBoxProps -> R.Element
 textInputBox p@{ boxName, boxAction, dispatch, isOpen: (true /\ setIsOpen) } = R.createElement el p []
   where
-    el = R.hooksComponent (boxName <> "Box") cpt
+    el = R2.hooksComponent thisModule (boxName <> "Box") cpt
     cpt {id, text} _ = do
       renameNodeName <- R.useState' text
       pure $ H.div {className: "from-group row-no-padding"}
@@ -112,7 +111,7 @@ textInputBox p@{ boxName, boxAction, dispatch, isOpen: (true /\ setIsOpen) } = R
           launchAff_ $ dispatch ( boxAction newName )
 textInputBox p@{ boxName, isOpen: (false /\ _) } = R.createElement el p []
   where
-    el = R.hooksComponent (boxName <> "Box") cpt
+    el = R2.hooksComponent thisModule (boxName <> "Box") cpt
     cpt {text} _ = pure $ H.div {} []
 
 -- | END Rename Box
@@ -280,7 +279,7 @@ nodeLink :: Record NodeLinkProps -> R.Element
 nodeLink p = R.createElement nodeLinkCpt p []
 
 nodeLinkCpt :: R.Component NodeLinkProps
-nodeLinkCpt = R.hooksComponent "G.C.F.T.N.T.nodeLink" cpt
+nodeLinkCpt = R2.hooksComponent thisModule "nodeLink" cpt
   where
     cpt { frontends, id, isSelected, name, nodeType, session, handed} _ = do
       popoverRef <- R.useRef null
@@ -317,7 +316,7 @@ nodeText :: Record NodeTextProps -> R.Element
 nodeText p = R.createElement nodeTextCpt p []
 
 nodeTextCpt :: R.Component NodeTextProps
-nodeTextCpt = R.hooksComponent "G.C.F.T.N.T.nodeText" cpt
+nodeTextCpt = R2.hooksComponent thisModule "nodeText" cpt
   where
     cpt { isSelected: true, name } _ = do
       pure $ H.u {} [

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

@@ -7,12 +7,16 @@ import Effect (Effect)
 import Effect.Aff (Aff, launchAff_)
 import Effect.Class (liftEffect)
 import Effect.Timer (clearInterval, setInterval)
+import Reactix as R
+import Reactix.DOM.HTML as H
+
 import Gargantext.Prelude
 import Gargantext.Routes (SessionRoute(..))
 import Gargantext.Sessions (Session, get)
 import Gargantext.Types as GT
-import Reactix as R
-import Reactix.DOM.HTML as H
+import Gargantext.Utils.Reactix as R2
+
+thisModule = "Gargantext.Components.Forest.Tree.Node.Tools.ProgressBar"
 
 
 data BarType = Bar | Pie
@@ -30,7 +34,7 @@ asyncProgressBar :: Record Props -> R.Element
 asyncProgressBar p = R.createElement asyncProgressBarCpt p []
 
 asyncProgressBarCpt :: R.Component Props
-asyncProgressBarCpt = R.hooksComponent "G.C.F.T.N.PB.asyncProgressBar" cpt
+asyncProgressBarCpt = R2.hooksComponent thisModule "asyncProgressBar" cpt
   where
     cpt props@{ asyncTask: (GT.AsyncTaskWithType {task: GT.AsyncTask {id}})
               , barType
@@ -76,7 +80,7 @@ progressIndicator :: Record ProgressIndicatorProps -> R.Element
 progressIndicator p = R.createElement progressIndicatorCpt p []
 
 progressIndicatorCpt :: R.Component ProgressIndicatorProps
-progressIndicatorCpt = R.hooksComponent "G.C.F.T.N.PB.progressIndicator" cpt
+progressIndicatorCpt = R2.hooksComponent thisModule "progressIndicator" cpt
   where
     cpt { barType: Bar, label, progress } _ = do
       pure $

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

@@ -5,6 +5,9 @@ import Data.Maybe (Maybe(..))
 import Data.Tuple.Nested ((/\))
 import Effect.Uncurried (mkEffectFn1)
 import Effect.Aff (Aff)
+import Reactix as R
+import Reactix.DOM.HTML as H
+
 import Gargantext.Components.Forest.Tree.Node.Action (Props, Action, subTreeOut, setTreeOut)
 import Gargantext.Components.Forest.Tree.Node.Tools.SubTree.Types (SubTreeParams(..), SubTreeOut(..))
 import Gargantext.Components.Forest.Tree.Node.Tools.FTree (FTree, LNode(..), NTree(..))
@@ -14,8 +17,9 @@ import Gargantext.Prelude (map, pure, show, ($), (&&), (/=), (<>), const, (==),
 import Gargantext.Routes as GR
 import Gargantext.Sessions (Session(..), get)
 import Gargantext.Types as GT
-import Reactix as R
-import Reactix.DOM.HTML as H
+import Gargantext.Utils.Reactix as R2
+
+thisModule = "Gargantext.Components.Forest.Tree.Node.Tools.SubTree"
 
 type SubTreeParamsIn =
   ( subTreeParams :: SubTreeParams
@@ -33,15 +37,15 @@ subTreeView :: Record SubTreeParamsProps -> R.Element
 subTreeView props = R.createElement subTreeViewCpt props []
 
 subTreeViewCpt :: R.Component SubTreeParamsProps
-subTreeViewCpt = R.hooksComponent "G.C.F.T.N.A.U.subTreeView" cpt
+subTreeViewCpt = R2.hooksComponent thisModule "subTreeView" cpt
   where
-    cpt params@{ dispatch
+    cpt params@{ action
+               , dispatch
+               , handed
                , id
                , nodeType
                , session
                , subTreeParams
-               , action
-               , handed
                } _ =
       do
         let
@@ -51,14 +55,14 @@ subTreeViewCpt = R.hooksComponent "G.C.F.T.N.A.U.subTreeView" cpt
 
         useLoader session (loadSubTree showtypes) $
           \tree ->
-            subTreeViewLoaded { dispatch
+            subTreeViewLoaded { action
+                              , dispatch
+                              , handed
                               , id
                               , nodeType
                               , session
-                              , tree
                               , subTreeParams
-                              , action
-                              , handed
+                              , tree
                               }
 
 loadSubTree :: Array GT.NodeType -> Session -> Aff FTree
@@ -81,7 +85,7 @@ subTreeViewLoaded :: Record CorpusTreeProps -> R.Element
 subTreeViewLoaded props = R.createElement subTreeViewLoadedCpt props []
 
 subTreeViewLoadedCpt :: R.Component CorpusTreeProps
-subTreeViewLoadedCpt = R.hooksComponent "G.C.F.T.N.A.U.subTreeViewLoadedCpt" cpt
+subTreeViewLoadedCpt = R2.hooksComponent thisModule "subTreeViewLoadedCpt" cpt
   where
     cpt p@{dispatch, id, nodeType, session, tree, handed} _ = do
       pure $ H.div {className:"tree"}
@@ -96,7 +100,7 @@ subTreeTreeView :: Record CorpusTreeProps -> R.Element
 subTreeTreeView props = R.createElement subTreeTreeViewCpt props []
 
 subTreeTreeViewCpt :: R.Component CorpusTreeProps
-subTreeTreeViewCpt = R.hooksComponent "G.C.F.T.N.A.U.subTreeTreeViewCpt" cpt
+subTreeTreeViewCpt = R2.hooksComponent thisModule "subTreeTreeViewCpt" cpt
   where
     cpt p@{ id
           , tree: NTree (LNode { id: targetId

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

@@ -13,6 +13,9 @@ import Gargantext.Components.NgramsTable.API as NTAPI
 import Gargantext.Prelude (Unit, bind, const, discard, pure, unit, ($), (<>), (==))
 import Gargantext.Types as GT
 import Gargantext.Sessions (Session)
+import Gargantext.Utils.Reactix as R2
+
+thisModule = "Gargantext.Components.Forest.Tree.Node.Tools.Sync"
 
 
 -- | Sync Node (Graph)
@@ -27,7 +30,7 @@ nodeActionsGraph :: Record NodeActionsGraphProps -> R.Element
 nodeActionsGraph p = R.createElement nodeActionsGraphCpt p []
 
 nodeActionsGraphCpt :: R.Component NodeActionsGraphProps
-nodeActionsGraphCpt = R.hooksComponent "G.C.F.T.N.B.nodeActionsGraph" cpt
+nodeActionsGraphCpt = R2.hooksComponent thisModule "nodeActionsGraph" cpt
   where
     cpt { id, graphVersions, session, triggerRefresh } _ = do
       pure $ H.div { className: "node-actions" } [
@@ -47,7 +50,7 @@ graphUpdateButton :: Record GraphUpdateButtonProps -> R.Element
 graphUpdateButton p = R.createElement graphUpdateButtonCpt p []
 
 graphUpdateButtonCpt :: R.Component GraphUpdateButtonProps
-graphUpdateButtonCpt = R.hooksComponent "G.C.F.T.N.B.graphUpdateButton" cpt
+graphUpdateButtonCpt = R2.hooksComponent thisModule "graphUpdateButton" cpt
   where
     cpt { id, session, triggerRefresh } _ = do
       enabled <- R.useState' true
@@ -83,7 +86,7 @@ nodeActionsNodeList :: Record NodeActionsNodeListProps -> R.Element
 nodeActionsNodeList p = R.createElement nodeActionsNodeListCpt p []
 
 nodeActionsNodeListCpt :: R.Component NodeActionsNodeListProps
-nodeActionsNodeListCpt = R.hooksComponent "G.C.F.T.N.B.nodeActionsNodeList" cpt
+nodeActionsNodeListCpt = R2.hooksComponent thisModule "nodeActionsNodeList" cpt
   where
     cpt props _ = do
       pure $ H.div { className: "node-actions" } [
@@ -102,7 +105,7 @@ nodeListUpdateButton :: Record NodeListUpdateButtonProps -> R.Element
 nodeListUpdateButton p = R.createElement nodeListUpdateButtonCpt p []
 
 nodeListUpdateButtonCpt :: R.Component NodeListUpdateButtonProps
-nodeListUpdateButtonCpt = R.hooksComponent "G.C.F.T.N.B.nodeListUpdateButton" cpt
+nodeListUpdateButtonCpt = R2.hooksComponent thisModule "nodeListUpdateButton" cpt
   where
     cpt { listId, nodeId, nodeType, session, triggerRefresh } _ = do
       enabled <- R.useState' true

src/Gargantext/Components/Graph.purs

@@ -20,6 +20,9 @@ import Gargantext.Components.GraphExplorer.Types as GET
 import Gargantext.Hooks.Sigmax as Sigmax
 import Gargantext.Hooks.Sigmax.Types as SigmaxTypes
 import Gargantext.Hooks.Sigmax.Sigma as Sigma
+import Gargantext.Utils.Reactix as R2
+
+thisModule = "Gargantext.Components.Graph"
 
 type OnProps  = ()
 
@@ -44,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.hooksComponent "G.C.Graph" cpt
+graphCpt = R2.hooksComponent thisModule "graph" cpt
   where
     cpt props _ = do
       stageHooks props

src/Gargantext/Components/GraphExplorer.purs

@@ -37,6 +37,8 @@ import Gargantext.Types as Types
 import Gargantext.Utils.Range as Range
 import Gargantext.Utils.Reactix as R2
 
+thisModule = "Gargantext.Components.GraphExplorer"
+
 type LayoutProps =
   ( frontends :: Frontends
   , graphId :: GET.GraphId
@@ -45,7 +47,6 @@ type LayoutProps =
   , session :: Session
   , sessions :: Sessions
   , showLogin :: R.State Boolean
-  --, treeReload :: R.State Int
   )
 
 type Props = (
@@ -61,7 +62,7 @@ explorerLayout :: Record LayoutProps -> R.Element
 explorerLayout props = R.createElement explorerLayoutCpt props []
 
 explorerLayoutCpt :: R.Component LayoutProps
-explorerLayoutCpt = R.hooksComponent "G.C.GraphExplorer.explorerLayout" cpt
+explorerLayoutCpt = R2.hooksComponent thisModule "explorerLayout" cpt
   where
     cpt props _ = do
       graphVersion <- R.useState' 0
@@ -71,8 +72,8 @@ explorerLayoutCpt = R.hooksComponent "G.C.GraphExplorer.explorerLayout" cpt
 explorerLayoutView :: R.State Int -> Record LayoutProps -> R.Element
 explorerLayoutView graphVersion p = R.createElement el p []
   where
-    el = R.hooksComponent "G.C.GE.explorerLayoutView" cpt
-    cpt props@{graphId, session} _ = do
+    el = R2.hooksComponent thisModule "explorerLayoutView" cpt
+    cpt props@{ graphId, session } _ = do
       useLoader graphId (getNodes session graphVersion) handler
       where
         handler loaded =
@@ -86,7 +87,7 @@ explorer :: Record Props -> R.Element
 explorer props = R.createElement explorerCpt props []
 
 explorerCpt :: R.Component Props
-explorerCpt = R.hooksComponent "G.C.GraphExplorer.explorer" cpt
+explorerCpt = R2.hooksComponent thisModule "explorer" cpt
   where
     cpt props@{ frontends
               , graph
@@ -99,7 +100,6 @@ explorerCpt = R.hooksComponent "G.C.GraphExplorer.explorer" cpt
               , session
               , sessions
               , showLogin
-              --, treeReload
               } _ = do
 
       let startForceAtlas = maybe true (\(GET.MetaData { startForceAtlas }) -> startForceAtlas) mMetaData
@@ -146,43 +146,52 @@ explorerCpt = R.hooksComponent "G.C.GraphExplorer.explorer" cpt
                   , col [ spaces [ Toggle.sidebarToggleButton controls.showSidePanel ]]
                   ], R2.row
             [ outer
-              [ inner
+              [ inner handed
                 [ rowControls [ Controls.controls controls ]
-                , R2.row [
-                        tree { frontends
-                             , handed
-                             , mCurrentRoute
-                             , reload: treeReload
-                             , sessions
-                             , show: fst controls.showTree
-                             , showLogin: snd showLogin }
-                      , RH.div { ref: graphRef, id: "graph-view", className: "col-md-12" } []  -- graph container
-                      , graphView { controls
-                                  , elRef: graphRef
-                                  , graphId
-                                  , graph
-                                  , hyperdataGraph
-                                  , mMetaData
-                                  , multiSelectEnabledRef
-                                  }
-                      , mSidebar mMetaData { frontends
-                                           , graph
-                                           , graphId
-                                           , graphVersion
-                                           , removedNodeIds : controls.removedNodeIds
-                                           , session
-                                           , selectedNodeIds: controls.selectedNodeIds
-                                           , showSidePanel  :   controls.showSidePanel
-                                           , treeReload
-                                           }
-                      ]
+                , R2.row $ mainLayout handed $
+                    tree { frontends
+                          , handed
+                          , mCurrentRoute
+                          , reload: treeReload
+                          , sessions
+                          , show: fst controls.showTree
+                          , showLogin: snd showLogin }
+                    /\
+                    RH.div { ref: graphRef, id: "graph-view", className: "col-md-12" } []
+                    /\
+                    graphView { controls
+                              , elRef: graphRef
+                              , graphId
+                              , graph
+                              , hyperdataGraph
+                              , mMetaData
+                              , multiSelectEnabledRef
+                              }
+                    /\
+                    mSidebar mMetaData { frontends
+                                        , graph
+                                        , graphId
+                                        , graphVersion
+                                        , removedNodeIds : controls.removedNodeIds
+                                        , session
+                                        , selectedNodeIds: controls.selectedNodeIds
+                                        , showSidePanel  :   controls.showSidePanel
+                                        , treeReload
+                                        }
                 ]
               ]
             ]
           ]
 
+    mainLayout Types.RightHanded (tree' /\ gc /\ gv /\ sdb) = [tree', gc, gv, sdb]
+    mainLayout Types.LeftHanded (tree' /\ gc /\ gv /\ sdb) = [sdb, gc, gv, tree']
+
     outer = RH.div { className: "col-md-12" }
-    inner = RH.div { className: "container-fluid", style: { paddingTop: "90px" } }
+    inner h = RH.div { className: "container-fluid " <> hClass, style: { paddingTop: "90px" } }
+      where
+        hClass = case h of
+          Types.LeftHanded -> "lefthanded"
+          Types.RightHanded -> "righthanded"
     rowToggle  = RH.div { id: "toggle-container" }
     rowControls = RH.div { id: "controls-container" }
     col       = RH.div { className: "col-md-4" }
@@ -243,7 +252,7 @@ graphView :: Record GraphProps -> R.Element
 graphView props = R.createElement graphViewCpt props []
 
 graphViewCpt :: R.Component GraphProps
-graphViewCpt = R.hooksComponent "GraphView" cpt
+graphViewCpt = R2.hooksComponent thisModule "graphView" cpt
   where
     cpt { controls
         , elRef

src/Gargantext/Components/GraphExplorer/Button.purs

@@ -27,6 +27,9 @@ import Gargantext.Components.GraphExplorer.Utils as GEU
 import Gargantext.Hooks.Sigmax as Sigmax
 import Gargantext.Hooks.Sigmax.Sigma as Sigma
 import Gargantext.Sessions (Session)
+import Gargantext.Utils.Reactix as R2
+
+thisModule = "Gargantext.Components.GraphExplorer.Button"
 
 type Props = (
     onClick :: forall e. e -> Effect Unit
@@ -37,7 +40,7 @@ simpleButton :: Record Props -> R.Element
 simpleButton props = R.createElement simpleButtonCpt props []
 
 simpleButtonCpt :: R.Component Props
-simpleButtonCpt = R.hooksComponent "SimpleButton" cpt
+simpleButtonCpt = R2.hooksComponent thisModule "simpleButton" cpt
   where
     cpt {onClick, text} _ = do
       pure $

src/Gargantext/Components/GraphExplorer/Controls.purs

@@ -33,6 +33,8 @@ import Gargantext.Sessions (Session)
 import Gargantext.Utils.Range as Range
 import Gargantext.Utils.Reactix as R2
 
+thisModule = "Gargantext.Components.GraphExplorer.Controls"
+
 type Controls =
   ( edgeConfluence :: R.State Range.NumberRange
   , edgeWeight :: R.State Range.NumberRange
@@ -74,7 +76,7 @@ controls :: Record Controls -> R.Element
 controls props = R.createElement controlsCpt props []
 
 controlsCpt :: R.Component Controls
-controlsCpt = R.hooksComponent "GraphControls" cpt
+controlsCpt = R2.hooksComponent thisModule "controls" cpt
   where
     cpt props _ = do
       localControls <- initialLocalControls

src/Gargantext/Components/GraphExplorer/ControlsToggleButton.purs

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

src/Gargantext/Components/GraphExplorer/Legend.purs

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

src/Gargantext/Components/GraphExplorer/RangeControl.purs

@@ -13,6 +13,9 @@ import Reactix.DOM.HTML as H
 
 import Gargantext.Components.RangeSlider as RS
 import Gargantext.Utils.Range as Range
+import Gargantext.Utils.Reactix as R2
+
+thisModule = "Gargantext.Components.GraphExplorer.RangeControl"
 
 type Props = (
     caption :: String
@@ -23,7 +26,7 @@ rangeControl :: Record Props -> R.Element
 rangeControl props = R.createElement rangeControlCpt props []
 
 rangeControlCpt :: R.Component Props
-rangeControlCpt = R.hooksComponent "RangeButton" cpt
+rangeControlCpt = R2.hooksComponent thisModule "rangeButton" cpt
   where
     cpt {caption, sliderProps} _ = do
       pure $

src/Gargantext/Components/GraphExplorer/Search.purs

@@ -13,8 +13,11 @@ import Reactix as R
 import Reactix.DOM.HTML as H
 
 import Gargantext.Components.InputWithAutocomplete (inputWithAutocomplete)
-import Gargantext.Utils (queryMatchesLabel)
 import Gargantext.Hooks.Sigmax.Types as SigmaxT
+import Gargantext.Utils (queryMatchesLabel)
+import Gargantext.Utils.Reactix as R2
+
+thisModule = "Gargantext.Components.GraphExplorer.Search"
 
 type Props = (
     graph           :: SigmaxT.SGraph
@@ -34,7 +37,7 @@ nodeSearchControl :: Record Props -> R.Element
 nodeSearchControl props = R.createElement sizeButtonCpt props []
 
 sizeButtonCpt :: R.Component Props
-sizeButtonCpt = R.hooksComponent "NodeSearchControl" cpt
+sizeButtonCpt = R2.hooksComponent thisModule "nodeSearchControl" cpt
   where
     cpt {graph, multiSelectEnabled, selectedNodeIds} _ = do
       search@(search' /\ setSearch) <- R.useState' ""

src/Gargantext/Components/GraphExplorer/Sidebar.purs

@@ -14,6 +14,12 @@ import Data.Tuple.Nested ((/\))
 import Effect (Effect)
 import Effect.Aff (Aff, launchAff_)
 import Effect.Class (liftEffect)
+import Reactix as R
+import Reactix.DOM.HTML as RH
+import Reactix.DOM.HTML as H
+
+import Gargantext.Prelude
+
 import Gargantext.Components.Search (SearchType(..), SearchQuery(..))
 import Gargantext.Components.GraphExplorer.Types  as GET
 import Gargantext.Components.GraphExplorer.Types  (SidePanelState(..), SideTab(..))
@@ -28,10 +34,8 @@ import Gargantext.Sessions (Session)
 import Gargantext.Types (CTabNgramType, TabSubType(..), TabType(..), TermList(..), modeTabType)
 import Gargantext.Utils.Reactix as R2
 import Partial.Unsafe (unsafePartial)
-import Gargantext.Prelude
-import Reactix as R
-import Reactix.DOM.HTML as RH
-import Reactix.DOM.HTML as H
+
+thisModule = "Gargantext.Components.GraphExplorer.Sidebar"
 
 type Props =
   ( frontends       :: Frontends
@@ -50,7 +54,7 @@ sidebar :: Record Props -> R.Element
 sidebar props = R.createElement sidebarCpt props []
 
 sidebarCpt :: R.Component Props
-sidebarCpt = R.hooksComponent "Sidebar" cpt
+sidebarCpt = R2.hooksComponent thisModule "sidebar" cpt
   where
     cpt {showSidePanel: (GET.Closed /\ _)} _children = do
       pure $ RH.div {} []

src/Gargantext/Components/GraphExplorer/SlideButton.purs

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

src/Gargantext/Components/GraphExplorer/ToggleButton.purs

@@ -21,6 +21,9 @@ import Reactix.DOM.HTML as H
 
 import Gargantext.Components.GraphExplorer.Types as GET
 import Gargantext.Hooks.Sigmax.Types as SigmaxTypes
+import Gargantext.Utils.Reactix as R2
+
+thisModule = "Gargantext.Components.GraphExplorer.ToggleButton"
 
 type Props = (
     state :: R.State Boolean
@@ -33,7 +36,7 @@ toggleButton :: Record Props -> R.Element
 toggleButton props = R.createElement toggleButtonCpt props []
 
 toggleButtonCpt :: R.Component Props
-toggleButtonCpt = R.hooksComponent "ToggleButton" cpt
+toggleButtonCpt = R2.hooksComponent thisModule "toggleButton" cpt
   where
     cpt {state, onMessage, offMessage, onClick} _ = do
       let (toggled /\ _) = state
@@ -64,7 +67,7 @@ edgesToggleButton :: Record EdgesButtonProps -> R.Element
 edgesToggleButton props = R.createElement edgesToggleButtonCpt props []
 
 edgesToggleButtonCpt :: R.Component EdgesButtonProps
-edgesToggleButtonCpt = R.hooksComponent "EdgesToggleButton" cpt
+edgesToggleButtonCpt = R2.hooksComponent thisModule "edgesToggleButton" cpt
   where
     cpt {state: (state /\ setState)} _ = do
       pure $
@@ -105,7 +108,7 @@ pauseForceAtlasButton :: Record ForceAtlasProps -> R.Element
 pauseForceAtlasButton props = R.createElement pauseForceAtlasButtonCpt props []
 
 pauseForceAtlasButtonCpt :: R.Component ForceAtlasProps
-pauseForceAtlasButtonCpt = R.hooksComponent "ForceAtlasToggleButton" cpt
+pauseForceAtlasButtonCpt = R2.hooksComponent thisModule "forceAtlasToggleButton" cpt
   where
     cpt {state: (state /\ setState)} _ = do
       pure $
@@ -134,7 +137,7 @@ treeToggleButton state =
 sidebarToggleButton :: R.State GET.SidePanelState -> R.Element
 sidebarToggleButton (state /\ setState) = R.createElement el {} []
   where
-    el = R.hooksComponent "SidebarToggleButton" cpt
+    el = R2.hooksComponent thisModule "sidebarToggleButton" cpt
     cpt {} _ = do
       pure $
         H.span {}

src/Gargantext/Components/InputWithAutocomplete.purs

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

src/Gargantext/Components/InputWithEnter.purs

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

src/Gargantext/Components/Loader.purs

@@ -7,8 +7,10 @@ import Effect.Aff (Aff)
 import Effect.Class (liftEffect)
 import Reactix as R
 
-import Gargantext.Utils.Reactix as R2
 import Gargantext.Components.LoadingSpinner (loadingSpinner)
+import Gargantext.Utils.Reactix as R2
+
+thisModule = "Gargantext.Components.Loader"
 
 type Props path loaded =
   ( path  :: path
@@ -23,7 +25,7 @@ loader path load paint =
   R.createElement loaderCpt {path,load,paint} []
 
 loaderCpt :: forall path loaded. R.Component (Props path loaded)
-loaderCpt = R.hooksComponent "G.C.Loader" cpt where
+loaderCpt = R2.hooksComponent thisModule "loader" cpt where
   cpt {path, load, paint} _ = do
     (loaded /\ setLoaded) <- R.useState' Nothing
     R.useEffect3 path load paint $ do

src/Gargantext/Components/Login.purs

@@ -14,6 +14,10 @@ import Data.Tuple.Nested ((/\))
 import Effect (Effect)
 import Effect.Aff (launchAff_)
 import Effect.Class (liftEffect)
+import Prelude (Unit, bind, const, discard, map, pure, show, ($), (&&), (*>), (/=), (<$>), (<>), (==), (>))
+import Reactix as R
+import Reactix.DOM.HTML as H
+
 import Gargantext.Components.Forest.Tree.Node.Tools (checkbox)
 import Gargantext.Components.Forms (clearfix, cardBlock, cardGroup, center, formGroup)
 import Gargantext.Components.Login.Types (AuthRequest(..))
@@ -22,9 +26,8 @@ import Gargantext.Sessions (Session, Sessions(..), postAuthRequest, unSessions)
 import Gargantext.Sessions as Sessions
 import Gargantext.Utils (csrfMiddlewareToken)
 import Gargantext.Utils.Reactix as R2
-import Prelude (Unit, bind, const, discard, map, pure, show, ($), (&&), (*>), (/=), (<$>), (<>), (==), (>))
-import Reactix as R
-import Reactix.DOM.HTML as H
+
+thisModule = "Gargantext.Components.Login"
 
 -- TODO: ask for login (modal) or account creation after 15 mn when user
 -- is not logged and has made one search at least
@@ -41,7 +44,7 @@ modal :: Record ModalProps -> R.Element -> R.Element
 modal props child = R.createElement modalCpt props [ child ]
 
 modalCpt :: R.Component ModalProps
-modalCpt = R.hooksComponent "G.C.Login.modal" cpt where
+modalCpt = R2.hooksComponent thisModule "modal" cpt where
   cpt {visible} children = do
     R.createPortal elems <$> R2.getPortalHost
     where
@@ -78,7 +81,7 @@ login :: Record Props -> R.Element
 login props = R.createElement loginCpt props []
 
 loginCpt :: R.Component Props
-loginCpt = R.hooksComponent "G.C.Login.login" cpt
+loginCpt = R2.hooksComponent thisModule "login" cpt
   where
     cpt props@{backends, sessions, visible} _ = do
       backend <- R.useState' Nothing
@@ -155,7 +158,7 @@ form :: Record FormProps -> R.Element
 form props = R.createElement formCpt props []
 
 formCpt :: R.Component FormProps
-formCpt = R.hooksComponent "G.C.Login.form" cpt where
+formCpt = R2.hooksComponent thisModule "form" cpt where
   cpt :: Record FormProps -> Array R.Element -> R.Hooks R.Element
   cpt props@{backend, sessions, visible} _ = do
     error    <- R.useState' ""

src/Gargantext/Components/Modal.purs

@@ -14,15 +14,18 @@ import DOM.Simple.Document ( document )
 import Effect (Effect)
 import Reactix as R
 import Reactix.DOM.HTML as H
+
 import Gargantext.Utils.Reactix as R2
 
+thisModule = "Gargantext.Components.Modal"
+
 type Props = ( setVisible :: R2.Setter Boolean )
 
 modal :: Record Props -> Array R.Element -> R.Element
 modal = R.createElement modalCpt
 
 modalCpt :: R.Component Props
-modalCpt = R.hooksComponent "Modal" cpt
+modalCpt = R2.hooksComponent thisModule "modal" cpt
   where
     cpt {setVisible} children = do
       host <- R2.getPortalHost

src/Gargantext/Components/NgramsTable.purs

@@ -43,6 +43,8 @@ import Gargantext.Utils.CacheAPI as GUC
 import Gargantext.Utils.List (sortWith) as L
 import Gargantext.Utils.Reactix as R2
 
+thisModule = "Gargantext.Components.NgramsTable"
+
 type State' =
   CoreState
   ( ngramsParent     :: Maybe NgramsTerm -- Nothing means we are not currently grouping terms
@@ -135,7 +137,7 @@ tableContainerCpt { dispatch
                   , ngramsTable: ngramsTableCache
                   , path: {searchQuery, termListFilter, termSizeFilter} /\ setPath
                   , tabNgramType
-                  } = R.hooksComponent "G.C.NT.tableContainer" cpt
+                  } = R2.hooksComponent thisModule "tableContainer" cpt
   where
     cpt props _ = do
       pure $ H.div {className: "container-fluid"} [
@@ -282,7 +284,7 @@ loadedNgramsTable :: Record Props -> R.Element
 loadedNgramsTable p = R.createElement loadedNgramsTableCpt p []
 
 loadedNgramsTableCpt :: R.Component Props
-loadedNgramsTableCpt = R.hooksComponent "G.C.NT.loadedNgramsTable" cpt
+loadedNgramsTableCpt = R2.hooksComponent thisModule "loadedNgramsTable" cpt
   where
     cpt { path: path@(path'@{searchQuery, scoreType, params, termListFilter, termSizeFilter} /\ setPath)
         , state: (state@{ ngramsChildren
@@ -492,7 +494,7 @@ mainNgramsTable :: Record MainNgramsTableProps -> R.Element
 mainNgramsTable props = R.createElement mainNgramsTableCpt props []
 
 mainNgramsTableCpt :: R.Component MainNgramsTableProps
-mainNgramsTableCpt = R.hooksComponent "G.C.NT.mainNgramsTable" cpt
+mainNgramsTableCpt = R2.hooksComponent thisModule "mainNgramsTable" cpt
   where
     cpt props@{nodeId, defaultListId, session, tabNgramType, tabType, withAutoUpdate} _ = do
       let path = initialPageParams session nodeId [defaultListId] tabType
@@ -549,7 +551,7 @@ mainNgramsTablePaint :: Record MainNgramsTablePaintProps -> R.Element
 mainNgramsTablePaint p = R.createElement mainNgramsTablePaintCpt p []
 
 mainNgramsTablePaintCpt :: R.Component MainNgramsTablePaintProps
-mainNgramsTablePaintCpt = R.hooksComponent "G.C.NT.mainNgramsTablePaint" cpt
+mainNgramsTablePaintCpt = R2.hooksComponent thisModule "mainNgramsTablePaint" cpt
   where
     cpt {path, tabNgramType, versioned, withAutoUpdate} _ = do
       R.useEffect' $ do

src/Gargantext/Components/NgramsTable/Components.purs

@@ -22,6 +22,8 @@ import Gargantext.Components.Table as Tbl
 import Gargantext.Types as T
 import Gargantext.Utils.Reactix as R2
 
+thisModule = "Gargantext.Components.NgramsTable.Components"
+
 
 type SearchInputProps =
   (
@@ -34,7 +36,7 @@ searchInput :: Record SearchInputProps -> R.Element
 searchInput props = R.createElement searchInputCpt props []
 
 searchInputCpt :: R.Component SearchInputProps
-searchInputCpt = R.hooksComponent "G.C.NT.searchInput" cpt
+searchInputCpt = R2.hooksComponent thisModule "searchInput" cpt
   where
     cpt { onSearch, searchQuery } _ = do
       pure $ H.div { className: "input-group" } [
@@ -61,7 +63,7 @@ selectionCheckbox :: Record SelectionCheckboxProps -> R.Element
 selectionCheckbox props = R.createElement selectionCheckboxCpt props []
 
 selectionCheckboxCpt :: R.Component SelectionCheckboxProps
-selectionCheckboxCpt = R.hooksComponent "G.C.NT.selectionCheckbox" cpt
+selectionCheckboxCpt = R2.hooksComponent thisModule "selectionCheckbox" cpt
   where
     cpt { allNgramsSelected, dispatch, ngramsSelection } _ = do
       ref <- R.useRef null
@@ -96,7 +98,7 @@ renderNgramsTree :: Record RenderNgramsTree -> R.Element
 renderNgramsTree p = R.createElement renderNgramsTreeCpt p []
 
 renderNgramsTreeCpt :: R.Component RenderNgramsTree
-renderNgramsTreeCpt = R.hooksComponent "G.C.NT.renderNgramsTree" cpt
+renderNgramsTreeCpt = R2.hooksComponent thisModule "renderNgramsTree" cpt
   where
     cpt { ngramsTable, ngrams, ngramsStyle, ngramsClick, ngramsEdit } _ =
       pure $ H.ul {} [
@@ -127,7 +129,7 @@ tree :: Record TreeProps -> R.Element
 tree p = R.createElement treeCpt p []
 
 treeCpt :: R.Component TreeProps
-treeCpt = R.hooksComponent "G.C.NT.tree" cpt
+treeCpt = R2.hooksComponent thisModule "tree" cpt
   where
     cpt params@{ ngramsClick, ngramsDepth, ngramsEdit, ngramsStyle, ngramsTable } _ =
       pure $
@@ -172,7 +174,7 @@ renderNgramsItem :: Record RenderNgramsItem -> R.Element
 renderNgramsItem p = R.createElement renderNgramsItemCpt p []
 
 renderNgramsItemCpt :: R.Component RenderNgramsItem
-renderNgramsItemCpt = R.hooksComponent "G.C.NT.renderNgramsItem" cpt
+renderNgramsItemCpt = R2.hooksComponent thisModule "renderNgramsItem" cpt
   where
     cpt { dispatch
         , ngrams

src/Gargantext/Components/Nodes/Annuaire.purs

@@ -8,6 +8,10 @@ import Data.Maybe (Maybe(..), maybe, fromMaybe)
 import Data.Tuple (fst, snd)
 import Data.Tuple.Nested ((/\))
 import Effect.Aff (Aff)
+import Prelude (bind, const, identity, pure, ($), (<$>), (<>))
+import Reactix as R
+import Reactix.DOM.HTML as H
+
 import Gargantext.Components.Nodes.Annuaire.User.Contacts.Types as CT
 import Gargantext.Components.Table as T
 import Gargantext.Ends (url, Frontends)
@@ -16,9 +20,9 @@ import Gargantext.Routes (SessionRoute(..))
 import Gargantext.Routes as Routes
 import Gargantext.Sessions (Session, sessionId, get)
 import Gargantext.Types (NodeType(..), AffTableResult, TableResult)
-import Prelude (bind, const, identity, pure, ($), (<$>), (<>))
-import Reactix as R
-import Reactix.DOM.HTML as H
+import Gargantext.Utils.Reactix as R2
+
+thisModule = "Gargantext.Components.Nodes.Annuaire"
 
 newtype IndividuView =
   CorpusView
@@ -42,7 +46,7 @@ annuaireLayout :: Record LayoutProps -> R.Element
 annuaireLayout props = R.createElement annuaireLayoutCpt props []
 
 annuaireLayoutCpt :: R.Component LayoutProps
-annuaireLayoutCpt = R.hooksComponent "G.C.N.A.annuaireLayout" cpt
+annuaireLayoutCpt = R2.hooksComponent thisModule "annuaireLayout" cpt
   where
     cpt { frontends, nodeId, session } _ = do
       let sid = sessionId session
@@ -58,7 +62,7 @@ annuaireLayoutWithKey :: Record KeyLayoutProps -> R.Element
 annuaireLayoutWithKey props = R.createElement annuaireLayoutWithKeyCpt props []
 
 annuaireLayoutWithKeyCpt :: R.Component KeyLayoutProps
-annuaireLayoutWithKeyCpt = R.hooksComponent "G.C.N.A.annuaireLayoutWithKey" cpt
+annuaireLayoutWithKeyCpt = R2.hooksComponent thisModule "annuaireLayoutWithKey" cpt
   where
     cpt { frontends, nodeId, session } _ = do
       path <- R.useState' nodeId
@@ -78,7 +82,7 @@ annuaire props = R.createElement annuaireCpt props []
 
 -- Abuses closure to work around the Loader
 annuaireCpt :: R.Component AnnuaireProps
-annuaireCpt = R.hooksComponent "G.P.Annuaire.annuaire" cpt
+annuaireCpt = R2.hooksComponent thisModule "annuaire" cpt
   where
     cpt {session, path, info: info@(AnnuaireInfo {name, date: date'}), frontends} _ = do
       pagePath <- R.useState' $ initialPagePath (fst path)
@@ -111,7 +115,7 @@ pageLayout :: Record PageLayoutProps -> R.Element
 pageLayout props = R.createElement pageLayoutCpt props []
 
 pageLayoutCpt :: R.Component PageLayoutProps
-pageLayoutCpt = R.hooksComponent "G.P.Annuaire.pageLayout" cpt
+pageLayoutCpt = R2.hooksComponent thisModule "pageLayout" cpt
   where
     cpt {info, frontends, pagePath, session} _ = do
       useLoader (fst pagePath) (loadPage session) $
@@ -129,7 +133,7 @@ page :: Record PageProps -> R.Element
 page props = R.createElement pageCpt props []
 
 pageCpt :: R.Component PageProps
-pageCpt = R.hooksComponent "LoadedAnnuairePage" cpt
+pageCpt = R2.hooksComponent thisModule "page" cpt
   where
     cpt { session, pagePath, frontends
         , table: ({count: totalRecords, docs})} _ = do
@@ -162,7 +166,7 @@ contactCells :: Record ContactCellsProps -> R.Element
 contactCells p = R.createElement contactCellsCpt p []
 
 contactCellsCpt :: R.Component ContactCellsProps
-contactCellsCpt = R.hooksComponent "G.C.N.A.contactCells" cpt
+contactCellsCpt = R2.hooksComponent thisModule "contactCells" cpt
   where
     cpt { annuaireId
         , contact: (CT.NodeContact { id, hyperdata: (CT.HyperdataContact {who : Nothing}) })

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

@@ -24,6 +24,9 @@ import Gargantext.Prelude (Unit, bind, const, discard, pure, show, unit, ($), (+
 import Gargantext.Routes as Routes
 import Gargantext.Sessions (Session, get, put, sessionId)
 import Gargantext.Types (NodeType(..))
+import Gargantext.Utils.Reactix as R2
+
+thisModule = "Gargantext.Components.Nodes.Annuaire.User.Contacts"
 
 display :: String -> Array R.Element -> R.Element
 display title elems =
@@ -80,7 +83,7 @@ contactInfoItem :: Record ContactInfoItemProps -> R.Element
 contactInfoItem props = R.createElement contactInfoItemCpt props []
 
 contactInfoItemCpt :: R.Component ContactInfoItemProps
-contactInfoItemCpt = R.hooksComponent "G.C.N.A.U.C.contactInfoItem" cpt
+contactInfoItemCpt = R2.hooksComponent thisModule "contactInfoItem" cpt
   where
     cpt {hyperdata, label, lens, onUpdateHyperdata, placeholder} _ = do
       isEditing <- R.useState' false
@@ -154,7 +157,7 @@ userLayout :: Record LayoutProps -> R.Element
 userLayout props = R.createElement userLayoutCpt props []
 
 userLayoutCpt :: R.Component LayoutProps
-userLayoutCpt = R.hooksComponent "G.C.N.A.U.C.userLayout" cpt
+userLayoutCpt = R2.hooksComponent thisModule "userLayout" cpt
   where
     cpt { frontends, nodeId, session } _ = do
       let sid = sessionId session
@@ -165,7 +168,7 @@ userLayoutWithKey :: Record KeyLayoutProps -> R.Element
 userLayoutWithKey props = R.createElement userLayoutWithKeyCpt props []
 
 userLayoutWithKeyCpt :: R.Component KeyLayoutProps
-userLayoutWithKeyCpt = R.hooksComponent "G.C.N.A.U.C.userLayoutWithKey" cpt
+userLayoutWithKeyCpt = R2.hooksComponent thisModule "userLayoutWithKey" cpt
   where
     cpt { frontends, nodeId, session } _ = do
       reload <- R.useState' 0
@@ -214,7 +217,7 @@ annuaireUserLayout :: Record AnnuaireLayoutProps -> R.Element
 annuaireUserLayout props = R.createElement annuaireUserLayoutCpt props []
 
 annuaireUserLayoutCpt :: R.Component AnnuaireLayoutProps
-annuaireUserLayoutCpt = R.hooksComponent "G.C.Nodes.Annuaire.User.Contacts.annuaireUserLayout" cpt
+annuaireUserLayoutCpt = R2.hooksComponent thisModule "annuaireUserLayout" cpt
   where
     cpt {annuaireId, frontends, nodeId, session} _ = do
       useLoader nodeId (getAnnuaireContact session annuaireId) $

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

@@ -15,6 +15,9 @@ import Gargantext.Components.Nodes.Annuaire.User.Contacts.Types (ContactData)
 import Gargantext.Ends (Frontends)
 import Gargantext.Sessions (Session)
 import Gargantext.Types (TabType(..), TabSubType(..), CTabNgramType(..), PTabNgramType(..))
+import Gargantext.Utils.Reactix as R2
+
+thisModule = "Gargantext.Components.Nodes.Annuaire.User.Contacts.Tabs"
 
 
 data Mode = Patents | Books | Communication
@@ -47,7 +50,7 @@ tabs :: Record TabsProps -> R.Element
 tabs props = R.createElement tabsCpt props []
 
 tabsCpt :: R.Component TabsProps
-tabsCpt = R.hooksComponent "G.P.Annuaire.User.Contacts.Tabs.tabs" cpt
+tabsCpt = R2.hooksComponent thisModule "tabs" cpt
   where
     cpt {frontends, nodeId, contactData: {defaultListId}, session} _ = do
       active <- R.useState' 0

src/Gargantext/Components/Nodes/Corpus.purs

@@ -30,6 +30,8 @@ import Gargantext.Types (NodeType(..), AffTableResult)
 import Gargantext.Utils.Crypto as Crypto
 import Gargantext.Utils.Reactix as R2
 
+thisModule = "Gargantext.Components.Nodes.Corpus"
+
 type Props =
   ( nodeId  :: Int
   , session :: Session
@@ -46,7 +48,7 @@ corpusLayout :: Record Props -> R.Element
 corpusLayout props = R.createElement corpusLayoutCpt props []
 
 corpusLayoutCpt :: R.Component Props
-corpusLayoutCpt = R.hooksComponent "G.C.N.C.corpusLayout" cpt
+corpusLayoutCpt = R2.hooksComponent thisModule "corpusLayout" cpt
   where
     cpt { nodeId, session } _ = do
       let sid = sessionId session
@@ -58,7 +60,7 @@ corpusLayoutWithKey :: Record KeyProps -> R.Element
 corpusLayoutWithKey props = R.createElement corpusLayoutWithKeyCpt props []
 
 corpusLayoutWithKeyCpt :: R.Component KeyProps
-corpusLayoutWithKeyCpt = R.hooksComponent "G.C.N.C.corpusLayoutWithKey" cpt
+corpusLayoutWithKeyCpt = R2.hooksComponent thisModule "corpusLayoutWithKey" cpt
   where
     cpt { nodeId, session } _ = do
       reload <- R.useState' 0
@@ -82,7 +84,7 @@ corpusLayoutView :: Record ViewProps -> R.Element
 corpusLayoutView props = R.createElement corpusLayoutViewCpt props []
 
 corpusLayoutViewCpt :: R.Component ViewProps
-corpusLayoutViewCpt = R.hooksComponent "G.C.N.C.corpusLayoutView" cpt
+corpusLayoutViewCpt = R2.hooksComponent thisModule "corpusLayoutView" cpt
   where
     cpt {corpus: (NodePoly {hyperdata: Hyperdata {fields}}), nodeId, reload, session} _ = do
       let fieldsWithIndex = List.mapWithIndex (\idx -> \t -> Tuple idx t) fields
@@ -146,7 +148,7 @@ fieldsCodeEditor :: Record FieldsCodeEditorProps -> R.Element
 fieldsCodeEditor props = R.createElement fieldsCodeEditorCpt props []
 
 fieldsCodeEditorCpt :: R.Component FieldsCodeEditorProps
-fieldsCodeEditorCpt = R.hooksComponent "G.C.N.C.fieldsCodeEditorCpt" cpt
+fieldsCodeEditorCpt = R2.hooksComponent thisModule "fieldsCodeEditorCpt" cpt
   where
     cpt {nodeId, fields: fS@(fields /\ _), session} _ = do
       masterKey <- R.useState' 0
@@ -215,7 +217,7 @@ fieldCodeEditorWrapper :: Record FieldCodeEditorProps -> R.Element
 fieldCodeEditorWrapper props = R.createElement fieldCodeEditorWrapperCpt props []
 
 fieldCodeEditorWrapperCpt :: R.Component FieldCodeEditorProps
-fieldCodeEditorWrapperCpt = R.hooksComponent "G.C.N.C.fieldCodeEditorWrapperCpt" cpt
+fieldCodeEditorWrapperCpt = R2.hooksComponent thisModule "fieldCodeEditorWrapperCpt" cpt
   where
     cpt props@{canMoveDown, canMoveUp, field: Field {name, typ}, onMoveDown, onMoveUp, onRemove, onRename} _ = do
       pure $ H.div { className: "row panel panel-default" } [
@@ -263,7 +265,7 @@ renameable :: Record RenameableProps -> R.Element
 renameable props = R.createElement renameableCpt props []
 
 renameableCpt :: R.Component RenameableProps
-renameableCpt = R.hooksComponent "G.C.N.C.renameableCpt" cpt
+renameableCpt = R2.hooksComponent thisModule "renameableCpt" cpt
   where
     cpt {onRename, text} _ = do
       isEditing <- R.useState' false
@@ -293,7 +295,7 @@ renameableText :: Record RenameableTextProps -> R.Element
 renameableText props = R.createElement renameableTextCpt props []
 
 renameableTextCpt :: R.Component RenameableTextProps
-renameableTextCpt = R.hooksComponent "G.C.N.C.renameableTextCpt" cpt
+renameableTextCpt = R2.hooksComponent thisModule "renameableTextCpt" cpt
   where
     cpt {isEditing: (false /\ setIsEditing), state: (text /\ _)} _ = do
       pure $ H.div {} [
@@ -328,7 +330,7 @@ fieldCodeEditor :: Record FieldCodeEditorProps -> R.Element
 fieldCodeEditor props = R.createElement fieldCodeEditorCpt props []
 
 fieldCodeEditorCpt :: R.Component FieldCodeEditorProps
-fieldCodeEditorCpt = R.hooksComponent "G.C.N.C.fieldCodeEditorCpt" cpt
+fieldCodeEditorCpt = R2.hooksComponent thisModule "fieldCodeEditorCpt" cpt
   where
     cpt {field: Field {typ: typ@(Haskell {haskell})}, onChange} _ = do
       pure $ CE.codeEditor {code: haskell, defaultCodeType: CE.Haskell, onChange: changeCode onChange typ}

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

@@ -13,6 +13,9 @@ import Gargantext.Hooks.Loader (HashedResponse, useLoader, useLoaderWithCacheAPI
 import Gargantext.Utils.Crypto (Hash)
 import Gargantext.Sessions (Session)
 import Gargantext.Utils.CacheAPI as GUC
+import Gargantext.Utils.Reactix as R2
+
+thisModule = "Gargantext.Components.Nodes.Corpus.Chart.Common"
 
 type MetricsLoadViewProps a = (
     getMetrics :: Session -> ReloadPath -> Aff a
@@ -27,7 +30,7 @@ metricsLoadView :: forall a. Record (MetricsLoadViewProps a) -> R.Element
 metricsLoadView p = R.createElement metricsLoadViewCpt p []
 
 metricsLoadViewCpt :: forall a. R.Component (MetricsLoadViewProps a)
-metricsLoadViewCpt = R.hooksComponent "G.C.N.C.C.metricsLoadView" cpt
+metricsLoadViewCpt = R2.hooksComponent thisModule "metricsLoadView" cpt
   where
     cpt { getMetrics, loaded, path, reload, session } _ = do
       useLoader (fst reload /\ path) (getMetrics session) $ \l ->
@@ -47,7 +50,7 @@ metricsWithCacheLoadView p = R.createElement metricsWithCacheLoadViewCpt p []
 
 metricsWithCacheLoadViewCpt :: forall res ret. DecodeJson res =>
                                R.Component (MetricsWithCacheLoadViewProps res ret)
-metricsWithCacheLoadViewCpt = R.hooksComponent "G.C.N.C.C.metricsWithCacheLoadView" cpt
+metricsWithCacheLoadViewCpt = R2.hooksComponent thisModule "metricsWithCacheLoadView" cpt
   where
     cpt { getMetricsHash, handleResponse, loaded, mkRequest, path, reload, session } _ = do
       useLoaderWithCacheAPI { cacheEndpoint: (getMetricsHash session)

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

@@ -6,6 +6,9 @@ import Data.Maybe (Maybe(..))
 import Data.Tuple (Tuple(..))
 import Data.Tuple.Nested ((/\))
 import Effect.Aff (Aff)
+import Reactix as R
+import Reactix.DOM.HTML as H
+
 import Gargantext.Components.Charts.Options.Color (grey)
 import Gargantext.Components.Charts.Options.Data (dataSerie)
 import Gargantext.Components.Charts.Options.ECharts (Options(..), chart, xAxis', yAxis')
@@ -20,8 +23,9 @@ import Gargantext.Routes (SessionRoute(..))
 import Gargantext.Sessions (Session, get)
 import Gargantext.Types (ChartType(..), TabType(..))
 import Gargantext.Utils.CacheAPI as GUC
-import Reactix as R
-import Reactix.DOM.HTML as H
+import Gargantext.Utils.Reactix as R2
+
+thisModule = "Gargantext.Components.Nodes.Corpus.Chart.Histo"
 
 newtype ChartMetrics = ChartMetrics {
     "data" :: HistoMetrics
@@ -81,7 +85,7 @@ histo :: Record Props -> R.Element
 histo props = R.createElement histoCpt props []
 
 histoCpt :: R.Component Props
-histoCpt = R.hooksComponent "G.C.N.C.C.H.histo" cpt
+histoCpt = R2.hooksComponent thisModule "histo" cpt
   where
     cpt { path, session } _ = do
       reload <- R.useState' 0

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

@@ -27,6 +27,9 @@ import Gargantext.Routes (SessionRoute(..))
 import Gargantext.Sessions (Session, get)
 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"
 
 newtype Metric = Metric
   { label :: String
@@ -115,7 +118,7 @@ metrics :: Record Props -> R.Element
 metrics props = R.createElement metricsCpt props []
 
 metricsCpt :: R.Component Props
-metricsCpt = R.hooksComponent "G.C.N.C.C.M.metrics" cpt
+metricsCpt = R2.hooksComponent thisModule "etrics" cpt
   where
     cpt {path, session} _ = do
       reload <- R.useState' 0

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

@@ -9,6 +9,9 @@ import Data.String (take, joinWith, Pattern(..), split, length)
 import Data.Tuple (Tuple(..))
 import Data.Tuple.Nested ((/\))
 import Effect.Aff (Aff)
+import Reactix as R
+import Reactix.DOM.HTML as H
+
 import Gargantext.Components.Charts.Options.Color (blue)
 import Gargantext.Components.Charts.Options.Data (dataSerie)
 import Gargantext.Components.Charts.Options.ECharts (Options(..), chart, xAxis', yAxis')
@@ -23,8 +26,9 @@ import Gargantext.Routes (SessionRoute(..))
 import Gargantext.Sessions (Session, get)
 import Gargantext.Types (ChartType(..), TabType)
 import Gargantext.Utils.CacheAPI as GUC
-import Reactix as R
-import Reactix.DOM.HTML as H
+import Gargantext.Utils.Reactix as R2
+
+thisModule = "Gargantext.Components.Nodes.Corpus.Chart.Pie"
 
 newtype ChartMetrics = ChartMetrics {
     "data" :: HistoMetrics
@@ -100,7 +104,7 @@ pie :: Record Props -> R.Element
 pie props = R.createElement pieCpt props []
 
 pieCpt :: R.Component Props
-pieCpt = R.hooksComponent "G.C.N.C.C.P.pie" cpt
+pieCpt = R2.hooksComponent thisModule "pie" cpt
   where
     cpt { path, session } _ = do
       reload <- R.useState' 0
@@ -126,7 +130,7 @@ bar :: Record Props -> R.Element
 bar props = R.createElement barCpt props []
 
 barCpt :: R.Component Props
-barCpt = R.hooksComponent "LoadedMetricsBar" cpt
+barCpt = R2.hooksComponent thisModule "bar" cpt
   where
     cpt {path, session} _ = do
       reload <- R.useState' 0

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

@@ -22,6 +22,9 @@ import Gargantext.Routes (SessionRoute(..))
 import Gargantext.Sessions (Session, get)
 import Gargantext.Types (ChartType(..), TabType)
 import Gargantext.Utils.CacheAPI as GUC
+import Gargantext.Utils.Reactix as R2
+
+thisModule = "Gargantext.Components.Nodes.Corpus.Chart.Tree"
 
 newtype Metrics = Metrics {
     "data" :: Array TreeNode
@@ -74,7 +77,7 @@ tree :: Record Props -> R.Element
 tree props = R.createElement treeCpt props []
 
 treeCpt :: R.Component Props
-treeCpt = R.hooksComponent "G.C.N.C.C.T.tree" cpt
+treeCpt = R2.hooksComponent thisModule "tree" cpt
   where
     cpt {path, session} _ = do
       reload <- R.useState' 0

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

@@ -14,6 +14,9 @@ import Gargantext.Components.Nodes.Corpus.Chart.API (recomputeChart)
 import Gargantext.Components.Nodes.Corpus.Chart.Types (Path)
 import Gargantext.Sessions (Session)
 import Gargantext.Types as T
+import Gargantext.Utils.Reactix as R2
+
+thisModule = "Gargantext.Components.Nodes.Corpus.Chart.Utils"
 
 reloadButtonWrap :: R.State Int -> R.Element -> R.Element
 reloadButtonWrap setReload el = H.div {} [
@@ -41,7 +44,7 @@ chartUpdateButton :: Record ChartUpdateButtonProps -> R.Element
 chartUpdateButton p = R.createElement chartUpdateButtonCpt p []
 
 chartUpdateButtonCpt :: R.Component ChartUpdateButtonProps
-chartUpdateButtonCpt = R.hooksComponent "G.C.N.C.C.U.chartUpdateButton" cpt
+chartUpdateButtonCpt = R2.hooksComponent thisModule "chartUpdateButton" cpt
   where
     cpt { chartType
         , path: { corpusId, listId, tabType }

src/Gargantext/Components/Nodes/Corpus/Dashboard.purs

@@ -19,6 +19,8 @@ import Gargantext.Sessions (Session, sessionId)
 import Gargantext.Types (NodeID)
 import Gargantext.Utils.Reactix as R2
 
+thisModule = "Gargantext.Components.Nodes.Corpus.Dashboard"
+
 type Props =
   ( nodeId :: NodeID
   , session :: Session
@@ -28,7 +30,7 @@ dashboardLayout :: Record Props -> R.Element
 dashboardLayout props = R.createElement dashboardLayoutCpt props []
 
 dashboardLayoutCpt :: R.Component Props
-dashboardLayoutCpt = R.hooksComponent "G.C.N.C.D.dashboardLayout" cpt
+dashboardLayoutCpt = R2.hooksComponent thisModule "dashboardLayout" cpt
   where
     cpt { nodeId, session } _ = do
       let sid = sessionId session
@@ -44,7 +46,7 @@ dashboardLayoutWithKey :: Record KeyProps -> R.Element
 dashboardLayoutWithKey props = R.createElement dashboardLayoutWithKeyCpt props []
 
 dashboardLayoutWithKeyCpt :: R.Component KeyProps
-dashboardLayoutWithKeyCpt = R.hooksComponent "G.C.N.C.D.dashboardLayoutWithKey" cpt
+dashboardLayoutWithKeyCpt = R2.hooksComponent thisModule "dashboardLayoutWithKey" cpt
   where
     cpt { nodeId, session } _ = do
       reload <- R.useState' 0
@@ -82,7 +84,7 @@ dashboardLayoutLoaded :: Record LoadedProps -> R.Element
 dashboardLayoutLoaded props = R.createElement dashboardLayoutLoadedCpt props []
 
 dashboardLayoutLoadedCpt :: R.Component LoadedProps
-dashboardLayoutLoadedCpt = R.hooksComponent "G.C.N.C.D.dashboardLayoutLoaded" cpt
+dashboardLayoutLoadedCpt = R2.hooksComponent thisModule "dashboardLayoutLoaded" cpt
   where
     cpt props@{ charts, corpusId, defaultListId, onChange, session } _ = do
       pure $
@@ -119,7 +121,7 @@ renderChart :: Record PredefinedChartProps -> R.Element
 renderChart props = R.createElement renderChartCpt props []
 
 renderChartCpt :: R.Component PredefinedChartProps
-renderChartCpt = R.hooksComponent "G.C.N.C.D.renderChart" cpt
+renderChartCpt = R2.hooksComponent thisModule "renderChart" cpt
   where
     cpt { chart, corpusId, defaultListId, onChange, onRemove, session } _ = do
       pure $ H.div { className: "row" } [

src/Gargantext/Components/Nodes/Corpus/Document.purs

@@ -26,6 +26,8 @@ import Gargantext.Types (CTabNgramType(..), NodeType(..), TabSubType(..), TabTyp
 import Gargantext.Utils as U
 import Gargantext.Utils.Reactix as R2
 
+thisModule = "Gargantext.Components.Nodes.Corpus.Document"
+
 type DocPath =
   {
     corpusId :: Maybe Int
@@ -300,7 +302,7 @@ docViewWrapper :: Record Props -> R.Element
 docViewWrapper props = R.createElement docViewWrapperCpt props []
 
 docViewWrapperCpt :: R.Component Props
-docViewWrapperCpt = R.hooksComponent "G.C.N.C.D.docViewWrapper" cpt
+docViewWrapperCpt = R2.hooksComponent thisModule "docViewWrapper" cpt
   where
     cpt { loaded, path } _ = do
       state <- R.useState' $ initialState { loaded }
@@ -316,7 +318,7 @@ docView :: Record DocViewProps -> R.Element
 docView props = R.createElement docViewCpt props []
 
 docViewCpt :: R.Component DocViewProps
-docViewCpt = R.hooksComponent "G.C.N.C.D.docView" cpt
+docViewCpt = R2.hooksComponent thisModule "docView" cpt
   where
     cpt props@{ loaded: loaded@{ ngramsTable: Versioned { data: initTable }, document }, state } _ = do
       pure $ H.div {} [
@@ -386,7 +388,7 @@ documentLayout :: Record LayoutProps -> R.Element
 documentLayout props = R.createElement documentLayoutCpt props []
 
 documentLayoutCpt :: R.Component LayoutProps
-documentLayoutCpt = R.hooksComponent "G.C.N.C.D.documentLayout" cpt
+documentLayoutCpt = R2.hooksComponent thisModule "documentLayout" cpt
   where
     cpt { corpusId, listId, nodeId, session } _ = do
       let sid = sessionId session
@@ -406,7 +408,7 @@ documentLayoutWithKey :: Record KeyLayoutProps -> R.Element
 documentLayoutWithKey props = R.createElement documentLayoutWithKeyCpt props []
 
 documentLayoutWithKeyCpt :: R.Component KeyLayoutProps
-documentLayoutWithKeyCpt = R.hooksComponent "G.C.N.C.D.documentLayoutWithKey" cpt
+documentLayoutWithKeyCpt = R2.hooksComponent thisModule "documentLayoutWithKey" cpt
   where
     cpt { corpusId, listId, nodeId, session } _ = do
       useLoader path loadData $ \loaded ->

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

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

src/Gargantext/Components/Nodes/File.purs

@@ -13,6 +13,9 @@ import Gargantext.Hooks.Loader (useLoader)
 import Gargantext.Routes (SessionRoute(..))
 import Gargantext.Sessions (Session, get)
 import Gargantext.Types as T
+import Gargantext.Utils.Reactix as R2
+
+thisModule = "Gargantext.Components.Nodes.File"
 
 
 newtype HyperdataFile = HyperdataFile {
@@ -67,7 +70,7 @@ fileLayout :: Record FileLayoutProps -> R.Element
 fileLayout props = R.createElement fileLayoutCpt props []
 
 fileLayoutCpt :: R.Component FileLayoutProps
-fileLayoutCpt = R.hooksComponent "G.C.N.F.fileLayout" cpt
+fileLayoutCpt = R2.hooksComponent thisModule "fileLayout" cpt
   where
     cpt { nodeId, session } _ = do
       useLoader { nodeId } (loadFile session) $ \loaded ->
@@ -89,7 +92,7 @@ fileLayoutLoaded :: Record FileLayoutLoadedProps -> R.Element
 fileLayoutLoaded props = R.createElement fileLayoutLoadedCpt props []
 
 fileLayoutLoadedCpt :: R.Component FileLayoutLoadedProps
-fileLayoutLoadedCpt = R.hooksComponent "G.C.N.F.fileLayoutLoaded" cpt
+fileLayoutLoadedCpt = R2.hooksComponent thisModule "fileLayoutLoaded" cpt
   where
     cpt { loaded: File { hyperdata: HyperdataFile hyperdata }, nodeId, session } _ = do
       R.useEffect' $ do

src/Gargantext/Components/Nodes/Frame.purs

@@ -18,6 +18,9 @@ import Gargantext.Routes (SessionRoute(NodeAPI))
 import Gargantext.Sessions (Session, get, sessionId)
 import Gargantext.Types (NodeType(..))
 import Gargantext.Utils.Argonaut (genericSumEncodeJson)
+import Gargantext.Utils.Reactix as R2
+
+thisModule = "Gargantext.Components.Nodes.Frame"
 
 data Hyperdata =
   Hyperdata { base :: String
@@ -61,7 +64,7 @@ frameLayout :: Record Props -> R.Element
 frameLayout props = R.createElement frameLayoutCpt props []
 
 frameLayoutCpt :: R.Component Props
-frameLayoutCpt = R.hooksComponent "G.C.N.F.frameLayout" cpt
+frameLayoutCpt = R2.hooksComponent thisModule "frameLayout" cpt
   where
     cpt {nodeId, session} _ = do
       let sid = sessionId session
@@ -72,7 +75,7 @@ frameLayoutWithKey :: Record KeyProps -> R.Element
 frameLayoutWithKey props = R.createElement frameLayoutWithKeyCpt props []
 
 frameLayoutWithKeyCpt :: R.Component KeyProps
-frameLayoutWithKeyCpt = R.hooksComponent "G.C.N.F.frameLayoutWithKey" cpt
+frameLayoutWithKeyCpt = R2.hooksComponent thisModule "frameLayoutWithKey" cpt
   where
     cpt { nodeId, session } _ = do
       reload <- R.useState' 0
@@ -98,7 +101,7 @@ frameLayoutView :: Record ViewProps -> R.Element
 frameLayoutView props = R.createElement frameLayoutViewCpt props []
 
 frameLayoutViewCpt :: R.Component ViewProps
-frameLayoutViewCpt = R.hooksComponent "G.C.N.C.frameLayoutView" cpt
+frameLayoutViewCpt = R2.hooksComponent thisModule "frameLayoutView" cpt
   where
     cpt {frame: (NodePoly {hyperdata: Hyperdata {base, frame_id}}), nodeId, reload, session} _ = do
       pure $ H.div { className : "frame" }

src/Gargantext/Components/Nodes/Home.purs

@@ -2,6 +2,10 @@ module Gargantext.Components.Nodes.Home where
 
 import Data.Newtype (class Newtype)
 import Effect (Effect)
+import Reactix as R
+import Reactix.DOM.HTML as H
+import Routing.Hash (setHash)
+
 import Gargantext.Components.Data.Landing (BlockText(..), BlockTexts(..), Button(..), LandingData(..))
 import Gargantext.Components.Lang (LandingLang(..))
 import Gargantext.Components.Lang.Landing.EnUS as En
@@ -9,9 +13,9 @@ import Gargantext.Components.Lang.Landing.FrFR as Fr
 import Gargantext.Components.Nodes.Home.Public (renderPublic)
 import Gargantext.License (license)
 import Gargantext.Prelude (Unit, map, pure, unit, void, ($), (<>))
-import Reactix as R
-import Reactix.DOM.HTML as H
-import Routing.Hash (setHash)
+import Gargantext.Utils.Reactix as R2
+
+thisModule = "Gargantext.Components.Nodes.Home"
 
 type Props = ()
 
@@ -48,7 +52,7 @@ homeLayout lang = R.createElement homeLayoutCpt {landingData} []
   where landingData = langLandingData lang
 
 homeLayoutCpt :: R.Component ( landingData :: LandingData )
-homeLayoutCpt = R.hooksComponent "LayoutLanding" cpt
+homeLayoutCpt = R2.hooksComponent thisModule "homeLayout" cpt
   where
     cpt {landingData} _ = do
       pure $ H.span {}

src/Gargantext/Components/Nodes/Home/Public.purs

@@ -8,18 +8,22 @@ import Data.Generic.Rep.Show (genericShow)
 import Data.Maybe (Maybe(..))
 import Data.NonEmpty (head)
 import Data.String (take)
+import Data.Traversable (traverse)
 import Data.Tuple (fst)
 import Effect.Aff (Aff)
 import Effect.Class (liftEffect)
+import Reactix as R
+import Reactix.DOM.HTML as H
+
 import Gargantext.Config (publicBackend)
 import Gargantext.Config.REST (get)
 import Gargantext.Ends (backendUrl, Backend(..))
 import Gargantext.Hooks.Loader (useLoader)
 import Gargantext.Prelude
 import Gargantext.Utils.Argonaut (genericSumDecodeJson, genericSumEncodeJson)
-import Reactix as R
-import Reactix.DOM.HTML as H
-import Data.Traversable (traverse)
+import Gargantext.Utils.Reactix as R2
+
+thisModule = "Gargantext.Components.Nodes.Home.Public"
 
 type PublicProps = (publicDatas :: (Array PublicData)
                    -- , session :: Session
@@ -75,7 +79,7 @@ renderPublic :: R.Element
 renderPublic = R.createElement renderPublicCpt {} []
 
 renderPublicCpt :: R.Component LoadData
-renderPublicCpt = R.hooksComponent "G.C.N.Home.Public.renderPublic" cpt
+renderPublicCpt = R2.hooksComponent thisModule "renderPublic" cpt
   where
     cpt {} _ = do
       reload <- R.useState' 0
@@ -87,7 +91,7 @@ publicLayout :: Record PublicProps -> R.Element
 publicLayout props = R.createElement publicLayoutCpt props []
 
 publicLayoutCpt :: R.Component PublicProps
-publicLayoutCpt = R.hooksComponent "[G.C.N.H.Public.publicLayout" cpt
+publicLayoutCpt = R2.hooksComponent thisModule "publicLayout" cpt
   where
     cpt {publicDatas} _ = do
       pure $ H.span {}

src/Gargantext/Components/Nodes/Lists.purs

@@ -10,6 +10,9 @@ import Gargantext.Components.Table as Table
 import Gargantext.Hooks.Loader (useLoader)
 import Gargantext.Prelude
 import Gargantext.Sessions (Session, sessionId)
+import Gargantext.Utils.Reactix as R2
+
+thisModule = "Gargantext.Components.Nodes.Lists"
 ------------------------------------------------------------------------
 ------------------------------------------------------------------------
 
@@ -22,7 +25,7 @@ listsLayout :: Record Props -> R.Element
 listsLayout props = R.createElement listsLayoutCpt props []
 
 listsLayoutCpt :: R.Component Props
-listsLayoutCpt = R.hooksComponent "G.C.N.L.listsLayout" cpt
+listsLayoutCpt = R2.hooksComponent thisModule "listsLayout" cpt
   where
     cpt path@{ nodeId, session } _ = do
       let sid = sessionId session
@@ -38,7 +41,7 @@ listsLayoutWithKey :: Record KeyProps -> R.Element
 listsLayoutWithKey props = R.createElement listsLayoutWithKeyCpt props []
 
 listsLayoutWithKeyCpt :: R.Component KeyProps
-listsLayoutWithKeyCpt = R.hooksComponent "G.C.N.L.listsLayoutWithKey" cpt
+listsLayoutWithKeyCpt = R2.hooksComponent thisModule "listsLayoutWithKey" cpt
   where
     cpt { nodeId, session } _ = do
       let path = { nodeId, session }

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

@@ -18,6 +18,8 @@ import Gargantext.Sessions (Session)
 import Gargantext.Types (ChartType(..), CTabNgramType(..), Mode(..), TabSubType(..), TabType(..), chartTypeFromString, modeTabType)
 import Gargantext.Utils.Reactix as R2
 
+thisModule = "Gargantext.Components.Nodes.Lists.Tabs"
+
 type Props = ( session    :: Session
              , corpusId   :: Int
              , corpusData :: CorpusData 
@@ -27,7 +29,7 @@ tabs :: Record Props -> R.Element
 tabs props = R.createElement tabsCpt props []
 
 tabsCpt :: R.Component Props
-tabsCpt = R.hooksComponent "G.C.N.L.T.tabs" cpt
+tabsCpt = R2.hooksComponent thisModule "tabs" cpt
   where
     cpt { corpusData: corpusData@{ defaultListId }, corpusId, session } _ = do
       (selected /\ setSelected) <- R.useState' 0
@@ -45,7 +47,7 @@ ngramsView :: Record NgramsViewProps -> R.Element
 ngramsView props = R.createElement ngramsViewCpt props []
 
 ngramsViewCpt :: R.Component NgramsViewProps
-ngramsViewCpt = R.hooksComponent "G.C.N.L.T.ngramsView" cpt
+ngramsViewCpt = R2.hooksComponent thisModule "ngramsView" cpt
   where
     cpt { corpusData: { defaultListId }
         , corpusId

src/Gargantext/Components/Nodes/Texts.purs

@@ -19,6 +19,9 @@ import Gargantext.Components.Table as Table
 import Gargantext.Ends (Frontends)
 import Gargantext.Sessions (Session, sessionId)
 import Gargantext.Types (CTabNgramType(..), TabSubType(..), TabType(..))
+import Gargantext.Utils.Reactix as R2
+
+thisModule = "Gargantext.Components.Nodes.Texts"
 --------------------------------------------------------
 
 type Props = (
@@ -32,7 +35,7 @@ textsLayout props = R.createElement textsLayoutCpt props []
 
 ------------------------------------------------------------------------
 textsLayoutCpt :: R.Component Props
-textsLayoutCpt = R.hooksComponent "G.C.N.T.textsLayout" cpt where
+textsLayoutCpt = R2.hooksComponent thisModule "textsLayout" cpt where
   cpt { frontends, nodeId, session } _ = do
     let sid = sessionId session
 
@@ -47,7 +50,7 @@ textsLayoutWithKey :: Record KeyProps -> R.Element
 textsLayoutWithKey props = R.createElement textsLayoutWithKeyCpt props []
 
 textsLayoutWithKeyCpt :: R.Component KeyProps
-textsLayoutWithKeyCpt = R.hooksComponent "G.C.N.T.textsLayoutWithKey" cpt
+textsLayoutWithKeyCpt = R2.hooksComponent thisModule "textsLayoutWithKey" cpt
   where
     cpt { frontends, nodeId, session } _ = do
       pure $ loader {session, nodeId} loadCorpusWithChild paint
@@ -80,7 +83,7 @@ tabs :: Record TabsProps -> R.Element
 tabs props = R.createElement tabsCpt props []
 
 tabsCpt :: R.Component TabsProps
-tabsCpt = R.hooksComponent "G.C.Nodes.Texts.tabs" cpt
+tabsCpt = R2.hooksComponent thisModule "tabs" cpt
   where
     cpt {frontends, session, corpusId, corpusData} _ = do
       (selected /\ setSelected) <- R.useState' 0
@@ -108,7 +111,7 @@ docView :: forall a. Record (DocViewProps a) -> R.Element
 docView props = R.createElement docViewCpt props []
 
 docViewCpt :: forall a. R.Component (DocViewProps a)
-docViewCpt = R.hooksComponent "G.C.Nodes.Texts.docView" cpt
+docViewCpt = R2.hooksComponent thisModule "docView" cpt
   where
     cpt {frontends, session, corpusId, corpusData: {defaultListId}, tabType} _children = do
       pure $ DT.docViewLayout $ params tabType

src/Gargantext/Components/RangeSlider.purs

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

src/Gargantext/Components/Tab.purs

@@ -7,6 +7,10 @@ import Data.Tuple.Nested ((/\))
 import Reactix as R
 import Reactix.DOM.HTML as H
 
+import Gargantext.Utils.Reactix as R2
+
+thisModule = "Gargantext.Components.Tab"
+
 type TabsProps = ( tabs :: Array (Tuple String R.Element), selected :: Int )
 
 tabs :: Record TabsProps -> R.Element
@@ -14,7 +18,7 @@ tabs props = R.createElement tabsCpt props []
 
 -- this is actually just the list of tabs, not the tab contents itself
 tabsCpt :: R.Component TabsProps
-tabsCpt = R.hooksComponent "G.C.Tab.tabs" cpt
+tabsCpt = R2.hooksComponent thisModule "tabs" cpt
   where
     cpt props _ = do
       (activeTab /\ setActiveTab) <- R.useState' props.selected

src/Gargantext/Components/Table.purs

@@ -15,6 +15,8 @@ import Gargantext.Utils.Reactix as R2
 import Gargantext.Utils.Reactix (effectLink)
 import Gargantext.Components.Search
 
+thisModule = "Gargantext.Components.Table"
+
 type TableContainerProps =
   ( pageSizeControl     :: R.Element
   , pageSizeDescription :: R.Element
@@ -100,7 +102,7 @@ tableHeaderLayout :: Record TableHeaderLayoutProps -> R.Element
 tableHeaderLayout props = R.createElement tableHeaderLayoutCpt props []
 
 tableHeaderLayoutCpt :: R.Component TableHeaderLayoutProps
-tableHeaderLayoutCpt = R.hooksComponent "G.C.Table.tableHeaderLayout" cpt
+tableHeaderLayoutCpt = R2.hooksComponent thisModule "tableHeaderLayout" cpt
   where
     cpt {title, desc, query, date, user} _ =
       pure $ R.fragment
@@ -139,7 +141,7 @@ table :: Record Props -> R.Element
 table props = R.createElement tableCpt props []
 
 tableCpt :: R.Component Props
-tableCpt = R.hooksComponent "G.C.Table.table" cpt
+tableCpt = R2.hooksComponent thisModule "table" cpt
   where
     cpt {container, colNames, wrapColElts, totalRecords, rows, params} _ = do
       let
@@ -214,7 +216,7 @@ sizeDD :: Record SizeDDProps -> R.Element
 sizeDD p = R.createElement sizeDDCpt p []
 
 sizeDDCpt :: R.Component SizeDDProps
-sizeDDCpt = R.hooksComponent "G.C.T.sizeDD" cpt
+sizeDDCpt = R2.hooksComponent thisModule "sizeDD" cpt
   where
     cpt {params: params /\ setParams} _ = do
       pure $ H.span {} [

src/Gargantext/Utils/Reactix.purs

@@ -42,6 +42,12 @@ import Web.HTML (window)
 import Web.HTML.Window (localStorage)
 import Web.Storage.Storage (Storage, getItem, setItem)
 
+-- TODO Reactix should export this definition
+type HooksComponent props = Record props -> Array R.Element -> R.Hooks R.Element
+
+hooksComponent :: forall props. String -> String -> HooksComponent props -> R.Component props
+hooksComponent module' name c = R.hooksComponent (module' <> "." <> name) c
+
 newtype Point = Point { x :: Number, y :: Number }
 
 -- a setter function, for useState

src/Gargantext/Version.purs

@@ -12,6 +12,9 @@ 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 = "Gargantext.Version"
 
 type Version = String
 
@@ -30,7 +33,7 @@ versionView :: Record VersionProps -> R.Element
 versionView props = R.createElement versionCpt props []
 
 versionCpt :: R.Component VersionProps
-versionCpt = R.hooksComponent "G.C.A.version" cpt
+versionCpt = R2.hooksComponent thisModule "version" cpt
   where
     cpt { session } _ = do
       (versionBack /\ setVer) <- R.useState' "No Backend Version"