Merge branch 'dev' into 603-dev-istex-zip-file-upload

dist/styles/bootstrap-darkster.css

@@ -12314,6 +12314,29 @@ select.form-control {
   overflow-x: hidden;
 }
 
+.breadcrumb-wrapper {
+  border-bottom: 1px solid #dee2e6;
+}
+.breadcrumb-wrapper .breadcrumb {
+  background-color: transparent;
+  padding: 4px 4px !important;
+  margin: 0 !important;
+}
+.breadcrumb-wrapper .breadcrumb-item {
+  color: #DEE2E6;
+}
+.breadcrumb-wrapper .breadcrumb-item .active-page {
+  font-weight: bold;
+  color: #33A2FF;
+}
+.breadcrumb-wrapper .breadcrumb-item .b-icon {
+  margin: 0 4px;
+}
+.breadcrumb-wrapper .fa-spinner {
+  font-size: 100%;
+  margin: auto 10px;
+}
+
 .dropdown-menu {
   background-color: #181A1B;
 }

dist/styles/bootstrap-default.css

@@ -12116,6 +12116,29 @@ select.form-control {
   overflow-x: hidden;
 }
 
+.breadcrumb-wrapper {
+  border-bottom: 1px solid #dee2e6;
+}
+.breadcrumb-wrapper .breadcrumb {
+  background-color: transparent;
+  padding: 4px 4px !important;
+  margin: 0 !important;
+}
+.breadcrumb-wrapper .breadcrumb-item {
+  color: #495057;
+}
+.breadcrumb-wrapper .breadcrumb-item .active-page {
+  font-weight: bold;
+  color: #005a9a;
+}
+.breadcrumb-wrapper .breadcrumb-item .b-icon {
+  margin: 0 4px;
+}
+.breadcrumb-wrapper .fa-spinner {
+  font-size: 100%;
+  margin: auto 10px;
+}
+
 .btn-secondary,
 .btn-secondary:hover,
 .btn-outline-secondary:not(:disabled):not(.disabled):hover,

dist/styles/bootstrap-greyson.css

@@ -11880,4 +11880,27 @@ select.form-control {
   overflow-x: hidden;
 }
 
+.breadcrumb-wrapper {
+  border-bottom: 1px solid #dee2e6;
+}
+.breadcrumb-wrapper .breadcrumb {
+  background-color: transparent;
+  padding: 4px 4px !important;
+  margin: 0 !important;
+}
+.breadcrumb-wrapper .breadcrumb-item {
+  color: #495057;
+}
+.breadcrumb-wrapper .breadcrumb-item .active-page {
+  font-weight: bold;
+  color: #2f3c48;
+}
+.breadcrumb-wrapper .breadcrumb-item .b-icon {
+  margin: 0 4px;
+}
+.breadcrumb-wrapper .fa-spinner {
+  font-size: 100%;
+  margin: auto 10px;
+}
+
 /*# sourceMappingURL=bootstrap-greyson.css.map */

dist/styles/bootstrap-herbie.css

@@ -12128,4 +12128,27 @@ select.form-control {
   overflow-x: hidden;
 }
 
+.breadcrumb-wrapper {
+  border-bottom: 1px solid #dee2e6;
+}
+.breadcrumb-wrapper .breadcrumb {
+  background-color: transparent;
+  padding: 4px 4px !important;
+  margin: 0 !important;
+}
+.breadcrumb-wrapper .breadcrumb-item {
+  color: #495057;
+}
+.breadcrumb-wrapper .breadcrumb-item .active-page {
+  font-weight: bold;
+  color: #083358;
+}
+.breadcrumb-wrapper .breadcrumb-item .b-icon {
+  margin: 0 4px;
+}
+.breadcrumb-wrapper .fa-spinner {
+  font-size: 100%;
+  margin: auto 10px;
+}
+
 /*# sourceMappingURL=bootstrap-herbie.css.map */

