Skip to content

P
purescript-gargantext
Commit 88290311 authored by Alexandre Delanoë's avatar Alexandre Delanoë
Browse files
Options

[COMPONENT] TextInputBox Action generic

parent 3aa8ee18
Hide whitespace changes
Inline Side-by-side
Showing with 51 additions and 40 deletions
src/Gargantext/Components/Forest/Tree.purs
View file @ 88290311
......@@ -205,7 +205,7 @@ performAction { reload: (_ /\ setReload)
performAction p@{ reload: (_ /\ setReload)
, session
, tree: (NTree (LNode {id}) _) } (RenameNode name) = do
void $ renameNode session id $ RenameValue {name}
void $ renameNode session id $ RenameValue {text:name}
performAction p RefreshTree
performAction p@{ openNodes: (_ /\ setOpenNodes)
......
src/Gargantext/Components/Forest/Tree/Node/Action/Rename.purs
View file @ 88290311
......@@ -5,13 +5,13 @@ import Data.Maybe (Maybe(..))
import Data.Tuple.Nested ((/\))
import Effect.Aff (Aff, launchAff)
import Effect.Uncurried (mkEffectFn1)
import Prelude (Unit, bind, const, discard, pure, ($), (<<<))
import Prelude (Unit, bind, const, discard, pure, ($), (<<<), (<>))
import Reactix as R
import Reactix.DOM.HTML as H
import Gargantext.Components.Forest.Tree.Node.Action
import Gargantext.Types as GT
import Gargantext.Types (NodeType, ID, Name)
import Gargantext.Types (ID)
import Gargantext.Routes as GR
import Gargantext.Utils.Reactix as R2
import Gargantext.Sessions (Session, get, put, post, delete)
......@@ -22,61 +22,68 @@ renameNode session renameNodeId =
put session $ GR.NodeAPI GT.Node (Just renameNodeId) "rename"
newtype RenameValue = RenameValue
{ name :: Name }
{ text :: String }
instance encodeJsonRenameValue :: EncodeJson RenameValue where
encodeJson (RenameValue {name})
= "r_name" := name
encodeJson (RenameValue {text})
= "r_name" := text
~> jsonEmptyObject
-- | START Rename Box
type RenameBoxProps =
( id :: ID
, dispatch :: Action -> Aff Unit
, name :: Name
, renameBoxOpen :: R.State Boolean
type TextInputBoxProps =
( id :: ID
, dispatch :: Action -> Aff Unit
, text :: String
, isOpen :: R.State Boolean
, boxName :: String
, textAction :: String -> Action
)
renameBox :: Record RenameBoxProps -> R.Element
renameBox p@{ dispatch, renameBoxOpen: (true /\ setRenameBoxOpen) } = R.createElement el p []
renameAction :: String -> Action
renameAction newName = RenameNode newName
textInputBox :: Record TextInputBoxProps -> R.Element
textInputBox p@{ boxName, textAction, dispatch, isOpen: (true /\ setIsOpen) } = R.createElement el p []
where
el = R.hooksComponent "RenameBox" cpt
cpt {id, name} _ = do
renameNodeName <- R.useState' name
el = R.hooksComponent (boxName <> "Box") cpt
cpt {id, text} _ = do
renameNodeName <- R.useState' text
pure $ H.div {className: "from-group row-no-padding"}
[ renameInput renameNodeName
, renameBtn renameNodeName
[ textInput renameNodeName
, submitBtn renameNodeName
, cancelBtn
]
where
renameInput (_ /\ setRenameNodeName) =
textInput (_ /\ setRenameNodeName) =
H.div {className: "col-md-8"}
[ H.input { type: "text"
, placeholder: "Rename Node"
, defaultValue: name
, placeholder: (boxName <> " Node")
, defaultValue: text
, className: "form-control"
, onInput: mkEffectFn1 $ setRenameNodeName <<< const <<< R2.unsafeEventValue
, onInput: mkEffectFn1 $ setRenameNodeName
<<< const
<<< R2.unsafeEventValue
}
]
renameBtn (newName /\ _) =
submitBtn (newName /\ _) =
H.a {className: "btn glyphitem glyphicon glyphicon-ok col-md-2 pull-left"
, type: "button"
, onClick: mkEffectFn1 $ \_ -> do
setRenameBoxOpen $ const false
launchAff $ dispatch $ RenameNode newName
, title: "Rename"
setIsOpen $ const false
launchAff $ dispatch ( textAction newName )
, title: "Submit"
} []
cancelBtn =
H.a {className: "btn text-danger glyphitem glyphicon glyphicon-remove col-md-2 pull-left"
, type: "button"
, onClick: mkEffectFn1 $ \_ -> setRenameBoxOpen $ const false
, onClick: mkEffectFn1 $ \_ -> setIsOpen $ const false
, title: "Cancel"
} []
renameBox p@{ renameBoxOpen: (false /\ _) } = R.createElement el p []
textInputBox p@{ boxName, isOpen: (false /\ _) } = R.createElement el p []
where
el = R.hooksComponent "RenameBox" cpt
cpt {name} _ = pure $ H.div {} []
el = R.hooksComponent (boxName <> "Box") cpt
cpt {text} _ = pure $ H.div {} []
-- END Rename Box
src/Gargantext/Components/Forest/Tree/Node/Box.purs
View file @ 88290311
......@@ -28,7 +28,7 @@ import Gargantext.Components.Forest.Tree.Node (NodeAction(..), SettingsBox(..),
import Gargantext.Components.Forest.Tree.Node.Action (Action(..), FileType(..), UploadFileContents(..))
import Gargantext.Components.Forest.Tree.Node.Action.Add (NodePopup(..), addNodeView)
import Gargantext.Components.Forest.Tree.Node.Action.CopyFrom (copyFromCorpusView)
import Gargantext.Components.Forest.Tree.Node.Action.Rename (renameBox)
import Gargantext.Components.Forest.Tree.Node.Action.Rename (textInputBox, renameAction)
import Gargantext.Components.Forest.Tree.Node.Action.Update
import Gargantext.Components.Forest.Tree.Node.Action.Upload (DroppedFile(..), uploadFileView, fileTypeView, uploadTermListView)
import Gargantext.Components.Forest.Tree.Node.ProgressBar (asyncProgressBar, BarType(..))
......@@ -402,9 +402,13 @@ nodePopupCpt :: R.Component NodePopupProps
nodePopupCpt = R.hooksComponent "G.C.F.T.N.B.nodePopupView" cpt
where
cpt p _ = do
renameBoxOpen <- R.useState' false
iframeRef <- R.useRef null
nodePopupState@(nodePopup /\ setNodePopup) <- R.useState' {action: Nothing, id: p.id, name: p.name, nodeType: p.nodeType}
isOpen <- R.useState' false
iframeRef <- R.useRef null
nodePopupState@(nodePopup /\ setNodePopup) <- R.useState' { action: Nothing
, id: p.id
, name: p.name
, nodeType: p.nodeType
}
search <- R.useState' $ defaultSearch { node_id = Just p.id }
pure $ H.div tooltipProps $
[ H.div { className: "popup-container" }
......@@ -416,7 +420,7 @@ nodePopupCpt = R.hooksComponent "G.C.F.T.N.B.nodePopupView" cpt
, H.p {className: "text-primary center"} [H.text p.name]
]
]
, panelHeading renameBoxOpen p
, panelHeading isOpen p
, panelBody nodePopupState p
, mPanelAction nodePopupState p search
]
......@@ -435,14 +439,14 @@ nodePopupCpt = R.hooksComponent "G.C.F.T.N.B.nodePopupView" cpt
--, style: { top: y - 65.0, left: x + 10.0 }
}
panelHeading renameBoxOpen@(open /\ _) {dispatch, id, name, nodeType} =
panelHeading isOpen@(open /\ _) {dispatch, id, name, nodeType} =
H.div {className: "panel-heading"}
[ R2.row
[ H.div {className: "col-md-8"}
[ renameBox { dispatch, id, name, renameBoxOpen } ]
[ textInputBox { textAction: renameAction, boxName: "Rename", dispatch, id, text:name, isOpen } ]
, H.div {className: "flex-end"}
[ if edit then editIcon renameBoxOpen else H.div {} []
[ if edit then editIcon isOpen else H.div {} []
, H.div {className: "col-md-1"}
[ H.a { "type" : "button"
, className: glyphicon "remove-circle"
......@@ -456,12 +460,12 @@ nodePopupCpt = R.hooksComponent "G.C.F.T.N.B.nodePopupView" cpt
SettingsBox {edit, doc, buttons} = settingsBox nodeType
editIcon :: R.State Boolean -> R.Element
editIcon (false /\ setRenameBoxOpen) =
editIcon (false /\ setIsOpen) =
H.div {className : "col-md-1"}
[ H.a { className: glyphicon "pencil"
, id : "rename1"
, title : "Rename"
, on: { click: \_ -> setRenameBoxOpen $ const true }
, on: { click: \_ -> setIsOpen $ const true }
}
[]
]
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment