DocFocus.purs 2.55 KB
Newer Older
arturo's avatar
arturo committed
1 2 3 4 5 6
module Gargantext.Components.PhyloExplorer.Frame.DocFocus
  ( docFocus
  ) where

import Gargantext.Prelude

7 8
import Data.Maybe (Maybe(..), isJust)
import Data.Tuple.Nested ((/\))
arturo's avatar
arturo committed
9 10 11
import Effect (Effect)
import Gargantext.Components.Bootstrap as B
import Gargantext.Components.Bootstrap.Types (Elevation(..))
12 13 14
import Gargantext.Components.Document.API (loadData)
import Gargantext.Components.Document.Layout (layout)
import Gargantext.Components.Document.Types (LoadedData, DocPath)
arturo's avatar
arturo committed
15
import Gargantext.Components.PhyloExplorer.Types (FrameDoc(..))
16 17 18 19
import Gargantext.Config.REST (logRESTError)
import Gargantext.Hooks.Loader (useLoaderEffect)
import Gargantext.Sessions (Session)
import Gargantext.Types (CTabNgramType(..), TabSubType(..), TabType(..))
arturo's avatar
arturo committed
20 21 22 23 24 25
import Gargantext.Utils.Reactix as R2
import Reactix as R
import Reactix.DOM.HTML as H


here :: R2.Here
26
here = R2.here "Gargantext.Components.PhyloExplorer.Frame.DocFocus"
arturo's avatar
arturo committed
27 28

type Props =
29
  ( frameDoc  :: FrameDoc
arturo's avatar
arturo committed
30 31 32 33
  , session       :: Session
  , closeCallback :: Unit -> Effect Unit
  )

34
docFocus :: R2.Leaf ( key :: String | Props )
arturo's avatar
arturo committed
35 36
docFocus = R2.leaf docFocusCpt

37
docFocusCpt :: R.Component ( key :: String | Props )
arturo's avatar
arturo committed
38 39 40 41 42
docFocusCpt = here.component "main" cpt where
  cpt { frameDoc: FrameDoc { docId, listId, corpusId }
      , session
      , closeCallback
      } _ = do
43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71
    -- | States
    -- |
    state' /\ state <- R2.useBox' (Nothing :: Maybe LoadedData)

    -- | Computed
    -- |
    let

      tabType :: TabType
      tabType = TabDocument (TabNgramType CTabTerms)

      path :: DocPath
      path =
        { listIds: [listId]
        , mCorpusId: Just corpusId
        , nodeId: docId
        , session
        , tabType
        }

    -- | Hooks
    -- |
    useLoaderEffect
      { errorHandler: logRESTError here "[docFocus]"
      , loader: loadData
      , path
      , state
      }

arturo's avatar
arturo committed
72 73 74 75
    -- | Render
    -- |
    pure $

76

arturo's avatar
arturo committed
77
      H.div
78
      { className: "phylo-doc-focus" }
arturo's avatar
arturo committed
79
      [
80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103
        B.cloak
        { isDisplayed: isJust state'
        , idlingPhaseDuration: Just 150
        , cloakSlot:
            B.preloader
            {}

        , defaultSlot:
            R2.fromMaybe state' \loaded ->
              layout
              { loaded
              , path
              , sideControlsSlot: Just $
                  H.div
                  { className: "phylo-doc-focus__header" }
                  [
                    B.iconButton
                    { name: "times"
                    , elevation: Level2
                    , callback: closeCallback
                    }
                  ]
              }
        }
arturo's avatar
arturo committed
104
      ]