Add.purs 4.77 KB
Newer Older
1
module Gargantext.Components.Forest.Tree.Node.Action.Add where
2

3 4 5
import Data.Array (length, head)
import Data.Maybe (Maybe(..), fromMaybe)
-- import Data.Newtype (class Newtype)
6
import Data.Tuple.Nested ((/\))
7
import Effect.Aff (Aff, launchAff)
8
import Effect.Uncurried (mkEffectFn1)
9 10 11
import Gargantext.Components.Forest.Tree.Node.Action (Action(..), ID, Name)
import Gargantext.Components.Forest.Tree.Node (SettingsBox(..), settingsBox)
import Gargantext.Types (NodeType(..), readNodeType)
12
import Gargantext.Utils.Reactix as R2
13
import Prelude (Unit, bind, const, discard, map, pure, show, ($), (<>), (>), (<<<))
14 15 16 17
import Reactix as R
import Reactix.DOM.HTML as H

-- START Create Node
18

19 20
type Dispatch = Action -> Aff Unit

21 22
data NodePopup = CreatePopup | NodePopup

23 24
type CreateNodeProps =
  ( id       :: ID
25
  , dispatch :: Dispatch
26
  , name     :: Name
27
  , nodeType :: NodeType
28
  , nodeTypes :: Array NodeType
29
  )
30

31
createNodeView :: Record CreateNodeProps
32
               -> R.Element
33
createNodeView p@{ dispatch, nodeType, nodeTypes } = R.createElement el p []
34 35 36
  where
    el = R.hooksComponent "CreateNodeView" cpt
    cpt {id, name} _ = do
37
      nodeName <- R.useState' "Default Name"
38
      nodeType' <- R.useState' $ fromMaybe NodeUser $ head nodeTypes
39
      pure $ H.div {}
40 41
          [ panelBody   readNodeType nodeName nodeType'
          , panelFooter nodeName nodeType'
42 43
          ]
      where
44 45 46 47 48
        panelBody :: (String -> NodeType)
                  -> R.State String
                  -> R.State NodeType
                  -> R.Element
        panelBody readIt (_ /\ setNodeName) (nt /\ setNodeType) =
49 50
          H.div {className: "panel-body"}
          [ H.div {className: "row"}
51
            [ H.div {className: "col-md-10"}
52
              [ H.form {className: "form-horizontal"} $ maybeChoose <> maybeEdit ]
53 54
              ]
            ]
55 56
              where
                SettingsBox {edit} = settingsBox nt
57
                maybeEdit = [ if edit then
58
                                H.div {className: "form-group"}
59 60 61 62 63 64 65
                                   [ H.input { type: "text"
                                             , placeholder: "Node name"
                                             , defaultValue: "Write Name here"
                                             , className: "form-control"
                                             , onInput: mkEffectFn1 $ setNodeName <<< const <<< R2.unsafeEventValue
                                            }
                                   ]
66 67 68 69
                              else
                                H.div {} []
                             ]

70 71 72 73 74 75 76
                maybeChoose = [ if length nodeTypes > 1 then
                                  R.fragment [
                                    H.div {className: "form-group"} $ [
                                       R2.select { className: "form-control"
                                                 , onChange: mkEffectFn1 $ setNodeType <<< const <<< readIt <<< R2.unsafeEventValue
                                                 }
                                       (map (\opt -> H.option {} [ H.text $ show opt ]) nodeTypes)
77 78
                                         ]
                                         -- , showConfig nt
79
                                    ]
80
                                else
81
                                H.button { className : "btn btn-primary"
82 83 84 85 86 87 88 89
                                           , type : "button"
                                           , onClick : mkEffectFn1 $ \_ -> setNodeType ( const
                                                                                       $ fromMaybe nt 
                                                                                       $ head nodeTypes
                                                                                       )
                                           } []
                               ]

90 91 92 93 94


        panelFooter :: R.State String  -> R.State NodeType -> R.Element
        panelFooter (name' /\ _) (nt /\ _) =
          H.div {className: "panel-footer"}
95
          [ H.button {className: "btn btn-primary text-center"
96 97
                     , type: "button"
                     , onClick: mkEffectFn1 $ \_ -> do
98 99
                         -- TODO
                         --setPopupOpen $ const Nothing
100
                         launchAff    $ dispatch $ CreateSubmit name' nt
101 102 103 104 105
                     } [H.text "Add"]
          ]

-- END Create Node

106 107

showConfig :: NodeType -> R.Element
108 109 110 111
showConfig NodeUser      = H.div {} []
showConfig FolderPrivate = H.div {} [H.text "This folder will be private only"]
showConfig FolderShared  = H.div {} [H.text "This folder will be shared"]
showConfig FolderPublic  = H.div {} [H.text "This folder will be public"]
112
showConfig nt            = H.div {} [H.h4  {} [H.text $ "Config of " <> show nt ]]
113 114