Tabs.purs 7.83 KB
Newer Older
1
module Gargantext.Components.Nodes.Lists.Tabs where
2

arturo's avatar
arturo committed
3 4
import Gargantext.Components.Nodes.Lists.Types hiding (here)

5
import Data.Array as A
6
import Data.Maybe (Maybe(..), fromMaybe)
7
import Data.Tuple.Nested ((/\))
8
import Effect.Class (liftEffect)
arturo's avatar
arturo committed
9
import Gargantext.Components.App.Store (Boxes)
10
import Gargantext.Components.NgramsTable as NT
11
import Gargantext.Core.NgramsTable.Functions as NTC
12
import Gargantext.Components.Nodes.Corpus.Chart.Metrics (metrics)
13
import Gargantext.Components.Nodes.Corpus.Chart.Pie (pie, bar)
14
import Gargantext.Components.Nodes.Corpus.Chart.Tree (tree)
15
import Gargantext.Components.Nodes.Corpus.Chart.Utils (mNgramsTypeFromTabType)
16
import Gargantext.Components.Nodes.Corpus.Types (CorpusData)
17
import Gargantext.Components.Tab as Tab
arturo's avatar
arturo committed
18
import Gargantext.Components.Table.Types (Params)
19
import Gargantext.Core.NgramsTable.Types (PageParams)
arturo's avatar
arturo committed
20
import Gargantext.Prelude (bind, pure, unit, ($))
21
import Gargantext.Sessions (Session)
22
import Gargantext.Types (CTabNgramType(..), Mode(..), TabSubType(..), TabType(..), modeTabType)
23
import Gargantext.Utils.Reactix as R2
James Laver's avatar
James Laver committed
24
import Gargantext.Utils.Toestand as T2
25 26 27 28
import Reactix as R
import Record as Record
import Record.Extra as RX
import Toestand as T
29

James Laver's avatar
James Laver committed
30 31
here :: R2.Here
here = R2.here "Gargantext.Components.Nodes.Lists.Tabs"
32

33
type Props = (
34 35 36 37 38 39
    activeTab  :: T.Box Int
  , boxes      :: Boxes
  , cacheState :: T.Box CacheState
  , corpusData :: CorpusData
  , corpusId   :: Int
  , session    :: Session
40
  )
41

arturo's avatar
arturo committed
42
tabs :: Record ( key :: String | Props ) -> R.Element
43
tabs props = R.createElement tabsCpt props []
arturo's avatar
arturo committed
44
tabsCpt :: R.Component ( key :: String | Props )
James Laver's avatar
James Laver committed
45
tabsCpt = here.component "tabs" cpt where
46 47
  cpt props@{ activeTab } _ = do
    pure $ Tab.tabs { activeTab
48 49 50
                    , tabs: tabs'
                    , className: "nodes-lists-layout-tabs"
                    } where
51 52 53 54
      tabs' = [ "Terms"      /\ view Terms []
              , "Authors"    /\ view Authors []
              , "Institutes" /\ view Institutes []
              , "Sources"    /\ view Sources []
James Laver's avatar
James Laver committed
55 56
              ]
      common = RX.pick props :: Record Props
Karen Konou's avatar
Karen Konou committed
57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78
      view mode = tab $ Record.merge common { mode }

type TabProps = ( mode :: Mode | Props )

tab :: R2.Component TabProps
tab = R.createElement tabCpt

tabCpt :: R.Component TabProps
tabCpt = here.component "tab" cpt where
  cpt props _ = do
    path <- T.useBox $ NTC.initialPageParams props.session initialPath.corpusId [initialPath.listId] initialPath.tabType
    pure $ ngramsView (Record.merge props { path }) []
    where
      tabNgramType = modeTabType props.mode
      tabType      = TabCorpus (TabNgramType tabNgramType)
      listId       = props.corpusData.defaultListId
      corpusId     = props.corpusId
      initialPath  = { corpusId
                      -- , limit: Just 1000
                      , listId
                      , tabType
                      }
79

Karen Konou's avatar
Karen Konou committed
80 81

type NgramsViewProps = ( path :: T.Box PageParams | TabProps )
82

83 84
ngramsView :: R2.Component NgramsViewProps
ngramsView = R.createElement ngramsViewCpt
85
ngramsViewCpt :: R.Component NgramsViewProps
James Laver's avatar
James Laver committed
86
ngramsViewCpt = here.component "ngramsView" cpt where
87 88
  cpt props@{ boxes
            , cacheState
89 90
            , corpusData: { defaultListId }
            , mode
Karen Konou's avatar
Karen Konou committed
91 92
            , session
            , path } _ = do
93
      chartsReload <- T.useBox T2.newReload
94 95 96 97
      onCancelRef <- R.useRef Nothing
      onNgramsClickRef <- R.useRef Nothing
      onSaveRef <- R.useRef Nothing
      treeEditBox <- T.useBox NT.initialTreeEdit
98

99
      { listIds, nodeId, params } <- T.useLive T.unequal path
