Layout.purs 12.8 KB
Newer Older
arturo's avatar
arturo committed
1 2 3 4 5 6
module Gargantext.Components.Document.Layout
  ( layout
  ) where

import Gargantext.Prelude

7
import Data.Array as A
8
import Data.Lens ((^.))
9
import Data.Map as Map
10
import Data.Maybe (Maybe(..), fromMaybe, isJust, maybe)
arturo's avatar
arturo committed
11
import Data.Ord (greaterThan)
12 13
import Data.Set (Set)
import Data.Set as Set
arturo's avatar
arturo committed
14
import Data.String (length)
arturo's avatar
arturo committed
15
import Data.String as String
16
import Data.Tuple (Tuple(..))
arturo's avatar
arturo committed
17
import Data.Tuple.Nested ((/\))
18
import Effect.Class (liftEffect)
arturo's avatar
arturo committed
19
import Gargantext.Components.Annotation.Field as AnnotatedField
20
import Gargantext.Components.Annotation.Types as AFT
arturo's avatar
arturo committed
21 22
import Gargantext.Components.AutoUpdate (autoUpdate)
import Gargantext.Components.Bootstrap as B
arturo's avatar
arturo committed
23
import Gargantext.Components.Bootstrap.Types (ComponentStatus(..), SpinnerTheme(..))
24
import Gargantext.Components.Category (ratingSimpleLoader)
arturo's avatar
arturo committed
25
import Gargantext.Components.Document.Types (DocPath, Document(..), LoadedData, initialState)
26
import Gargantext.Components.GraphQL.Endpoints (getContextNgrams)
27
import Gargantext.Components.NgramsTable.AutoSync (useAutoSync)
arturo's avatar
arturo committed
28
import Gargantext.Components.Node (NodePoly(..))
29
import Gargantext.Core.NgramsTable.Functions (addNewNgramA, applyNgramsPatches, coreDispatch, findNgramRoot, setTermListA, computeCache)
30
import Gargantext.Core.NgramsTable.Types (CoreAction(..), NgramsTable(..), NgramsTerm, State, Versioned(..), replace)
arturo's avatar
arturo committed
31
import Gargantext.Hooks.FirstEffect (useFirstEffect')
32 33
import Gargantext.Hooks.Loader (useLoader)
import Gargantext.Sessions (Session)
arturo's avatar
arturo committed
34
import Gargantext.Utils ((?))
arturo's avatar
arturo committed
35 36 37 38
import Gargantext.Utils as U
import Gargantext.Utils.Reactix as R2
import Reactix as R
import Reactix.DOM.HTML as H
39
import Record as Record
40
import Toestand as T
arturo's avatar
arturo committed
41

42 43 44
-------------------------------------------------------------------------


45 46 47
here :: R2.Here
here = R2.here "Gargantext.Components.Document.Layout"

48

arturo's avatar
arturo committed
49 50 51
type Props =
  ( loaded   :: LoadedData
  , path     :: DocPath
52
  , session  :: Session
53
  | Options
arturo's avatar
arturo committed
54 55
  )

56 57 58 59 60 61 62 63 64 65 66
type Options =
  ( sideControlsSlot :: Maybe R.Element
  )

options :: Record Options
options =
  { sideControlsSlot: Nothing
  }

layout :: forall r. R2.OptLeaf Options Props r
layout = R2.optLeaf layoutCpt options
arturo's avatar
arturo committed
67
layoutCpt :: R.Component Props
68 69 70 71
layoutCpt = R2.hereComponent here "layout" hCpt where
  hCpt hp props@{ path: path@{ listIds
                             , nodeId }
                , session } _ = do
72 73 74
    case A.head listIds of
      Nothing -> pure $ H.div {} [ H.text "No list supplied!" ]
      Just listId ->
75
        useLoader { errorHandler: Nothing
76
                  , herePrefix: hp
77
                  , loader: \p -> getContextNgrams session p.contextId p.listId
78
                  , path: { contextId: nodeId, listId }
79 80
                  , render: \contextNgrams ->
                      layoutWithContextNgrams $ Record.merge props { contextNgrams } }
81 82 83 84 85 86 87 88 89

type WithContextNgramsProps =
  ( contextNgrams :: Array NgramsTerm
  | Props )

layoutWithContextNgrams :: forall r. R2.OptLeaf Options WithContextNgramsProps r
layoutWithContextNgrams = R2.optLeaf layoutWithContextNgramsCpt options
layoutWithContextNgramsCpt :: R.Component WithContextNgramsProps
layoutWithContextNgramsCpt = here.component "layoutWithContextNgrams" cpt where
arturo's avatar
arturo committed
90
  -- Component
91
  cpt { contextNgrams
arturo's avatar
arturo committed
92
      , loaded:
93 94 95
          loaded@{ ngramsTable: Versioned { data: initTable }
                 , document: NodePoly { hyperdata: Document doc }
                 }
96
      , path
97
      , sideControlsSlot
arturo's avatar
arturo committed
98 99 100 101
      } _ = do
    -- | States
    -- |

102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117
    contextNgramsS <- T.useBox contextNgrams
    contextNgrams' <- T.useLive T.unequal contextNgramsS

    -- ngrams <- T.useBox initTable
    -- ngrams' <- T.useLive T.unequal ngrams
    state <- T.useBox $ initialState { loaded }
    state'@{ ngramsLocalPatch } <- T.useLive T.unequal state
    let ngrams' = applyNgramsPatches state' initTable

    -- R.useEffect' $ do
    --   let (NgramsTable { ngrams_repo_elements: nre }) = ngrams'
    --   let nre' = Map.mapMaybeWithKey (\k v -> Just { k, v }) nre
    --   here.log2 "[layout] nre" $ A.fromFoldable nre'
    --   here.log2 "[layout] contextNgrams" contextNgrams
    --   here.log2 "[layout] contextNgrams'" contextNgrams'
    --   here.log2 "[layout] state'" state'
118
    --   here.log2 "[layout] ngrams'" ngrams'
arturo's avatar
arturo committed
119

120
    mode' /\ mode <- R2.useBox' AFT.EditionMode
arturo's avatar
arturo committed
121

arturo's avatar
arturo committed
122
    let dispatch = coreDispatch path state
arturo's avatar
arturo committed
123 124 125 126 127 128 129 130
    { onPending, result } <- useAutoSync { state, action: dispatch }

    onPending' <- R2.useLive' onPending
    result'    <- R2.useLive' result

    -- | Computed
    -- |
    let
arturo's avatar
arturo committed
131

arturo's avatar
arturo committed
132 133
      withAutoUpdate = false

134
      -- ngrams = applyNgramsPatches state' initTable
135

136
      cache = computeCache ngrams' $ Set.fromFoldable contextNgrams'
arturo's avatar
arturo committed
137 138 139 140 141 142

      setTermListOrAddA ngram Nothing        =
        addNewNgramA ngram
      setTermListOrAddA ngram (Just oldList) =
        setTermListA ngram <<< replace oldList

143 144 145 146 147 148 149
      setTermList ngram mOldList termList = do
        let root = findNgramRoot ngrams' ngram
        -- here.log2 "[setTermList] ngram" ngram
        -- here.log2 "[setTermList] root" root
        let patch = setTermListOrAddA root mOldList termList
        -- here.log2 "[setTermList] patch" patch
        dispatch patch
150 151 152 153
        -- T.write_ (applyNgramsPatches state' initTable) ngrams
        case mOldList of
          Nothing -> T.write_ (contextNgrams' <> [ root ]) contextNgramsS
          Just _ -> pure unit
154
        -- here.log2 "[setTermList] calling reload" reload'
155
        -- T2.reload reload
arturo's avatar
arturo committed
156 157 158

      hasAbstract =  maybe false (not String.null) doc.abstract

159
      annotate text = AnnotatedField.annotatedField
160
                      { ngrams'
161 162 163 164 165 166
                      , setTermList
                      , text
                      , mode: mode'
                      , cache
                      }

arturo's avatar
arturo committed
167 168 169
    -- | Hooks
    -- |

170 171 172 173 174
    -- R.useEffect' $ do
    --   let NgramsTable { ngrams_repo_elements } = ngrams
    --   here.log2 "[layout] length of ngrams" $ Map.size ngrams_repo_elements
    --   here.log2 "[layout] length of pats" $ A.length cache.pats
    --   here.log2 "[layout] contextNgrams" contextNgrams
arturo's avatar
arturo committed
175

176 177 178 179 180
    -- | Behaviors
    -- |
    let
      onModeChange = read >>> fromMaybe AFT.EditionMode >>> flip T.write_ mode

181 182 183 184 185 186 187 188
    -- R.useEffect' $ do
    --   here.log2 "[layoutWithContextNgrams] cache" cache
    --   here.log2 "[layoutWithContextNgrams] ngramsLocalPatch" ngramsLocalPatch
    --   let NgramsTable { ngrams_repo_elements: nre } = initTable
    --   here.log2 "[layoutWithContextNgrams] ngrams_repo_elements" $ A.fromFoldable $ Map.keys nre
    --   let NgramsTable { ngrams_repo_elements: nre' } = ngrams'
    --   here.log2 "[layoutWithContextNgrams] ngrams (after apply patches)" $ A.fromFoldable $ Map.keys nre'

arturo's avatar
arturo committed
189 190 191 192 193 194 195 196 197 198 199
    -- | Render
    -- |
    pure $

      H.div
      { className: "document-layout" }
      --DEBUG
      --[ H.pre { rows: 30 } [
      --    H.text (stringifyWithIndent 2 (encodeJson (fst state)))
      --  ] ] <>
      [
200
        -- Header
arturo's avatar
arturo committed
201
        H.div
202
        { className: "document-layout__header" }
arturo's avatar
arturo committed
203
        [
204 205
          H.div
          { className: "document-layout__main-controls" }
arturo's avatar
arturo committed
206
          [
207 208
            -- Viewing mode
            B.wad
arturo's avatar
arturo committed
209
            [ "d-flex", "align-items-center", "width-auto" ]
210 211 212 213 214 215 216 217 218 219 220 221
            [
              H.label
              { className: "mr-1"
              }
              [
                B.icon
                { name: "tags" }
              ]
            ,
              B.formSelect
              { value: show mode'
              , callback: onModeChange
222
              , status: Enabled
223 224 225 226 227 228 229 230 231 232 233
              }
              [
                H.option
                { value: show AFT.AdditionMode }
                [ H.text "Add terms only" ]
              ,
                H.option
                { value: show AFT.EditionMode }
                [ H.text "Add and edit terms" ]
              ]
            ]
arturo's avatar
arturo committed
234
          ,
235 236 237 238 239
            R2.when withAutoUpdate $
              -- (?) purpose? would still working with current code?
              autoUpdate
              { duration: 5000
              , effect: dispatch $ Synchronize
240 241
                { afterSync: \_ -> do
                                   liftEffect $ here.log "[autoSync] synchronize war run"
242 243 244 245 246 247 248 249
                }
              }
          -- @NOTE #386: revert manual for automatic sync
          --   syncResetButtons
          --   { afterSync
          --   , ngramsLocalPatch
          --   , performAction: dispatch
          --   }
arturo's avatar
arturo committed
250

arturo's avatar
arturo committed
251 252 253
          ]
        ,
          H.div
254
          { className: "document-layout__side-controls" }
arturo's avatar
arturo committed
255
          [
256
            -- Saving informations
arturo's avatar
arturo committed
257
            H.div
258
            { className: "document-layout__saving" }
arturo's avatar
arturo committed
259
            [
260 261 262 263 264 265 266 267 268
              R2.when' onPending'
              [
                B.spinner
                { theme: GrowTheme
                , className: "document-layout__saving__spinner"
                }
              ]
            ,
              R2.when (not onPending' && isJust result') $
arturo's avatar
arturo committed
269

270 271 272 273 274
                B.icon
                { name: "check"
                , className: "document-layout__saving__icon"
                }
            ]
arturo's avatar
arturo committed
275
          ,
276
            R2.fromMaybe sideControlsSlot identity
arturo's avatar
arturo committed
277
          ]
278
        ]
arturo's avatar
arturo committed
279
      ,
280 281 282 283
        -- Body
        H.div
        { className: "document-layout__body" }
        [
arturo's avatar
arturo committed
284
          H.div
285
          { className: "document-layout__title d-flex" }
arturo's avatar
arturo committed
286
          [
287
            H.div
288
            { className: "document-layout__title__content" -- <> collapsibleClasses <> " variant-collapse-higher"
289 290 291 292
                , id: getIdName "title" }
            [
              annotate doc.title
            ]
293 294
          -- ,
          --   btnSeeMore "title"
arturo's avatar
arturo committed
295
          ]
296 297
        ,
          R2.fromMaybe doc.authors \authors ->
arturo's avatar
arturo committed
298 299

            H.div
300
            { className: "document-layout__authors justify-content-space-between" }
arturo's avatar
arturo committed
301
            [
302 303 304 305 306
              B.div'
              { className: "document-layout__authors__label" }
              "Authors"
            ,
              H.div
307
              { className: "document-layout__authors__content w-100" -- <> collapsibleClasses
308
              , id: getIdName "authors" }
309 310 311 312
              [
                -- @NOTE #386: annotate for "Authors" ngrams list
                annotate (Just authors)
              ]
313 314
            -- ,
            --   btnSeeMore "authors"
arturo's avatar
arturo committed
315
            ]
316 317 318 319
        ,
          R2.fromMaybe doc.source \source ->

            H.div
320
            { className: "document-layout__source justify-content-space-between" }
321 322 323 324 325 326
            [
              B.div'
              { className: "document-layout__source__label" }
              "Source"
            ,
              B.div'
327
              { className: "document-layout__source__content w-100" -- <> collapsibleClasses
328
              , id: getIdName "sources" }
329
              source
330
            -- ,
331
            --   btnSeeMore "sources"
332 333 334 335 336 337 338 339 340 341 342 343 344
            ]
        ,
            H.div
            { className: "document-layout__date" }
            [
              B.div'
              { className: "document-layout__date__label" }
              "Date"
            ,
              B.div'
              { className: "document-layout__date__content" }
              (publicationDate $ Document doc)
            ]
345 346 347 348 349
        , case path.mCorpusId of
            Nothing -> H.div {} []
            Just corpusId -> ratingSimpleLoader { docId: path.nodeId
                                                , corpusId
                                                , session: path.session  } []
350 351 352 353 354 355 356 357 358 359 360 361 362 363 364 365 366 367 368 369
        ,
          R2.when hasAbstract $

            H.div
            { className: "document-layout__abstract" }
            [
              B.div'
              { className: "document-layout__separator-label" }
              "Abstract"
            ,
              H.div
              { className: "document-layout__abstract__content" }
              [
                annotate doc.abstract
              ]
            ]
        -- (?) remove "Full text" block (unused feature for now,
        --     see #334)
        -- , H.div { className: "jumbotron" } [ H.p {} [ H.text "Empty Full Text" ] ]
        ]
arturo's avatar
arturo committed
370 371 372 373 374 375 376 377 378 379
      ]


-------------------------------------------------------------

publicationDate :: Document -> String
publicationDate (Document {publication_year: Nothing}) = ""
publicationDate (Document {publication_year: Just py, publication_month: Nothing}) = U.zeroPad 2 py
publicationDate (Document {publication_year: Just py, publication_month: Just pm, publication_day: Nothing}) = (U.zeroPad 2 py) <> "-" <> (U.zeroPad 2 pm)
publicationDate (Document {publication_year: Just py, publication_month: Just pm, publication_day: Just pd}) = (U.zeroPad 2 py) <> "-" <> (U.zeroPad 2 pm) <> "-" <> (U.zeroPad 2 pd)
380 381


382
-- btnSeeMore :: String -> R.Element
383
-- btnSeeMore idStr =
384 385 386 387 388 389 390
--   H.a { role: "button"
--   , className: "collapsed btn-seemore text-primary"
--   , data: { toggle: "collapse" }
--   , aria: { expanded: false, controls: getIdName idStr }
--   , href: "#" <> getIdName idStr
--   }
--   [ H.text "" ]
391 392 393 394

getIdName :: String -> String
getIdName str = "annotated-field-expand__" <> str

395
-- collapsibleClasses :: String
396
-- collapsibleClasses = " annotated-field-expand collapse"