Forest.purs 8.79 KB
Newer Older
James Laver's avatar
James Laver committed
1
module Gargantext.Components.Forest
arturo's avatar
arturo committed
2
  ( forestLayout
3
  , Props
James Laver's avatar
James Laver committed
4
  ) where
5

6 7
import Gargantext.Prelude

8
import Data.Array as A
9
import Data.Map (empty)
10 11
import Data.Map as Map
import Data.Maybe (Maybe(..), fromMaybe)
arturo's avatar
arturo committed
12
import Gargantext.Components.App.Store (Boxes)
arturo's avatar
arturo committed
13 14
import Gargantext.Components.Bootstrap as B
import Gargantext.Components.Bootstrap.Types (ButtonVariant(..), Position(..), TooltipPosition(..), Variant(..))
15
import Gargantext.Components.Forest.Tree (treeLoader)
16
import Gargantext.Ends (Frontends)
arturo's avatar
arturo committed
17 18
import Gargantext.Hooks.LinkHandler (useLinkHandler)
import Gargantext.Routes (AppRoute(..))
19
import Gargantext.Sessions (Session(..), unSessions)
20
import Gargantext.Utils.Reactix as R2
21 22 23
import Reactix as R
import Reactix.DOM.HTML as H
import Toestand as T
James Laver's avatar
James Laver committed
24 25 26 27

here :: R2.Here
here = R2.here "Gargantext.Components.Forest"

28
-- Shared by components here with Tree
29
type Props =
30 31
  ( boxes     :: Boxes
  , frontends :: Frontends
32
  )
33

arturo's avatar
arturo committed
34 35 36 37 38
forestLayout :: R2.Leaf Props
forestLayout = R2.leaf forestLayoutCpt

forestLayoutCpt :: R.Component Props
forestLayoutCpt = here.component "forest" cpt where
39 40
  cpt { boxes: boxes@{ handed
                     , reloadForest
41 42
                     , sessions
                     , pinnedTreeId }
43
      , frontends } _ = do