arturo's avatar
arturo committed
100 101 102 103 104

      pure $
        R.fragment
        [
          ngramsView'
105 106
          { boxes
          , corpusData: props.corpusData
arturo's avatar
arturo committed
107
          , listIds
108
          , mode
arturo's avatar
arturo committed
109
          , nodeId
110 111
          , params
          , session
arturo's avatar
arturo committed
112 113 114 115 116 117 118 119 120 121 122
          } []
        ,
          NT.mainNgramsTable
          { afterSync: afterSync chartsReload
          , boxes
          , cacheState
          , defaultListId
          , path
          , session
          , tabNgramType
          , tabType
123
          , treeEdit: { box: treeEditBox
124 125
                      , getNgramsChildrenAff: Just $ NT.getNgramsChildrenAffRequest session nodeId listIds tabType
                      , getNgramsChildren: Nothing
126 127 128
                      , onCancelRef
                      , onNgramsClickRef
                      , onSaveRef }
arturo's avatar
arturo committed
129 130 131
          , withAutoUpdate: false
          } []
        ]
132
      where
133
        afterSync chartsReload _ = do
134
          case mNgramsType of
135
            Just _ -> do
136 137 138 139
              -- NOTE: No need to recompute chart, after ngrams are sync this
              -- should be recomputed already
              -- We just refresh it
              -- _ <- recomputeChart session chartType ngramsType corpusId listId
140
              liftEffect $ T2.reload chartsReload
141 142
            Nothing         -> pure unit

143
        tabNgramType = modeTabType mode
144
        tabType      = TabCorpus (TabNgramType tabNgramType)
145
        mNgramsType  = mNgramsTypeFromTabType tabType
146

arturo's avatar
arturo committed
147 148 149 150 151 152 153


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


-- @XXX re-render issue -> clone component
type NgramsViewProps' =
154 155
  ( boxes         :: Boxes
  , corpusData    :: CorpusData
arturo's avatar
arturo committed
156
  , listIds       :: Array Int
157
  , mode          :: Mode
arturo's avatar
arturo committed
158
  , nodeId        :: Int
159 160
  , params        :: Params
  , session       :: Session
arturo's avatar
arturo committed
161 162 163 164
  )

ngramsView' :: R2.Component NgramsViewProps'
ngramsView' = R.createElement ngramsViewCpt'
165 166 167 168 169 170
--ngramsViewCpt' :: R.Memo NgramsViewProps'
--ngramsViewCpt' = R.memo' $ here.component "ngramsView_clone" cpt where
ngramsViewCpt' :: R.Component NgramsViewProps'
ngramsViewCpt' = here.component "ngramsView_clone" cpt where
  cpt { boxes
      , corpusData: { defaultListId }
arturo's avatar
arturo committed
171
      , listIds
172
      , mode
arturo's avatar
arturo committed
173
      , nodeId
174 175
      , params
      , session
arturo's avatar
arturo committed
176 177 178 179 180 181 182 183 184 185 186 187 188 189 190 191 192 193 194 195 196 197 198
      } _ = do

    let path' = {
      corpusId: nodeId
    , limit: params.limit
    , listId: fromMaybe defaultListId $ A.head listIds
    , tabType: tabType
    }

    let chartParams = {
      corpusId: path'.corpusId
    , limit: Just path'.limit
    , listId: path'.listId
    , tabType: path'.tabType
    }

    pure $

      R.fragment $
      charts chartParams tabNgramType

    where
      charts _params CTabTerms = [
199
          {-
200
          H.div {className: "row"}
Alexandre Delanoë's avatar
Alexandre Delanoë committed
201
                [ H.div {className: "col-12 d-flex justify-content-center"}
202 203 204 205 206 207
                  [ H.img { src: "images/Gargantextuel-212x300.jpg"
                          , id: "funnyimg"
                        }
                  ]
                ]

208
              R2.select { className: "form-control"
209 210
                        , defaultValue: show chartType
                        , on: { change: \e -> setChartType
211 212 213
                                             $ const
                                             $ fromMaybe Histo
                                             $ chartTypeFromString
214
                                             $ R.unsafeEventValue e
215 216
                              }
                        } [
217 218 219
                H.option { value: show Histo     } [ H.text $ show Histo     ]
              , H.option { value: show Scatter   } [ H.text $ show Scatter   ]
              , H.option { value: show ChartBar  } [ H.text $ show ChartBar  ]
220
              , H.option { value: show ChartPie  } [ H.text $ show ChartPie  ]
221 222 223
              , H.option { value: show ChartTree } [ H.text $ show ChartTree ]
              ]
            ]
224
          ]
225
        , getChartFunction chartType $ { path: params, session }
226
        -}
arturo's avatar
arturo committed
227 228 229 230 231 232 233 234 235
      ]
      charts params' _        = [ chart params' mode ]

      chart path Authors    = pie     { boxes, path, session, onClick: Nothing, onInit: Nothing }
      chart path Institutes = tree    { boxes, path, session, onClick: Nothing, onInit: Nothing }
      chart path Sources    = bar     { boxes, path, session, onClick: Nothing, onInit: Nothing }
      chart path Terms      = metrics { boxes, path, session, onClick: Nothing, onInit: Nothing }

      tabType      = TabCorpus (TabNgramType tabNgramType)
236

arturo's avatar
arturo committed
237
      tabNgramType = modeTabType mode