Merge remote-tracking branch...

Merge remote-tracking branch 'origin/556-forest-tree-node-focus-find-a-way-to-focus-on-the-current-node-in-the-forest-layout-layout' into dev

src/Gargantext/Components/Forest/Breadcrumb.purs

@@ -8,7 +8,7 @@ import Data.Array as A
 import Data.Int (fromString)
 import Data.Maybe (Maybe(..), fromMaybe)
 import Data.String (Pattern(..), split)
-import Gargantext.Components.App.Store (Boxes)
+import Gargantext.Components.App.Store as Store
 import Gargantext.Components.Bootstrap as B
 import Gargantext.Components.GraphQL.Endpoints (getBreadcrumb)
 import Gargantext.Components.GraphQL.Tree (BreadcrumbInfo, TreeNode)
@@ -30,7 +30,7 @@ import Toestand as T
 here :: R2.Here
 here = R2.here "Gargantext.Components.Forest.Breadcrumb"
 
-type PropsBoxes = ( boxes :: Boxes )
+type PropsBoxes = ( boxes :: Store.Boxes )
 
 type Props =
   ( nodeId     :: Int
@@ -232,10 +232,16 @@ breadcrumbItemCpt = here.component "breadcrumbItemCpt" cpt where
       , format
       } _ = do
 
+    boxes@{ forestOpen } <- Store.use
+
     url <- R.unsafeHooksEffect GU.href
 
     let sid = sessionId session
     let rootId = treeId session
+    
+    let currentNodeIdFromUrl = mkNodeId session linkId
+    R.unsafeHooksEffect $ T.modify_ (openNodesInsert (currentNodeIdFromUrl)) forestOpen
+
 
     pure $ 
       if format == "text"

src/Gargantext/Components/Forest/Tree.purs

@@ -4,7 +4,8 @@ import Gargantext.Prelude
 
 import Data.Array as A
 import Data.Array as Array
-import Data.Maybe (Maybe(..), isJust)
+import Data.Maybe (fromMaybe, Maybe(..), isJust)
+import Data.String (Pattern(..), split)
 import Data.Traversable (intercalate, traverse, traverse_)
 import Data.Tuple.Nested ((/\))
 import Effect.Aff (Aff)
@@ -154,6 +155,7 @@ getNodeTreeFirstLevel session nodeId = get session $ GR.TreeFirstLevel (Just nod
 
 tree :: R2.Leaf TreeProps
 tree props = R.createElement treeCpt props []
+
 treeCpt :: R.Component TreeProps
 treeCpt = here.component "tree" cpt where
   cpt p@{ frontends
@@ -167,6 +169,12 @@ treeCpt = here.component "tree" cpt where
     folderOpen    <- useOpenNodesMemberBox nodeId forestOpen
     folderOpen'   <- T.useLive T.unequal folderOpen
 
+    R.useEffect' do
+      selectedLeaf <- R2.querySelector ".mainleaf--selected"
+      case selectedLeaf of
+          Nothing -> pure unit
+          Just el -> R2.scrollIntoView el
+
     pure $
 
       H.div
@@ -218,7 +226,6 @@ treeCpt = here.component "tree" cpt where
   pub (LNode n@{ nodeType: t }) = LNode (n { nodeType = publicize t })
 
 
-
 blankTree :: R2.Leaf ()
 blankTree = R2.leaf blankTreeCpt
 blankTreeCpt :: R.Component ()

src/Gargantext/Utils/Reactix.js

@@ -53,3 +53,8 @@ export function _keyCode(e) {
     // https://www.w3schools.com/jsref/event_key_keycode.asp
     return e.which || e.keyCode;
 }
+
+export function _scrollIntoView(el) {
+    return el.scrollIntoView();
+}
+   
\ No newline at end of file

src/Gargantext/Utils/Reactix.purs

@@ -281,6 +281,11 @@ getElementById = (flip delay) h
   where
     h id = pure $ toMaybe $ document ... "getElementById" $ [id]
 
+querySelector :: String -> Effect (Maybe DOM.Element)
+querySelector = (flip delay) h
+  where
+    h selector = pure $ toMaybe $ document ... "querySelector" $ [selector]
+
 -- We just assume it works, so make sure it's in the html
 getPortalHost :: R.Hooks DOM.Element
 getPortalHost = R.unsafeHooksEffect $ delay unit $ \_ -> pure $ document ... "getElementById" $ ["portal"]
@@ -487,6 +492,12 @@ focus nEl = case toMaybe nEl of
   Nothing -> pure unit
   Just el -> el ... "focus" $ []
 
+foreign import _scrollIntoView :: EffectFn1 DOM.Element Unit
+
+scrollIntoView :: DOM.Element -> Effect Unit
+scrollIntoView el = runEffectFn1 _scrollIntoView el
+
+
 setIndeterminateCheckbox :: R.Element -> Boolean -> Effect R.Element
 setIndeterminateCheckbox el val = pure $ (el .= "indeterminate") val