44 45 46 47
    -- TODO Fix this. I think tasks shouldn't be a Box but only a Reductor
    -- tasks'        <- GAT.useTasks reloadRoot reloadForest
    -- R.useEffect' $ do
    --   T.write_ (Just tasks') tasks
James Laver's avatar
James Laver committed
48
    handed'       <- T.useLive T.unequal handed
49
    sessions'     <- T.useLive T.unequal sessions
50
    pinnedTreeId' <- T.useLive T.unequal pinnedTreeId
51
    -- forestOpen'   <- T.useLive T.unequal forestOpen
52
    -- reloadRoot'   <- T.useLive T.unequal reloadRoot
53
    -- route'        <- T.useLive T.unequal route
54

James Laver's avatar
James Laver committed
55
    -- TODO If `reloadForest` is set, `reload` state should be updated
56
    -- TODO fix tasks ref
arturo's avatar
arturo committed
57 58 59
    pure $

      H.div
60
      { className: "forest-layout bg-light" }
61
      (A.cons (plus { boxes }) (trees handed' pinnedTreeId' sessions'))
62
    where
63 64
      trees handed' pinnedTreeId' sessions' = (tree handed' pinnedTreeId') <$> unSessions sessions'
      tree handed' pinnedTreeId' s@(Session { treeId }) =
arturo's avatar
arturo committed
65
        H.div
arturo's avatar
arturo committed
66
        { className: "forest-layout__tree" }
arturo's avatar
arturo committed
67
        [
68 69 70 71 72
          treeLoader
          { boxes
          , frontends
          , handed: handed'
          , reload: reloadForest
73
          , root: r
74 75 76
          , session: s
          , key: "tree-" <> (show treeId)
          }
arturo's avatar
arturo committed
77
        ]
78 79
        where
          r = fromMaybe treeId (Map.lookup (show s) pinnedTreeId')
80

81
type Plus = ( boxes :: Boxes )
82 83

plus :: R2.Leaf Plus
84
plus = R2.leaf plusCpt
85 86
plusCpt :: R.Component Plus
plusCpt = here.component "plus" cpt where
Karen Konou's avatar
Karen Konou committed
87
  cpt { boxes: { backend, showLogin, showSearch, pinnedTreeId} } _ = do
arturo's avatar
arturo committed
88 89
    -- Hooks
    { goToRoute } <- useLinkHandler
90

arturo's avatar
arturo committed
91 92 93 94 95 96 97 98 99 100
    -- Behaviors
    let
      click _ = do
        -- NOTE Reset backend in case G.C.N.Home.homeLayout set that to (Just b)
        -- from current url
        _ <- T.write Nothing backend
        T.write_ true showLogin

    -- Render
    pure $
101
      H.div { className: "forest-layout__actions position-sticky top-0 py-1 bg-light" } 
102
      [
103 104 105 106 107 108 109 110 111
        H.div
        { className: "forest-layout__top_action" }
        [
          B.tooltipContainer
          { delayShow: 600
          , position: TooltipPosition Right
          , tooltipSlot:
            B.span_ "Search in trees"
          , defaultSlot:
arturo's avatar
arturo committed
112
            B.button
113 114
            { className: "w-100 text-small px-2"
            , callback: \_ -> T.write_ true showSearch
arturo's avatar
arturo committed
115 116 117
            , variant: ButtonVariant Light
            }
            [
118 119 120 121 122 123
              B.icon
              { name: "search"}
            ,
              B.wad_ [ "d-inline-block", "w-1" ]
            ,
              B.span_ "Search"
arturo's avatar
arturo committed
124
            ]
125 126
          }
        ]
arturo's avatar
arturo committed
127
      ,
128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149
      {-
        H.div
        { className: "forest-layout__top_action" }
        [
          B.tooltipContainer
          { delayShow: 600
          , position: TooltipPosition Right
          , tooltipSlot:
              B.span_ "Back to home"
          , defaultSlot:
              B.button
              { className: "w-100 text-small px-2"
              , callback: const $ goToRoute Home
              , variant: ButtonVariant Light
              }
              [
                B.icon { name: "home" }
              ,
                B.wad_ [ "d-inline-block", "w-1" ]
              ,
                B.span_ "Back to home"
              ]
150
          }
151
        ]
152
      ,
153 154 155 156 157 158 159 160 161 162
      -}
        H.div
        { className: "forest-layout__top_action" }
        [
          B.tooltipContainer
          { delayShow: 600
          , position: TooltipPosition Right
          , tooltipSlot:
            B.span_ "Reset pins"
          , defaultSlot:
arturo's avatar
arturo committed
163
            B.button
164 165 166 167 168 169 170 171 172 173 174 175 176 177 178 179 180 181 182 183 184 185 186 187 188 189
            { className: "w-100 text-small px-2"
            , callback: \_ -> T.write_ empty pinnedTreeId
            , variant: ButtonVariant Light
            }
            [
              B.icon
              { name: "thumb-tack-inclined-cancel"}
            ,
              B.wad_ [ "d-inline-block", "w-1" ]
            ,
              B.span_ "Reset pins"
            ]
          }
        ]
      ,
        H.div
        { className: "forest-layout__top_action" }
        [
          B.tooltipContainer
          { delayShow: 600
          , position: TooltipPosition Right
          , tooltipSlot:
            B.span_ "Explore the GarganText ecosystem | Add or remove connection to the different workspaces (servers)"
          , defaultSlot:
            B.button
            { className: "w-100 text-small px-2"
arturo's avatar
arturo committed
190 191 192 193
            , callback: click
            , variant: ButtonVariant Light
            }
            [
arturo's avatar
arturo committed
194
              B.icon
195
              { name: "universal-access"}
arturo's avatar
arturo committed
196
            ,
arturo's avatar
arturo committed
197
              B.wad_ [ "d-inline-block", "w-1" ]
arturo's avatar
arturo committed
198
            ,
199
              B.span_ "Log in/out (workspaces)"
arturo's avatar
arturo committed
200
            ]
201 202 203 204
          }
        ]
      
      {-
Karen Konou's avatar
Karen Konou committed
205
      ,
206 207 208 209 210 211 212 213 214 215 216 217 218 219 220 221 222
        H.div
        { className: "forest-layout__action" }
        [
          B.tooltipContainer
          { delayShow: 600
          , position: TooltipPosition Right
          , tooltipSlot:
              B.span_ "Back to home"
          , defaultSlot:
              B.button
              { className: "forest-layout__action__button"
              , callback: const $ goToRoute Home
              , variant: ButtonVariant Light
              }
              [
                B.icon { name: "home" }
              ]
Karen Konou's avatar
Karen Konou committed
223
          }
224 225 226 227 228 229 230 231 232 233 234 235 236 237 238 239 240 241 242 243 244 245 246 247 248 249 250 251 252 253 254 255 256 257 258 259 260 261 262 263 264 265 266 267 268 269 270 271 272 273 274 275 276 277 278 279 280 281 282 283 284 285 286 287 288
        ,
          B.tooltipContainer
          { delayShow: 600
          , position: TooltipPosition Right
          , tooltipSlot:
            B.span_ "Reset pins"
          , defaultSlot:
            B.button
            { className: "forest-layout__action__button"
            , callback: \_ -> T.write_ empty pinnedTreeId
            , variant: ButtonVariant Light
            }
            [
              B.icon { name: "thumb-tack-inclined-cancel" }
            ]
          }
        ,
          B.tooltipContainer
          { delayShow: 600
          , position: TooltipPosition Right
          , tooltipSlot:
              B.span_ "Add or remove connection to the server(s)"
          , defaultSlot:
              B.button
              { className: "forest-layout__action__button"
              , callback: click
              , variant: ButtonVariant Light
              }
              [
                B.icon
                { name: "universal-access" }
              ,
                B.wad_ [ "d-inline-block", "w-1" ]
              ,
                H.text $ "Log in/out"
              ]
          }
        ]
        ,
        H.div
        { className: "forest-layout__action" }
        [
          B.tooltipContainer
          { delayShow: 600
          , position: TooltipPosition Right
          , tooltipSlot:
            B.span_ "Search in tree"
          , defaultSlot:
            B.button
            { className: "forest-layout__action__button"
            , callback: \_ -> T.write_ true showSearch
            , variant: ButtonVariant Light
            }
            [
              B.icon
              { name: "search"}
            ,
              B.wad_ [ "d-inline-block", "w-1" ]
            ,
              H.text $ "Search"
            ]
          }
        ]
      -}

Karen Konou's avatar
Karen Konou committed
289
      ]
290

291 292
  --, H.div { "type": "", className: "fa fa-plus-circle fa-lg"} []
  --, H.div { "type": "", className: "fa fa-minus-circle fa-lg"} []
293 294
  -- TODO same as the one in the Login Modal (same CSS)
  -- [ H.i { className: "material-icons md-36"} [] ]
295

296

arturo's avatar
arturo committed
297 298 299 300 301
-- forestLayout :: R2.Leaf Props
-- forestLayout = R2.leaf forestLayoutCpt
-- forestLayoutCpt :: R.Memo Props
-- forestLayoutCpt = R.memo' $ here.component "forestLayout" cpt where
--   cpt p _ = pure $
302

arturo's avatar
arturo committed
303 304 305 306 307 308 309 310 311
--     H.div
--     { className: "forest-layout" }
--     [
--       H.div { className: "forest-layout__top-teaser" } []
--     ,
--       forest p []
--     ,
--       H.div { className: "forest-layout__bottom-teaser" } []
--     ]