Commit 7b97b8dc authored by Przemyslaw Kaminski's avatar Przemyslaw Kaminski

[documents] Refactor Documents view to reactix

parent ccaf9251
......@@ -5,9 +5,13 @@ import Data.Traversable (traverse_)
import React as React
import React (ReactClass, ReactElement, Children)
import React.DOM (div')
import Gargantext.Prelude
import Effect (Effect)
import Effect.Timer (IntervalId, setInterval, clearInterval)
import Effect.Timer (IntervalId, TimeoutId, setInterval, clearInterval, setTimeout, clearTimeout)
import Reactix as R
import Reactix.DOM.HTML as H
import Gargantext.Prelude
data Action = Update
......@@ -27,7 +31,7 @@ autoUpdateClass =
pure { state: {intervalId: Nothing}
, render: pure $ div' []
, componentDidMount: do
{duration,effect} <- React.getProps this
{duration, effect} <- React.getProps this
intervalId <- setInterval duration effect
React.setState this {intervalId: Just intervalId}
, componentWillUnmount: do
......@@ -37,3 +41,25 @@ autoUpdateClass =
autoUpdateElt :: Props -> ReactElement
autoUpdateElt props = React.createElement autoUpdateClass props []
autoUpdate :: Record PropsRow -> R.Element
autoUpdate props = R.createElement autoUpdateCpt props []
autoUpdateCpt :: R.Component PropsRow
autoUpdateCpt = R.hooksComponent "G.C.AU.autoUpdate" cpt
where
cpt { duration, effect } _ = do
intervalRef <- R.useRef Nothing
R.useEffect' $ do
let mInterval = R.readRef intervalRef
case mInterval of
Nothing -> do
intervalId <- setInterval duration effect
R.setRef intervalRef $ Just intervalId
Just intervalId -> do
clearInterval intervalId
intervalId <- setInterval duration effect
R.setRef intervalRef $ Just intervalId
pure $ H.div {} []
......@@ -68,6 +68,10 @@ import Data.Either (Either(..))
import Data.Foldable (class Foldable, foldMap, foldl, foldr)
import Data.FoldableWithIndex (class FoldableWithIndex, foldMapWithIndex, foldlWithIndex, foldrWithIndex)
import Data.FunctorWithIndex (class FunctorWithIndex, mapWithIndex)
import Data.Generic.Rep (class Generic)
import Data.Generic.Rep.Eq (genericEq)
import Data.Generic.Rep.Ord (genericCompare)
import Data.Generic.Rep.Show (genericShow)
import Data.Lens (Iso', Lens', use, view, (%=), (.~), (?=), (^?))
import Data.Lens.At (class At, at)
import Data.Lens.Common (_Just)
......@@ -143,8 +147,13 @@ initialPageParams session nodeId listIds tabType =
newtype NgramsTerm = NormNgramsTerm String
derive instance eqNgramsTerm :: Eq NgramsTerm
derive instance ordNgramsTerm :: Ord NgramsTerm
derive instance genericNgramsTerm :: Generic NgramsTerm _
instance eqNgramsTerm :: Eq NgramsTerm where
eq = genericEq
instance ordNgramsTerm :: Ord NgramsTerm where
compare = genericCompare
instance showNgramsTerm :: Show NgramsTerm where
show = genericShow
instance encodeJsonNgramsTerm :: EncodeJson NgramsTerm where
encodeJson (NormNgramsTerm s) = encodeJson s
......@@ -692,7 +701,7 @@ syncPatches props { ngramsLocalPatch: ngramsLocalPatch@{ngramsNewElems, ngramsPa
}
syncPatchesR :: forall p s. CoreParams p -> R.State (CoreState s) -> Effect Unit
syncPatchesR props ({ ngramsLocalPatch: ngramsLocalPatch@{ngramsNewElems, ngramsPatches}
syncPatchesR props ({ ngramsLocalPatch: ngramsLocalPatch@{ ngramsNewElems, ngramsPatches }
, ngramsStagePatch
, ngramsValidPatch
, ngramsVersion
......
module Gargantext.Components.Nodes.Corpus.Document where
import Prelude (class Show, bind, mempty, pure, ($), (<>))
import Data.Argonaut (class DecodeJson, decodeJson, (.:), (.:?))
import Data.Generic.Rep (class Generic)
import Data.Generic.Rep.Show (genericShow)
import Data.Maybe (Maybe(..), fromMaybe)
import Data.Tuple (fst)
import Data.Tuple.Nested ((/\))
import Effect (Effect)
import Effect.Aff (Aff)
import React (ReactClass, Children)
import React.DOM (div, h4, li, p, span, text, ul)
import React.DOM.Props (className)
import Reactix as R
import Thermite (PerformAction, Render, Spec, simpleSpec, createClass)
import Reactix.DOM.HTML as H
import Gargantext.Components.AutoUpdate (autoUpdateElt)
import Gargantext.Prelude
import Gargantext.Components.AutoUpdate ( autoUpdate)
import Gargantext.Components.Node (NodePoly(..))
import Gargantext.Components.NgramsTable.Core
( CoreState, NgramsPatch(..), NgramsTerm, Replace, Versioned(..)
, VersionedNgramsTable, addNewNgram, applyNgramsTablePatch, commitPatch
, loadNgramsTable, replace, singletonNgramsTablePatch, syncPatches )
, VersionedNgramsTable, addNewNgram, applyNgramsTablePatch, commitPatchR
, loadNgramsTable, replace, singletonNgramsTablePatch, syncPatchesR )
import Gargantext.Components.Annotation.AnnotatedField as AnnotatedField
import Gargantext.Hooks.Loader (useLoader)
import Gargantext.Routes (SessionRoute(..))
......@@ -27,11 +28,13 @@ import Gargantext.Utils as U
import Gargantext.Utils.Reactix as R2
type DocPath =
{ nodeId :: Int
{
corpusId :: Maybe Int
, listIds :: Array Int
, corpusId :: Maybe Int
, nodeId :: Int
, session :: Session
, tabType :: TabType
, session :: Session }
}
type NodeDocument = NodePoly Document
......@@ -40,10 +43,10 @@ type LoadedData =
, ngramsTable :: VersionedNgramsTable
}
type Props =
{ loaded :: LoadedData
type Props = (
loaded :: LoadedData
, path :: DocPath
}
)
-- This is a subpart of NgramsTable.State.
type State = CoreState ()
......@@ -294,88 +297,104 @@ instance decodeDocument :: DecodeJson Document
--, text
}
docViewSpec :: Spec State Props Action
docViewSpec = simpleSpec performAction render
where
performAction :: PerformAction State Props Action
performAction Synchronize {path} state = do
syncPatches path state
performAction (SetTermListItem n pl) _ {ngramsVersion} =
commitPatch (Versioned {version: ngramsVersion, data: pt})
where
pe = NgramsPatch { patch_list: pl, patch_children: mempty }
pt = singletonNgramsTablePatch n pe
performAction (AddNewNgram ngram termList) _ {ngramsVersion} =
commitPatch (Versioned {version: ngramsVersion, data: pt})
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
where
pt = addNewNgram ngram termList
cpt { loaded, path } _ = do
state <- R.useState' $ initialState { loaded }
render :: Render State Props Action
render dispatch { loaded: { ngramsTable: Versioned { data: initTable }, document } }
{ ngramsLocalPatch
, ngramsValidPatch
}
_reactChildren =
[ autoUpdateElt { duration: 3000
, effect: dispatch Synchronize
}
, div [className "container1"]
pure $ docView { loaded, path, state }
type DocViewProps = (
state :: R.State State
| Props
)
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
where
cpt props@{ loaded: loaded@{ ngramsTable: Versioned { data: initTable }, document }, state } _ = do
pure $ H.div {} [
autoUpdate { duration: 3000, effect: dispatch Synchronize }
, H.div { className: "container1" }
[
div [className "row"]
R2.row
[
div [className "col-md-8"]
[ h4 [] [annotate doc.title]
, ul [className "list-group"]
[ li' [ span [] [text' doc.source]
R2.col 8
[ H.h4 {} [ annotate state doc.title ]
, H.ul { className: "list-group" }
[ li' [ H.span {} [ text' doc.source ]
, badge "source"
]
-- TODO add href to /author/ if author present in
, li' [ span [] [text' doc.authors]
, li' [ H.span {} [ text' doc.authors ]
, badge "authors"
]
, li' [ span [] [text $ publicationDate $ Document doc]
, li' [ H.span {} [ H.text $ publicationDate $ Document doc ]
, badge "date"
]
]
, badge "abstract"
, annotate doc.abstract
, div [className "jumbotron"]
[ p [] [text "Empty Full Text"]
, annotate state doc.abstract
, H.div { className: "jumbotron" }
[ H.p {} [ H.text "Empty Full Text" ]
]
]
]
]
]
where
ngramsTable = applyNgramsTablePatch (ngramsLocalPatch <> ngramsValidPatch) initTable
setTermList ngram Nothing newList = dispatch $ AddNewNgram ngram newList
setTermList ngram (Just oldList) newList = dispatch $ SetTermListItem ngram (replace oldList newList)
annotate text = R2.scuff $ AnnotatedField.annotatedField { ngrams: ngramsTable, setTermList, text }
li' = li [className "list-group-item justify-content-between"]
text' x = text $ fromMaybe "Nothing" x
badge s = span [className "badge badge-default badge-pill"] [text s]
dispatch :: Action -> Effect Unit
dispatch (AddNewNgram ngram termList) = do
commitPatchR (Versioned {version, data: pt}) state
where
({ ngramsVersion: version } /\ _) = state
pt = addNewNgram ngram termList
dispatch (SetTermListItem ngram termList) = do
commitPatchR (Versioned {version, data: pt}) state
where
({ ngramsVersion: version } /\ _) = state
pe = NgramsPatch { patch_list: termList, patch_children: mempty }
pt = singletonNgramsTablePatch ngram pe
dispatch Synchronize = do
syncPatchesR props.path props.state
annotate state text = AnnotatedField.annotatedField { ngrams: ngramsTable state
, setTermList: setTermList state
, text }
badge s = H.span { className: "badge badge-default badge-pill" } [ H.text s ]
li' = H.li { className: "list-group-item justify-content-between" }
ngramsTable ({ ngramsLocalPatch, ngramsValidPatch } /\ _) = applyNgramsTablePatch (ngramsLocalPatch <> ngramsValidPatch) initTable
setTermList state ngram Nothing newList = dispatch (AddNewNgram ngram newList)
setTermList state ngram (Just oldList) newList = dispatch (SetTermListItem ngram (replace oldList newList))
text' x = H.text $ fromMaybe "Nothing" x
NodePoly {hyperdata : Document doc} = document
docViewClass :: ReactClass { children :: Children
, loaded :: LoadedData
, path :: DocPath
}
docViewClass = createClass "DocumentView" docViewSpec initialState
type LayoutProps = ( session :: Session, nodeId :: Int, listId :: Int, corpusId :: Maybe Int )
type LayoutProps = (
corpusId :: Maybe Int
, listId :: Int
, nodeId :: Int
, session :: Session
)
documentLayout :: Record LayoutProps -> R.Element
documentLayout props = R.createElement documentLayoutCpt props []
documentLayoutCpt :: R.Component LayoutProps
documentLayoutCpt = R.hooksComponent "G.P.Corpus.Document.documentLayout" cpt
documentLayoutCpt = R.hooksComponent "G.C.N.C.D.documentLayout" cpt
where
cpt {session, nodeId, listId, corpusId} _ = do
useLoader path loadData $ \loaded ->
R2.createElement' docViewClass {path, loaded} []
docViewWrapper {path, loaded}
where
tabType = TabDocument (TabNgramType CTabTerms)
path = {session, nodeId, listIds: [listId], corpusId, tabType}
path = { corpusId, listIds: [listId], nodeId, session, tabType }
------------------------------------------------------------------------
......
......@@ -253,7 +253,7 @@ row :: Array R.Element -> R.Element
row children = H.div { className: "row" } children
col :: Int -> Array R.Element -> R.Element
col n children = H.div { className : "col-md" <> show n } children
col n children = H.div { className : "col-md-" <> show n } children
innerText :: DOM.Element -> String
innerText e = e .. "innerText"
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment