Table no longer loads, the Loader does

src/Gargantext/Components/Loader.purs

@@ -5,36 +5,39 @@ import Data.Maybe (Maybe(..))
 import React as React
 import React (ReactClass, Children)
 import Gargantext.Prelude
+import Effect (Effect)
 import Effect.Aff (Aff)
 
 import Thermite (Render, PerformAction, simpleSpec, modifyState_, createReactSpec)
 
-type InnerProps a b =
-  { path     :: a
-  , loaded   :: Maybe b
+data Action path = ForceReload | SetPath path
+
+type InnerProps path loaded =
+  { path     :: path
+  , loaded   :: Maybe loaded
+  , dispatch :: Action path -> Effect Unit
   , children :: Children
   }
 
-type PropsRow a b c =
-  ( path      :: a
-  , component :: ReactClass (InnerProps a b)
-  | c
+type PropsRow path loaded row =
+  ( path      :: path
+  , component :: ReactClass (InnerProps path loaded)
+  | row
   )
 
-type Props a b = Record (PropsRow a b (children :: Children))
-
-type Props' a b = Record (PropsRow a b ())
+type Props path loaded = Record (PropsRow path loaded (children :: Children))
 
-data Action a = ForceReload | SetPath a
+type Props' path loaded = Record (PropsRow path loaded ())
 
-type State a b = { currentPath :: a, loaded :: Maybe b }
+type State path loaded = { currentPath :: path, loaded :: Maybe loaded }
 
-createLoaderClass :: forall a b
-                   . Eq a
-                  => String
-                  -> (a -> Aff b)
-                  -> ReactClass (Record (PropsRow a b (children :: Children)))
-createLoaderClass name loader =
+createLoaderClass' :: forall path loaded props
+                    . Eq path
+                   => String
+                   -> (path -> Aff loaded)
+                   -> Render (State path loaded) {path :: path | props} (Action path)
+                   -> ReactClass { path :: path, children :: Children | props }
+createLoaderClass' name loader render =
   React.component name
     (\this -> do
        s <- spec this
@@ -45,7 +48,7 @@ createLoaderClass name loader =
   where
     initialState {path} = {currentPath: path, loaded: Nothing}
 
-    performAction :: PerformAction (State a b) (Props' a b) (Action a)
+    performAction :: PerformAction (State path loaded) {path :: path | props} (Action path)
     performAction ForceReload _ {currentPath} = do
       loaded <- lift $ loader currentPath
       modifyState_ $ _ { loaded = Just loaded }
@@ -54,17 +57,25 @@ createLoaderClass name loader =
         loaded <- lift $ loader newPath
         modifyState_ $ _ { currentPath = newPath, loaded = Just loaded }
 
-    render :: Render (State a b) (Props' a b) (Action a)
-    render _d {component} {currentPath, loaded} c =
-      [React.createElement component {path: currentPath, loaded} c]
-
     {spec, dispatcher} = createReactSpec (simpleSpec performAction render) initialState
 
+createLoaderClass :: forall path loaded
+                   . Eq path
+                  => String
+                  -> (path -> Aff loaded)
+                  -> ReactClass (Record (PropsRow path loaded (children :: Children)))
+createLoaderClass name loader =
+    createLoaderClass' name loader render
+  where
+    render :: Render (State path loaded) (Props' path loaded) (Action path)
+    render dispatch {component} {currentPath, loaded} c =
+      [React.createElement component {path: currentPath, loaded, dispatch} c]
+
 {-
-createLoaderClass :: forall a b
+createLoaderClass :: forall path loaded
                    . String
-                  -> (a -> Aff b)
-                  -> ReactClass (Props a b)
+                  -> (path -> Aff loaded)
+                  -> ReactClass (Props path loaded)
 createLoaderClass name loader = React.component name mk
   where
     mk this =

src/Gargantext/Components/Table.purs

 module Gargantext.Components.Table where
 
-import Control.Monad.Cont.Trans (lift)
 import Data.Array (filter)
 import Data.Maybe (Maybe(..), maybe)
 import Data.Either (Either(..))
 import Effect (Effect)
-import Effect.Aff (Aff)
-import React as React
+import Effect.Class (liftEffect)
 import React (ReactElement, ReactClass, Children, createElement)
 import React.DOM (a, b, b', p, i, h3, hr, div, option, select, span, table, tbody, td, text, th, thead, tr)
 import React.DOM.Props (className, href, onChange, onClick, scope, selected, value, style)
-import Thermite (PerformAction, Render, Spec, modifyState, simpleSpec, createReactSpec, StateCoTransformer)
+import Thermite (PerformAction, Render, Spec, modifyState_, simpleSpec, StateCoTransformer, createClass)
 import Unsafe.Coerce (unsafeCoerce)
 
 import Gargantext.Prelude
@@ -29,7 +27,7 @@ type Rows = Array { row    :: Array ReactElement
 
 type OrderBy = Maybe (OrderByDirection ColumnName)
 
-type LoadRows = { offset :: Int, limit :: Int, orderBy :: OrderBy } -> Aff Rows
+type Params = { offset :: Int, limit :: Int, orderBy :: OrderBy }
 
 newtype ColumnName = ColumnName String
 
@@ -40,32 +38,34 @@ columnName (ColumnName c) = c
 
 data OrderByDirection a = ASC a | DESC a
 
+derive instance eqOrderByDirection :: Eq a => Eq (OrderByDirection a)
+
 type Props' =
   ( colNames     :: Array ColumnName
   , totalRecords :: Int
-  , loadRows     :: LoadRows
+  , setParams    :: Params -> Effect Unit
+  , rows         :: Rows
   , container    :: TableContainerProps -> Array ReactElement
   )
 
 type Props = Record Props'
 
 type State =
-  { rows        :: Maybe Rows
-  , currentPage :: Int
+  { currentPage :: Int
   , pageSize    :: PageSizes
   , orderBy     :: OrderBy
---, tree        :: FTree
   }
 
-initialState :: Props -> State
-initialState _ =
-  { rows         : Nothing
-  , currentPage  : 1
+initialState :: State
+initialState =
+  { currentPage  : 1
   , pageSize     : PS10
   , orderBy      : Nothing
---, tree         : exampleTree
   }
 
+initialParams :: Params
+initialParams = stateParams initialState
+
 data Action
   = ChangePageSize PageSizes
   | ChangePage     Int
@@ -118,9 +118,9 @@ tableSpec :: Spec State Props Action
 tableSpec = simpleSpec performAction render
   where
     modifyStateAndReload :: (State -> State) -> Props -> State -> StateCoTransformer State Unit
-    modifyStateAndReload f {loadRows} state = do
-      void $ modifyState f
-      loadAndSetRows {loadRows} $ f state
+    modifyStateAndReload f {setParams} state = do
+      modifyState_ f
+      liftEffect $ setParams $ stateParams $ f state
 
     performAction :: PerformAction State Props Action
     performAction (ChangePageSize ps) =
@@ -145,8 +145,8 @@ tableSpec = simpleSpec performAction render
             _ -> [lnk (Just (ASC c)) (columnName c)]
 
     render :: Render State Props Action
-    render dispatch {container, colNames, totalRecords}
-                    {pageSize, currentPage, orderBy, rows} _ =
+    render dispatch {container, colNames, totalRecords, rows}
+                    {pageSize, currentPage, orderBy} _ =
       container
         { pageSizeControl: sizeDD pageSize dispatch
         , pageSizeDescription: textDescription currentPage pageSize totalRecords
@@ -154,10 +154,7 @@ tableSpec = simpleSpec performAction render
         , tableHead:
             tr [] (renderColHeader (dispatch <<< ChangeOrderBy) orderBy <$> colNames)
         , tableBody:
-            map (tr [] <<< map (\c -> td [] [c]) <<< _.row)
-                (maybe [] identity rows)
-            -- TODO display a loading spinner when rows == Nothing
-            -- instead of an empty list of results.
+            map (tr [] <<< map (\c -> td [] [c]) <<< _.row) rows
         }
       where
         ps = pageSizes2Int pageSize
@@ -169,7 +166,7 @@ defaultContainer {title} props =
     [ div [className "col-md-1"] [b [] [text title]]
     , div [className "col-md-2"] [props.pageSizeControl]
     , div [className "col-md-3"] [props.pageSizeDescription]
-    , div [className "col-md-3"] []
+    , div [className "col-md-3"] [props.paginationLinks]
     ]
   , table [ className "table"]
     [ thead [className "thead-dark"] [ props.tableHead ]
@@ -177,26 +174,14 @@ defaultContainer {title} props =
     ]
   ]
 
-loadAndSetRows :: {loadRows :: LoadRows} -> State -> StateCoTransformer State Unit
-loadAndSetRows {loadRows} {pageSize, currentPage, orderBy} = do
-  let limit = pageSizes2Int pageSize
-      offset = limit * (currentPage - 1)
-  rows <- lift $ loadRows {offset, limit, orderBy}
-  void $ modifyState (_ { rows = Just rows })
+stateParams :: State -> Params
+stateParams {pageSize, currentPage, orderBy} = {offset, limit, orderBy}
+  where
+    limit = pageSizes2Int pageSize
+    offset = limit * (currentPage - 1)
 
 tableClass :: ReactClass {children :: Children | Props'}
-tableClass =
-  React.component "Table"
-    (\this -> do
-       {state, render} <- spec this
-       pure { state, render
-            , componentDidMount: do
-                {loadRows} <- React.getProps this
-                state' <- React.getState this
-                dispatcher' this $ loadAndSetRows {loadRows} state'
-            })
-  where
-    { spec, dispatcher' } = createReactSpec tableSpec initialState
+tableClass = createClass "Table" tableSpec (const initialState)
 
 tableElt :: Props -> ReactElement
 tableElt props = createElement tableClass props []
@@ -220,10 +205,7 @@ textDescription currPage pageSize totalRecords
       end  = if end' > totalRecords then totalRecords else end'
 
 effectLink :: Effect Unit -> String -> ReactElement
-effectLink eff msg =
-  a [ href "javascript:void()"
-    , onClick (const eff)
-    ] [text msg]
+effectLink eff msg = a [onClick $ const eff] [text msg]
 
 pagination :: ChangePageAction -> Int -> Int -> ReactElement
 pagination changePage tp cp

src/Gargantext/Pages/Annuaire.purs

@@ -5,10 +5,12 @@ import Data.Lens (Prism', prism)
 import Data.Either (Either(..))
 import Data.Maybe (Maybe(..), maybe)
 import React as React
-import React (ReactClass, ReactElement)
+import React (ReactClass, ReactElement, Children)
 import React.DOM (a, br', div, input, p, text)
 import React.DOM.Props (href)
+import Effect (Effect)
 import Effect.Aff (Aff)
+import Effect.Class (liftEffect)
 import Thermite ( Render, Spec
                 , createClass, simpleSpec, defaultPerformAction
                 )
@@ -16,15 +18,17 @@ import Thermite ( Render, Spec
 ------------------------------------------------------------------------------
 import Gargantext.Prelude
 import Gargantext.Components.Loader as Loader
-import Gargantext.Components.Loader (createLoaderClass)
 import Gargantext.Components.Tab as Tab
-import Gargantext.Components.Table as Table
+import Gargantext.Components.Table as T
 import Gargantext.Config      (toUrl, NodeType(..), TabType(..), End(..))
 import Gargantext.Config.REST (get)
 import Gargantext.Pages.Annuaire.User.Contacts.Types (Contact(..), HyperData(..))
 ------------------------------------------------------------------------------
 
-type Props = {path :: Int, loaded :: Maybe AnnuaireInfo }
+type Props =
+  { path :: Int
+  , loaded :: Maybe AnnuaireInfo
+  , dispatch :: Loader.Action Int -> Effect Unit }
 
 data Action
   = TabsA   Tab.Action
@@ -79,8 +83,8 @@ loadedAnnuaireSpec = simpleSpec defaultPerformAction render
   where
     render :: Render {} Props Void
     render _ {loaded: Nothing} _ _ = []
-    render _ {path, loaded: Just (AnnuaireInfo {name, date})} _ _ =
-      Table.renderTableHeaderLayout
+    render _ {path: nodeId, loaded: Just (annuaireInfo@AnnuaireInfo {name, date})} _ _ =
+      T.renderTableHeaderLayout
         { title: name
         , desc: name
         , query: ""
@@ -90,25 +94,54 @@ loadedAnnuaireSpec = simpleSpec defaultPerformAction render
       [ p [] []
       , div [] [ text "    Filter ", input []]
       , br'
-      , Table.tableElt
-          { loadRows
-          , container: Table.defaultContainer { title: "title" } -- TODO
-          , colNames:
-              Table.ColumnName <$>
+      , pageLoader
+          { path: initialPageParams nodeId
+          , annuaireInfo
+          }
+      ]
+
+type PageParams = {nodeId :: Int, params :: T.Params}
+
+initialPageParams :: Int -> PageParams
+initialPageParams nodeId = {nodeId, params: T.initialParams}
+
+type PageLoaderProps =
+  { path :: PageParams
+  , annuaireInfo :: AnnuaireInfo
+  }
+
+renderPage :: forall props path.
+              Render (Loader.State {nodeId :: Int | path} AnnuaireTable)
+                     {annuaireInfo :: AnnuaireInfo | props}
+                     (Loader.Action PageParams)
+renderPage _ _ {loaded: Nothing} _ = [] -- TODO loading spinner
+renderPage dispatch {annuaireInfo}
+                    { currentPath: {nodeId}
+                    , loaded: Just (AnnuaireTable {annuaireTable: res})
+                    } _ =
+  [ T.tableElt
+      { rows
+      , setParams: \params -> liftEffect $ dispatch (Loader.SetPath {nodeId, params})
+      , container: T.defaultContainer { title: "Annuaire" } -- TODO
+      , colNames:
+          T.ColumnName <$>
               [ ""
               , "Name"
               , "Role"
               , "Service"
               , "Company"
               ]
-          , totalRecords: 47361 -- TODO
-          }
-      ]
-      where
-        annuaireId = path
-        loadRows {offset, limit, orderBy} = do -- TODO use offset, limit, orderBy
-          (AnnuaireTable {annuaireTable: rows}) <- getTable annuaireId
-          pure $ (\c -> {row: renderContactCells c, delete: false}) <$> rows
+      , totalRecords: 47361 -- TODO
+      }
+  ]
+  where
+    rows = (\c -> {row: renderContactCells c, delete: false}) <$> res
+
+pageLoaderClass :: ReactClass { path :: PageParams, annuaireInfo :: AnnuaireInfo, children :: Children }
+pageLoaderClass = Loader.createLoaderClass' "AnnuairePageLoader" loadPage renderPage
+
+pageLoader :: PageLoaderProps -> ReactElement
+pageLoader props = React.createElement pageLoaderClass props []
 
 renderContactCells :: Contact -> Array ReactElement
 renderContactCells (Contact { id, hyperdata : HyperData contact }) =
@@ -168,15 +201,17 @@ instance decodeAnnuaireTable :: DecodeJson AnnuaireTable where
     rows <- decodeJson json
     pure $ AnnuaireTable { annuaireTable : rows}
 ------------------------------------------------------------------------
-getTable :: Int -> Aff AnnuaireTable
-getTable id = get $ toUrl Back (Tab TabDocs 0 10 Nothing) id
+loadPage :: PageParams -> Aff AnnuaireTable
+loadPage {nodeId, params} = get $ toUrl Back (Tab TabDocs 0 10 Nothing) nodeId
+ -- TODO Tab TabDocs is not the right API call
+ -- TODO params, see loadPage in Documents
 
 getAnnuaireInfo :: Int -> Aff AnnuaireInfo
 getAnnuaireInfo id = get $ toUrl Back Node id
 ------------------------------------------------------------------------------
 
 annuaireLoaderClass :: ReactClass (Loader.Props Int AnnuaireInfo)
-annuaireLoaderClass = createLoaderClass "AnnuaireLoader" getAnnuaireInfo
+annuaireLoaderClass = Loader.createLoaderClass "AnnuaireLoader" getAnnuaireInfo
 
 annuaireLoader :: Loader.Props' Int AnnuaireInfo -> ReactElement
 annuaireLoader props = React.createElement annuaireLoaderClass props []

src/Gargantext/Pages/Corpus/Tabs/Documents.purs

 module Gargantext.Pages.Corpus.Tabs.Documents where
 
+import Control.Monad.Cont.Trans (lift)
 import Data.Array (take, drop)
 import Data.Argonaut (class DecodeJson, class EncodeJson, decodeJson, jsonEmptyObject, (.?), (:=), (~>))
 
 import Data.Generic.Rep (class Generic)
 import Data.Generic.Rep.Show (genericShow)
-import Data.Maybe (maybe)
+import Data.Maybe (Maybe(..), maybe)
 import Data.Tuple (Tuple(..))
 import Effect.Aff (Aff)
+import Effect.Class (liftEffect)
+import React as React
+import React (ReactClass, ReactElement, Children)
 import React.DOM (a, br', div, input, p, text)
 import React.DOM.Props (_type, className, href, style, placeholder, name)
 import Thermite (Render, Spec, defaultPerformAction, simpleSpec)
@@ -17,6 +21,7 @@ import Gargantext.Config (NodeType(..), TabType(..), toUrl, End(..), OrderBy(..)
 import Gargantext.Config.REST (get, post)
 import Gargantext.Utils.DecodeMaybe ((.|))
 import Gargantext.Components.Charts.Options.ECharts (chart)
+import Gargantext.Components.Loader as Loader
 import Gargantext.Components.Table as T
 import Gargantext.Components.Node (NodePoly(..))
 import Gargantext.Pages.Corpus.Tabs.Types (CorpusInfo(..), Props)
@@ -115,7 +120,7 @@ layoutDocview :: Spec {} Props Void
 layoutDocview = simpleSpec absurd render
   where
     render :: Render {} Props Void
-    render dispatch {path: nodeId, loaded} _ _ =
+    render dispatch {path: nodeId, loaded: corpusInfo} _ _ =
       [ p [] []
       , div [ style {textAlign : "center"}] [input [placeholder "Filter here"]]
       , br'
@@ -123,53 +128,25 @@ layoutDocview = simpleSpec absurd render
         [ div [className "row"]
           [ chart globalPublis
           , div [className "col-md-12"]
-            [ T.tableElt
-                { loadRows
-                , container: T.defaultContainer { title: "Documents" }
-                , colNames:
-                    T.ColumnName <$>
-                    [ ""
-                    , "Date"
-                    , "Title"
-                    , "Source"
-                    , "Delete"
-                    ]
-                , totalRecords: maybe 47361 -- TODO
-                                  identity
-                                  ((\(NodePoly n) -> n.hyperdata)
-                                   >>>
-                                   (\(CorpusInfo c) -> c.totalRecords)
-                                  <$> loaded)
+            [ pageLoader
+                { path: initialPageParams nodeId
+                , corpusInfo
                 }
             ]
           ]
         ]
       ]
-      where
-        loadRows {offset, limit, orderBy} = do
-          _ <- logs "loading documents page"
-          res <- loadPage {nodeId,offset,limit,orderBy}
-          _ <- logs "OK: loading page documents."
-          pure $
-            (\(DocumentsView r) ->
-                { row:
-                    [ div [className $ fa r.fav <> "fa-star"] []
-                    -- TODO show date: Year-Month-Day only
-                    , text r.date
-                    , a [ href (toUrl Front Url_Document r._id) ] [ text r.title ]
-                    , text r.source
-                    , input [ _type "checkbox"]
-                    ]
-                , delete: false
-                }) <$> res
-    fa true  = "fas "
-    fa false = "far "
 
 mock :: Boolean
 mock = false
 
-loadPage :: {nodeId :: Int, limit :: Int, offset :: Int, orderBy :: T.OrderBy} -> Aff (Array DocumentsView)
-loadPage {nodeId, limit, offset, orderBy} = do
+type PageParams = {nodeId :: Int, params :: T.Params}
+
+initialPageParams :: Int -> PageParams
+initialPageParams nodeId = {nodeId, params: T.initialParams}
+
+loadPage :: PageParams -> Aff (Array DocumentsView)
+loadPage {nodeId, params: {limit, offset, orderBy}} = do
   logs "loading documents page: loadPage with Offset and limit"
   --res <- get $ toUrl Back (Children Url_Document offset limit) nodeId
   res <- get $ toUrl Back (Tab TabDocs offset limit (convOrderBy <$> orderBy)) nodeId
@@ -197,6 +174,57 @@ loadPage {nodeId, limit, offset, orderBy} = do
 
     convOrderBy _ = DateAsc -- TODO
 
+type PageLoaderProps =
+  { path :: PageParams
+  , corpusInfo :: Maybe (NodePoly CorpusInfo)
+  }
+
+renderPage :: forall props path.
+              Render (Loader.State {nodeId :: Int | path} (Array DocumentsView))
+                     {corpusInfo :: Maybe (NodePoly CorpusInfo) | props}
+                     (Loader.Action PageParams)
+renderPage _ _ {loaded: Nothing} _ = [] -- TODO loading spinner
+renderPage dispatch {corpusInfo} {currentPath: {nodeId}, loaded: Just res} _ =
+  [ T.tableElt
+      { rows
+      , setParams: \params -> liftEffect $ dispatch (Loader.SetPath {nodeId, params})
+      , container: T.defaultContainer { title: "Documents" }
+      , colNames:
+          T.ColumnName <$>
+          [ ""
+          , "Date"
+          , "Title"
+          , "Source"
+          , "Delete"
+          ]
+      , totalRecords: maybe 47361 -- TODO
+                        identity
+                        ((\(NodePoly n) -> n.hyperdata)
+                         >>>
+                         (\(CorpusInfo c) -> c.totalRecords)
+                        <$> corpusInfo)
+      }
+  ]
+  where
+    fa true  = "fas "
+    fa false = "far "
+    rows = (\(DocumentsView r) ->
+                { row:
+                    [ div [className $ fa r.fav <> "fa-star"] []
+                    -- TODO show date: Year-Month-Day only
+                    , text r.date
+                    , a [ href (toUrl Front Url_Document r._id) ] [ text r.title ]
+                    , text r.source
+                    , input [ _type "checkbox"]
+                    ]
+                , delete: false
+                  }) <$> res
+
+pageLoaderClass :: ReactClass { path :: PageParams, corpusInfo :: Maybe (NodePoly CorpusInfo), children :: Children }
+pageLoaderClass = Loader.createLoaderClass' "PageLoader" loadPage renderPage
+
+pageLoader :: PageLoaderProps -> ReactElement
+pageLoader props = React.createElement pageLoaderClass props []
 
 ---------------------------------------------------------
 sampleData' :: DocumentsView

src/Gargantext/Pages/Corpus/Tabs/Ngrams/NgramsTable.purs

@@ -20,7 +20,7 @@ import Data.Void (Void)
 import Data.Unit (Unit)
 import Effect (Effect)
 import Effect.Aff (Aff)
-import React (ReactElement, ReactClass)
+import React (ReactElement, ReactClass, Children)
 import React as React
 import React.DOM hiding (style, map)
 import React.DOM.Props (_id, _type, checked, className, href, name, onChange, onClick, onInput, placeholder, scope, selected, style, value)
@@ -38,8 +38,11 @@ import Gargantext.Pages.Corpus.Tabs.Types (CorpusInfo(..), PropsRow)
 
 type Props = { mode :: Mode | PropsRow }
 
-type Props' = { path :: Int
+type PageParams = {nodeId :: Int, params :: T.Params}
+
+type Props' = { path :: PageParams
               , loaded :: Maybe NgramsTable
+              , dispatch :: Loader.Action PageParams -> Effect Unit
               }
 
 type NgramsTerm = String
@@ -282,10 +285,13 @@ ngramsTableSpec' = simpleSpec performAction render
         -- patch the root of the child to be equal to the root of the parent.
 
     render :: Render State Props' Action
-    render dispatch {path: nodeId, loaded: initTable}
-                    {ngramsTablePatch, searchQuery {- TODO more state -} } _ =
+    render dispatch { path: {nodeId}
+                    , loaded: initTable
+                    , dispatch: loaderDispatch }
+                    { ngramsTablePatch, searchQuery } _children =
       [ T.tableElt
-          { loadRows
+          { rows
+          , setParams: \params -> loaderDispatch (Loader.SetPath {nodeId, params})
           , container: tableContainer {searchQuery, dispatch}
           , colNames:
               T.ColumnName <$>
@@ -294,36 +300,47 @@ ngramsTableSpec' = simpleSpec performAction render
               , "Terms"
               , "Occurences (nb)"
               ]
-          , totalRecords: 10 -- TODO
+          , totalRecords: 47361 -- TODO
           }
       ]
-      where
-        loadRows {offset, limit, orderBy} =
-          case applyNgramsTablePatch ngramsTablePatch <$> initTable of
-            Nothing -> pure [] -- or an error
-            Just (NgramsTable table) ->
-              pure $ convertRow <$> Map.toUnfoldable (Map.filter isRoot table)
-        isRoot (NgramsElement e) = e.root == Nothing
-        convertRow (Tuple ngrams (NgramsElement { occurrences, list })) =
-          { row:
-              let
-                setTermList Keep = do
-                  logs "setTermList Keep"
-                  pure unit
-                setTermList rep@(Replace {old,new}) = do
-                  logs $ Tuple "setTermList" (Tuple old new)
-                  dispatch $ SetTermListItem ngrams rep in
-              renderNgramsItem { ngrams, occurrences, termList: list, setTermList }
-          , delete: false
-          }
+          where
+            rows =
+              case applyNgramsTablePatch ngramsTablePatch <$> initTable of
+                Nothing -> [] -- or an error
+                Just (NgramsTable table) ->
+                  convertRow <$> Map.toUnfoldable (Map.filter isRoot table)
+            isRoot (NgramsElement e) = e.root == Nothing
+            convertRow (Tuple ngrams (NgramsElement { occurrences, list })) =
+              { row:
+                  let
+                    setTermList Keep = do
+                      logs "setTermList Keep"
+                      pure unit
+                    setTermList rep@(Replace {old,new}) = do
+                      logs $ Tuple "setTermList" (Tuple old new)
+                      dispatch $ SetTermListItem ngrams rep in
+                  renderNgramsItem { ngrams, occurrences, termList: list, setTermList }
+              , delete: false
+              }
+
+initialPageParams :: Int -> PageParams
+initialPageParams nodeId = {nodeId, params: T.initialParams}
+
+type PageLoaderProps =
+  { path :: PageParams
+--, corpusInfo :: Maybe (NodePoly CorpusInfo)
+  }
 
 getNgramsTable :: Int -> Aff NgramsTable
 getNgramsTable = get <<< toUrl Back (Ngrams TabTerms Nothing)
 
-ngramsLoaderClass :: ReactClass (Loader.Props Int NgramsTable)
-ngramsLoaderClass = Loader.createLoaderClass "NgramsLoader" getNgramsTable
+loadPage :: PageParams -> Aff NgramsTable
+loadPage {nodeId} = getNgramsTable nodeId -- TODO this ignores params
+
+ngramsLoaderClass :: ReactClass (Loader.Props PageParams NgramsTable)
+ngramsLoaderClass = Loader.createLoaderClass "NgramsLoader" loadPage
 
-ngramsLoader :: Loader.Props' Int NgramsTable -> ReactElement
+ngramsLoader :: Loader.Props' PageParams NgramsTable -> ReactElement
 ngramsLoader props = React.createElement ngramsLoaderClass props []
 
 ngramsTableSpec :: Spec {} Props Void
@@ -332,7 +349,7 @@ ngramsTableSpec = simpleSpec defaultPerformAction render
     render :: Render {} Props Void
     render _ {path: nodeId} _ _ =
       -- TODO: ignored mode, ignored loaded: corpusInfo
-      [ ngramsLoader { path: nodeId
+      [ ngramsLoader { path: initialPageParams nodeId
                      , component: createClass "Layout" ngramsTableSpec' initialState
                      } ]
 

src/Gargantext/Pages/Corpus/Tabs/Specs.purs

@@ -32,7 +32,7 @@ docPageSpec = focus _doclens _docAction DV.layoutDocview
 
 ngramsViewSpec :: {mode :: NV.Mode} -> Spec State Props Action
 ngramsViewSpec {mode} =
-  cmapProps (\{loaded, path} -> {mode,loaded,path})
+  cmapProps (\{loaded, path, dispatch} -> {mode,loaded,path, dispatch})
             (focus _ngramsView _NgramViewA NV.ngramsTableSpec)
 
 authorPageSpec :: Spec State Props Action

src/Gargantext/Pages/Corpus/Tabs/Types.purs

@@ -2,9 +2,11 @@ module Gargantext.Pages.Corpus.Tabs.Types where
 
 import Data.Argonaut (class DecodeJson, decodeJson, (.?), (.??))
 import Data.Maybe (Maybe(..))
+import Effect (Effect)
 --------------------------------------------------------
 import Gargantext.Prelude
 import Gargantext.Components.Node (NodePoly(..))
+import Gargantext.Components.Loader as Loader
 
 newtype CorpusInfo = CorpusInfo { title   :: String
                                 , desc    :: String
@@ -43,7 +45,11 @@ instance decodeCorpusInfo :: DecodeJson CorpusInfo where
     pure $ CorpusInfo {title, desc, query, authors, chart, totalRecords}
 
 -- TODO type Props = {nodeId :: Int, info :: Maybe (NodePoly CorpusInfo) }
-type PropsRow = (path :: Int, loaded :: Maybe (NodePoly CorpusInfo))
+type PropsRow =
+  ( path :: Int
+  , loaded :: Maybe (NodePoly CorpusInfo)
+  , dispatch :: Loader.Action Int -> Effect Unit
+  )
 type Props = Record PropsRow
 
 -- TODO include Gargantext.Pages.Corpus.Tabs.States