From 872d4941980f2b6f75b7e9950bd75b6764a2da56 Mon Sep 17 00:00:00 2001 From: Przemek Kaminski <pk@intrepidus.pl> Date: Wed, 4 Sep 2019 07:17:07 +0200 Subject: [PATCH] [DocsTable] fix tableElt initial state This was reinitialized after each component refresh. Now state is passed so that table interaction works (change current page, order by etc). --- src/Gargantext/Components/DocsTable.purs | 53 ++++++++++++------------ src/Gargantext/Components/Table.purs | 21 +++++++--- 2 files changed, 43 insertions(+), 31 deletions(-) diff --git a/src/Gargantext/Components/DocsTable.purs b/src/Gargantext/Components/DocsTable.purs index e492f4c3..d370f670 100644 --- a/src/Gargantext/Components/DocsTable.purs +++ b/src/Gargantext/Components/DocsTable.purs @@ -261,7 +261,7 @@ loadPage {nodeId, tabType, query, listId, corpusId, params: {limit, offset, orde convOrderBy _ = DateAsc -- TODO renderPage :: R.State T.Params -> PageLoaderProps -> Array DocumentsView -> R.Element -renderPage (_ /\ setTableParams) p res = R.createElement el p [] +renderPage (tableParams /\ setTableParams) p res = R.createElement el p [] where el = R.hooksComponent "RenderPage" cpt @@ -275,10 +275,11 @@ renderPage (_ /\ setTableParams) p res = R.createElement el p [] cpt {nodeId, corpusId, listId, totalRecords} _children = do localCategories <- R.useState' (mempty :: LocalCategories) - pure $ R2.buff $ T.tableElt + pure $ R2.buff $ T.tableEltWithInitialState + (T.paramsState tableParams) { rows: rows localCategories -- , setParams: \params -> liftEffect $ loaderDispatch (Loader.SetPath {nodeId, tabType, listId, corpusId, params, query}) - , setParams: \params -> setTableParams $ const params + , setParams: setTableParams <<< const , container: T.defaultContainer { title: "Documents" } , colNames: T.ColumnName <$> @@ -293,29 +294,29 @@ renderPage (_ /\ setTableParams) p res = R.createElement el p [] where getCategory (localCategories /\ _) {_id, category} = maybe category identity (localCategories ^. at _id) rows localCategories = (\(DocumentsView r) -> - let cat = getCategory localCategories r - isDel = Trash == cat in - { row: map R2.scuff $ [ - H.div {} - [ H.a { className: gi cat - , style: trashStyle cat - , on: {click: onClick localCategories Favorite r._id cat} - } [] - ] - , H.input { type: "checkbox" - , checked: isDel - , on: {click: onClick localCategories Trash r._id cat} - } - -- TODO show date: Year-Month-Day only - , H.div { style: trashStyle cat } [ H.text (show r.date) ] - , H.a { href: toLink $ (corpusDocument corpusId) listId r._id - , style: trashStyle cat - , target: "_blank" - } [ H.text r.title ] - , H.div { style: trashStyle cat} [ H.text r.source ] - ] - , delete: true - }) <$> res + let cat = getCategory localCategories r + isDel = Trash == cat in + { row: map R2.scuff $ [ + H.div {} + [ H.a { className: gi cat + , style: trashStyle cat + , on: {click: onClick localCategories Favorite r._id cat} + } [] + ] + , H.input { type: "checkbox" + , checked: isDel + , on: {click: onClick localCategories Trash r._id cat} + } + -- TODO show date: Year-Month-Day only + , H.div { style: trashStyle cat } [ H.text (show r.date) ] + , H.a { href: toLink $ (corpusDocument corpusId) listId r._id + , style: trashStyle cat + , target: "_blank" + } [ H.text r.title ] + , H.div { style: trashStyle cat} [ H.text r.source ] + ] + , delete: true + }) <$> res onClick (_ /\ setLocalCategories) catType nid cat = \_-> do let newCat = if (catType == Favorite) then (favCategory cat) else (trashCategory cat) setLocalCategories $ insert nid newCat diff --git a/src/Gargantext/Components/Table.purs b/src/Gargantext/Components/Table.purs index 640d4684..da9835e5 100644 --- a/src/Gargantext/Components/Table.purs +++ b/src/Gargantext/Components/Table.purs @@ -1,21 +1,21 @@ module Gargantext.Components.Table where +import Gargantext.Prelude + import Data.Array (filter) -import Data.Maybe (Maybe(..), maybe) import Data.Either (Either(..)) import Data.Generic.Rep (class Generic) import Data.Generic.Rep.Show (genericShow) +import Data.Maybe (Maybe(..), maybe) import Effect (Effect) import Effect.Class (liftEffect) +import Gargantext.Utils.Reactix as R2 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, StateCoTransformer, createClass) import Unsafe.Coerce (unsafeCoerce) -import Gargantext.Prelude -import Gargantext.Utils.Reactix as R2 - type TableContainerProps = { pageSizeControl :: ReactElement , pageSizeDescription :: ReactElement @@ -132,7 +132,7 @@ tableSpec = simpleSpec performAction render where modifyStateAndReload :: (State -> State) -> Props -> State -> StateCoTransformer State Unit modifyStateAndReload f {setParams} state = do - logs "modifyStateAndReload" -- TODO rename + --logs "modifyStateAndReload" -- TODO rename modifyState_ f liftEffect $ setParams $ stateParams $ f state @@ -209,12 +209,23 @@ stateParams {pageSize, currentPage, orderBy} = {offset, limit, orderBy} limit = pageSizes2Int pageSize offset = limit * (currentPage - 1) +paramsState :: Params -> State +paramsState {offset, limit, orderBy} = {pageSize, currentPage, orderBy} + where + pageSize = string2PageSize $ show limit + currentPage = (offset / limit) + 1 + tableClass :: ReactClass {children :: Children | Props'} tableClass = createClass "Table" tableSpec (const initialState) tableElt :: Props -> ReactElement tableElt props = createElement tableClass props [] +tableEltWithInitialState :: State -> Props -> ReactElement +tableEltWithInitialState state props = createElement tc props [] + where + tc = createClass "Table" tableSpec (const state) + sizeDD :: PageSizes -> (Action -> Effect Unit) -> ReactElement sizeDD ps d = span [] -- 2.21.0