dist/styles/bootstrap-monotony.css

@@ -12129,4 +12129,27 @@ select.form-control {
   overflow-x: hidden;
 }
 
+.breadcrumb-wrapper {
+  border-bottom: 1px solid #dee2e6;
+}
+.breadcrumb-wrapper .breadcrumb {
+  background-color: transparent;
+  padding: 4px 4px !important;
+  margin: 0 !important;
+}
+.breadcrumb-wrapper .breadcrumb-item {
+  color: #495057;
+}
+.breadcrumb-wrapper .breadcrumb-item .active-page {
+  font-weight: bold;
+  color: #222222;
+}
+.breadcrumb-wrapper .breadcrumb-item .b-icon {
+  margin: 0 4px;
+}
+.breadcrumb-wrapper .fa-spinner {
+  font-size: 100%;
+  margin: auto 10px;
+}
+
 /*# sourceMappingURL=bootstrap-monotony.css.map */

package.json

 {
     "name": "Gargantext",
-    "version": "0.0.6.9.9.8",
+    "version": "0.0.6.9.9.8.2",
     "scripts": {
         "generate-purs-packages-nix": "./nix/generate-purs-packages.nix",
         "generate-psc-packages-nix": "./nix/generate-packages-json.bash",

src/Gargantext/Components/Forest/Breadcrumb.purs

+module Gargantext.Components.Forest.Breadcrumb (component) where
+
+import Prelude
+
+import Control.Monad.Trans.Class
+import Data.String (Pattern(..), split)
+import Data.Array as A
+import Data.Int (fromString)
+import Data.Map (Map)
+import Data.Map as Map
+import Data.Maybe (Maybe(..), fromMaybe)
+import Effect (Effect)
+import Effect.Aff (Aff, launchAff_, throwError)
+import Effect.Class (class MonadEffect, liftEffect)
+import Effect.Exception (error)
+import Gargantext.Prelude
+import Gargantext.Context.Session as SessionContext
+import Gargantext.Components.App.Store (Boxes)
+import Gargantext.Components.Bootstrap as B
+import Gargantext.Components.GraphQL.Endpoints (getBreadcrumb)
+import Gargantext.Components.GraphQL.Tree (BreadcrumbInfo, TreeNode)
+import Gargantext.Components.Login.Types (TreeId, UserId)
+import Gargantext.Ends (Frontends, Backend(..))
+import Gargantext.Hooks.Session (useSession)
+import Gargantext.Routes (AppRoute(Home), appPath, nodeTypeAppRoute)
+import Gargantext.Sessions
+import Gargantext.Sessions.Types
+import Gargantext.Types (CorpusId, FrontendError, NodeID, NodeType, SessionId)
+import Gargantext.Types as GT
+import Gargantext.Utils as GU
+import Gargantext.Utils.Reactix as R2
+import Reactix as R
+import Reactix.DOM.HTML as H
+import URI.Query as Query
+import URI.Fragment as Fragment
+import Effect (Effect)
+import Effect.Console (log)
+import Toestand as T
+import Gargantext.Config.REST (AffRESTError, logRESTError)
+import Gargantext.Utils.Toestand as T2
+import Gargantext.Hooks.Loader (useLoader)
+
+
+
+here :: R2.Here
+here = R2.here "Gargantext.Components.Forest.Breadcrumb"
+
+type PropsBoxes = ( boxes :: Boxes )
+
+type Props =
+  ( nodeId     :: Int
+  , session    :: Maybe Session
+  )
+
+-- maybeToSession :: Maybe Session -> Session
+-- maybeToSession s = fromMaybe Nothing s
+
+
+component :: R2.Leaf PropsBoxes
+component = R2.leaf componentCpt
+componentCpt :: R.Component PropsBoxes
+componentCpt = here.component "breadcrumb" cpt where
+  cpt props@{ boxes: { session } } _ = do
+    -- | States
+    -- |
+    session' <- T.useLive T.unequal session
+    -- R.provideContext SessionContext.context session'
+
+    -- | Effects
+    -- |
+    -- url <- R.unsafeHooksEffect GU.href
+
+    -- | Behaviors
+    -- |
+    -- let
+      -- currentUrl = url
+      -- fragment = Fragment.toString $ Fragment.fromString "http://localhost:8008/#/corpus/user1@localhost:8008/112"
+      -- fragment = Fragment.toString $ Fragment.fromString url
+      -- currentNodeId = fromMaybe 0 $ fromString $ getLastUrlElement url
+
+    
+    case session' of 
+      Nothing -> pure $ H.div {} []
+      Just (session') -> do
+        
+        url <- R.unsafeHooksEffect GU.href
+        let nodeId = fromMaybe 0 $ fromString $ getLastUrlElement url
+        -- breadcrumbData <- R2.useLayoutEffect1' $ getBreadcrumb session' currentNodeId
+        let session'' = Just session'
+
+        pure $
+          -- breadcrumb layout
+          H.nav { className: "breadcrumb-wrapper bg-light"
+                , "aria-label": "breadcrumb" }
+          [
+            H.ol { className: "breadcrumb text-small" }
+            [
+              H.li { className: "breadcrumb-item" }
+              [
+                H.a { href: "/" } 
+                [ H.span { className: "" }
+                  [ 
+                    B.icon { name: "home" }
+                  ]
+                , H.text "Home" 
+                ]
+              ]
+            ,
+              breadcrumbView { nodeId: nodeId
+                              , session: Just session' 
+                              }
+            ]
+          -- ,
+          --   H.nav 
+          --   { className: "breadcrumb-wrapper bg-light"
+          --   , "aria-label": "breadcrumb" }
+          --   [
+          --     H.ol { className: "breadcrumb text-small" }
+          --     [
+          --       H.li { className: "breadcrumb-item" }
+          --       [
+          --         H.a { href: "/" } 
+          --         [ H.span { className: "" }
+          --           [ 
+          --             B.icon { name: "home" }
+          --           ]
+          --         , H.text "Home" 
+          --         ]
+          --       ]
+          --     , H.li { className: "breadcrum-item" }
+          --       [
+          --         H.span {}
+          --         [
+          --           H.text $ show session' <> " - " <> show currentNodeId
+          --           -- H.text $ show breadcrumbData
+          --         ]
+          --       ]
+          --     , 
+          --       H.li { className: "breadcrumb-item" }
+          --       [
+          --         H.a { href: "/" } 
+          --         [ H.span { className: "" }
+          --           [ 
+          --             B.icon { name: "folder-open-o" } 
+          --           ]
+          --         , H.text "parent folder" 
+          --         ]
+          --       ]
+          --     , 
+          --       H.li { className: "breadcrumb-item" }
+          --       [ H.span { className: "active-page" }
+          --         [ H.span { className: "" }
+          --           [ 
+          --             B.icon { name: "book" } 
+          --           ]
+          --         , H.text "current node"
+          --         ]
+          --       ]
+          --     ]
+          --   ]
+          ]
+
+
+breadcrumbView :: R2.Leaf Props
+breadcrumbView = R2.leaf breadcrumbViewCpt
+breadcrumbViewCpt :: R.Component Props
+breadcrumbViewCpt = here.component "breadcrumbViewCpt" cpt where
+  cpt { nodeId, session } _ = do
+    let session' = session
+
+    case session' of 
+      Nothing -> pure $ H.div {} []
+      Just (session') -> do
+        useLoader { errorHandler
+                  , loader: loadBreadcrumbData
+                  , path: { nodeId: nodeId
+                          , session: session'
+                          -- , reload: reload'
+                          }
+                  , render: \items -> breadcrumbViewMain { items: items
+                                                         , nodeId: nodeId
+                                                         , session: session'
+                                                        --  , reload: reload
+                                                         } [] 
+                  }
+        where
+          errorHandler = logRESTError here "[breadcrumbView]"
+
+type BreadcrumbViewProps =
+  ( items         :: BreadcrumbInfo
+  , nodeId        :: Int
+  -- , reload        :: T.Box T2.Reload
+  , session       :: Session
+  )
+
+breadcrumbViewMain :: R2.Component BreadcrumbViewProps
+breadcrumbViewMain = R.createElement breadcrumbViewMainCpt
+breadcrumbViewMainCpt :: R.Component BreadcrumbViewProps
+breadcrumbViewMainCpt = here.component "breadcrumbViewMainCpt" cpt where
+  cpt props@{ items: { parents }, session } _ = do
+    
+    -- session' <- T.useLive T.unequal session
+    let items = makeBreadcrumbElements parents props
+
+    -- case session of 
+    --   Nothing -> pure $ H.div {} []
+    --   Just (session) -> do
+
+    pure $ 
+      R.fragment items
+
+
+  makeBreadcrumbElements :: Array TreeNode -> Record BreadcrumbViewProps -> Array R.Element
+  makeBreadcrumbElements items' props = makeBreadcrumbElementsMap <$> items' where
+    makeBreadcrumbElementsMap :: TreeNode -> R.Element
+    makeBreadcrumbElementsMap node = breadcrumbItem { nodeId: node.id
+                                                    , linkId: node.id
+                                                    , nodeType: node.node_type
+                                                    , linkNodeType: node.node_type
+                                                    , parentId: props.nodeId
+                                                    -- , reload: props.reload
+                                                    , session: props.session
+                                                    -- , style: FolderUp
+                                                    , text: node.name
+                                                    , disabled: false
+                                                    }
+
+type BreadcrumbItemProps =
+  ( disabled      :: Boolean
+  , linkNodeType  :: NodeType
+  , linkId        :: Int
+  , nodeType      :: NodeType
+  , nodeId        :: Int
+  , parentId      :: Int
+  -- , reload        :: T.Box T2.Reload
+  , session       :: Session
+  -- , style         :: FolderStyle
+  , text          :: String
+  )
+
+breadcrumbItem :: R2.Leaf BreadcrumbItemProps
+breadcrumbItem = R2.leaf breadcrumbItemCpt
+breadcrumbItemCpt :: R.Component BreadcrumbItemProps
+breadcrumbItemCpt = here.component "breadcrumbItemCpt" cpt where
+  cpt props@{ nodeId
+            , linkId
+            , nodeType
+            , linkNodeType
+            , parentId
+            -- , reload
+            , session
+            -- , style
+            , text
+            , disabled
+            } _ = do
+
+    let sid = sessionId session
+    let rootId = treeId session
+
+    pure $ 
+      H.li { className: "breadcrumb-item" }
+      [
+        H.a { className: ""
+            , href: "/#/" <> createNodeUrl linkId rootId linkNodeType sid 
+            } 
+        [ 
+          H.span { className: "" }
+          [ 
+            -- B.icon { name: "folder-open-o" } 
+            B.icon
+            { className: ""
+            , name: GT.getIcon nodeType true
+            }
+          ]
+        , 
+          H.text props.text 
+        ]
+      ]
+
+  createNodeUrl :: Int -> Int -> NodeType -> SessionId -> String
+  createNodeUrl lId rootId nType sId
+    -- | rootId == lId  = appPath Home
+    | otherwise      = appPath $ getFolderPath nType sId lId
+  
+  getFolderPath :: GT.NodeType -> GT.SessionId -> Int -> AppRoute
+  getFolderPath nodeType sid nodeId = fromMaybe Home $ nodeTypeAppRoute nodeType sid nodeId
+
+
+treeId :: Session -> Int
+treeId (Session {treeId: tId}) = tId
+
+getLastUrlElement :: String -> String
+getLastUrlElement str = fromMaybe "" $ A.last $ split (Pattern "/") str
+
+type LoadProps =
+  (
+    session :: Session
+  , nodeId :: Int
+  -- , reload :: T.Box T2.Reload
+  )
+
+loadBreadcrumbData :: Record LoadProps -> AffRESTError BreadcrumbInfo
+loadBreadcrumbData {nodeId, session} = getBreadcrumb session nodeId
+
+
+
+
+-- type BreadcrumbProps = ( nodeId  :: NodeID )
+
+
+-- breadcrumbLayout :: R2.Leaf BreadcrumbProps
+-- breadcrumbLayout = R2.leaf breadcrumbLayoutCpt
+-- breadcrumbLayoutCpt :: R.Component BreadcrumbProps
+-- breadcrumbLayoutCpt = here.component "breadcrumbLayout" cpt where
+--   cpt props@{ nodeId } _ = do
+
+--     session <- useSession
+
+--     let
+--       breadcrumbData = getBreadcrumb session nodeId
+
+--     pure $ 
+--       -- breadcrumb layout
+--       H.div {}
+--       [
+--         H.nav 
+--         { className: "breadcrumb-wrapper bg-light"
+--         , "aria-label": "breadcrumb" }
+--         [
+--           H.ol { className: "breadcrumb text-small" }
+--           [
+--             H.li { className: "breadcrumb-item" }
+--             [
+--               H.a { href: "/" } 
+--               [ H.span { className: "" }
+--                 [ 
+--                   B.icon { name: "home" } 
+--                 ]
+--               , H.text "Home" 
+--               ]
+--             ]
+--           , 
+--             H.li { className: "breadcrumb-item" }
+--             [
+--               H.a { href: "/" } 
+--               [ H.span { className: "" }
+--                 [ 
+--                   B.icon { name: "folder-open-o" } 
+--                 ]
+--               , H.text "parent folder" 
+--               ]
+--             ]
+--           , 
+--             H.li { className: "breadcrumb-item" }
+--             [ H.span { className: "active-page" }
+--               [ H.span { className: "" }
+--                 [ 
+--                   B.icon { name: "book" } 
+--                 ]
+--               , H.text "current node"
+--               ]
+--             ]
+--           ]
+--         ]
+--       ]

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

@@ -166,9 +166,9 @@ allDatabases = [ Empty
                , HAL Nothing
                , Arxiv
                , OpenAlex
-               -- , IsTex
-                 -- , IsTex_Advanced
-                 -- , Isidore
+               , IsTex
+                 --, IsTex_Advanced
+                 --, Isidore
                  --, Web
                  --, News
                  --, SocialNetworks

src/Gargantext/Components/GraphQL.purs

@@ -15,7 +15,7 @@ import Gargantext.Components.GraphQL.Context as GQLCTX
 import Gargantext.Components.GraphQL.IMT as GQLIMT
 import Gargantext.Components.GraphQL.NLP as GQLNLP
 import Gargantext.Components.GraphQL.Node as GQLNode
-import Gargantext.Components.GraphQL.Tree (TreeFirstLevel)
+import Gargantext.Components.GraphQL.Tree (TreeFirstLevel, BreadcrumbInfo)
 import Gargantext.Components.GraphQL.User (User, UserInfo, UserInfoM, UserPubmedAPIKeyM)
 import Gargantext.Components.GraphQL.Team (Team, TeamDeleteM)
 import Gargantext.Ends (Backend(..))
@@ -86,6 +86,7 @@ type Schema
     , users :: { user_id :: Int } ==> Array User
     , team :: { team_node_id :: Int } ==> Team
     , tree :: { root_id :: Int } ==> TreeFirstLevel
+    , tree_branch :: { node_id :: Int } ==> BreadcrumbInfo
     }
 
 type Mutation

src/Gargantext/Components/GraphQL/Endpoints.purs

@@ -16,10 +16,10 @@ import Gargantext.Components.GraphQL.IMT as GQLIMT
 import Gargantext.Components.GraphQL.NLP as GQLNLP
 import Gargantext.Components.GraphQL.Node (Corpus, Node, nodeParentQuery, nodesQuery, nodesCorpusQuery)
 import Gargantext.Components.GraphQL.Team (Team, teamQuery)
-import Gargantext.Components.GraphQL.Tree (TreeFirstLevel, treeFirstLevelQuery)
+import Gargantext.Components.GraphQL.Tree (TreeFirstLevel, treeFirstLevelQuery, BreadcrumbInfo, breadcrumbQuery)
 import Gargantext.Components.GraphQL.User (UserInfo, userInfoQuery, User, userQuery)
 import Gargantext.Components.Lang (Lang)
-import Gargantext.Config.REST (RESTError(..), AffRESTError)
+import Gargantext.Config.REST (RESTError(..), AffRESTError, logRESTError)
 import Gargantext.Core.NgramsTable.Types (NgramsTerm(..))
 import Gargantext.Sessions (Session(..))
 import Gargantext.Types (CorpusId, NodeType)
@@ -178,3 +178,9 @@ getContextNgrams session context_id list_id = do
   let query = GQLCTX.contextNgramsQuery `withVars` { context_id, list_id }
   { context_ngrams } <- queryGql session "get context ngrams" query
   pure $ Right $ NormNgramsTerm <$> context_ngrams
+
+getBreadcrumb :: Session -> Int -> AffRESTError BreadcrumbInfo
+getBreadcrumb session id = do
+  { tree_branch } <- queryGql session "get breadcrumb branch" $ breadcrumbQuery `withVars` { id }
+  liftEffect $ here.log2 "[getBreadcrumb] breadcrumb" tree_branch
+  pure $ Right tree_branch

src/Gargantext/Components/GraphQL/Tree.purs

@@ -19,6 +19,10 @@ type TreeFirstLevel =
   , parent   :: Maybe TreeNode
   }
 
+type BreadcrumbInfo =
+  { parents   :: Array TreeNode }
+
+
 treeFirstLevelQuery = { tree: { root_id: Var :: _ "id" Int} =>>
   { root: { name: unit
           , node_type: unit
@@ -37,3 +41,13 @@ treeFirstLevelQuery = { tree: { root_id: Var :: _ "id" Int} =>>
             }
   }
  }
+
+breadcrumbQuery = { tree_branch: { node_id: Var :: _ "id" Int} =>>
+  { parents: 
+    { name: unit
+    , node_type: unit
+    , id: unit
+    , parent_id: unit
+    }
+  }
+}
\ No newline at end of file

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

@@ -114,16 +114,16 @@ userLayoutWithKeyCpt = here.component "userLayoutWithKey" cpt where
                     display { title: fromMaybe "no name" (Just ui_username) }
                       (contactInfos userInfo (onUpdateUserInfo boxes.errors reload))
                     , pubmedSettings { boxes, nodeId, session }
-                    , Tabs.tabs {
-                         boxes
-                       , cacheState
-                       , defaultListId: 424242
-                       , frontends
-                       , nodeId
-                       , session
-                       , sidePanel: sidePanelTexts
-                       , sidePanelList: sidePanelLists
-                       }
+                    -- , Tabs.tabs {
+                    --      boxes
+                    --    , cacheState
+                    --    , defaultListId: 424242
+                    --    , frontends
+                    --    , nodeId
+                    --    , session
+                    --    , sidePanel: sidePanelTexts
+                    --    , sidePanelList: sidePanelLists
+                    --    }
                     ]
               }
     where

src/Gargantext/Components/Router.purs

@@ -12,9 +12,12 @@ import Data.UUID (UUID)
 import Data.UUID as UUID
 import Effect (Effect)
 import Gargantext.Components.App.Store (Boxes)
+import Gargantext.Components.Bootstrap as B
 import Gargantext.Components.ErrorsView as ErrorsView
 import Gargantext.Components.Forest (forestLayout)
+import Gargantext.Components.Forest.Breadcrumb as Breadcrumb
 import Gargantext.Components.ForgotPassword (forgotPasswordLayout)
+-- import Gargantext.Components.GraphQL.Node (Node)
 import Gargantext.Components.Login (login)
 import Gargantext.Components.Nodes.Annuaire (annuaireLayout)
 import Gargantext.Components.Nodes.Annuaire.User (userLayout)
@@ -34,6 +37,7 @@ import Gargantext.Components.Tile (tileBlock)
 import Gargantext.Components.TopBar as TopBar
 import Gargantext.Components.TreeSearch (treeSearch)
 import Gargantext.Config (defaultFrontends, defaultBackends)
+import Gargantext.Config.REST (AffRESTError, logRESTError)
 import Gargantext.Context.Session as SessionContext
 import Gargantext.Ends (Backend)
 import Gargantext.Hooks.Resize (ResizeType(..), useResizeHandler)
@@ -64,6 +68,8 @@ type SessionProps = ( sessionId :: SessionId | Props )
 type SessionNodeProps = ( nodeId :: NodeID | SessionProps )
 type Props' = ( backend :: Backend, route' :: AppRoute | Props )
 
+type NodeProps = ( nodeId :: NodeID | Props )
+
 router :: R2.Leaf Props
 router = R2.leaf routerCpt
 routerCpt :: R.Component Props
@@ -123,6 +129,25 @@ routerCpt = here.component "router" cpt where
 
 --------------------------------------------------------------
 
+-- breadcrumb :: R2.Leaf NodeProps
+-- breadcrumb = R2.leaf breadcrumbCpt
+-- breadcrumbCpt :: R.Component NodeProps
+-- breadcrumbCpt = here.component "breadcrumb" cpt where
+--   cpt props@{ nodeId } _ = do
+--     let
+--       sessionProps = RE.pick props :: Record SessionProps
+--       authedProps =
+--         -- Record.merge { content: \session -> breadcrumbLayout 
+--         --                                       { boxes
+--         --                                       , frontends: defaultFrontends
+--         --                                       , nodeId
+--         --                                       , session } } sessionProps
+--         Record.merge { content: \_ -> breadcrumbLayout { nodeId } } sessionProps
+    
+--     pure $ authed authedProps []
+--     -- pure $ breadcrumbLayout { nodeId }
+--------------------------------------------------------------
+
 mainPage :: R2.Leaf Props
 mainPage = R2.leaf mainPageCpt
 mainPageCpt :: R.Component Props
@@ -148,11 +173,15 @@ mainPageCpt = here.component "mainPage" cpt where
 
     let hasHorizontalTiles = not $ eq 0 $ length tileAxisXList
     let hasVerticalTiles = not $ eq 0 $ length tileAxisYList
+
     -- Render
     pure $
 
       H.div { className: "router__body main-page" }
       [
+        Breadcrumb.component
+        { boxes }
+      ,
         H.div
         { className: intercalate " "
           [ "main-page__main-row"

src/sass/_legacy.sass

@@ -13,3 +13,4 @@
 @import "./_legacy/_corpus"
 @import "./_legacy/_annuaire"
 @import "./_legacy/_search"
+@import "./_legacy/_breadcrumb"
\ No newline at end of file

src/sass/_legacy/_breadcrumb.sass

+.breadcrumb-wrapper
+    border-bottom: 1px solid $border-color
+    .breadcrumb
+        background-color: transparent
+        padding: space-x(0.5) space-x(0.5) !important
+        margin: 0 !important
+        &-item
+            color: $gray-700
+            & .active-page
+                font-weight: bold
+                color: $primary
+            .b-icon
+                margin: 0 space-x(0.5)
+    .fa-spinner
+        font-size: 100%
+        margin: auto 10px
\ No newline at end of file