[forest] fix mPanelAction

src/Gargantext/Components/Forest/Tree/Node/Action/Link.purs

@@ -18,23 +18,28 @@ linkNodeReq :: Session -> GT.ID -> GT.ID -> Aff (Array GT.ID)
 linkNodeReq session fromId toId =
   put_ session $ NodeAPI GT.Node (Just fromId) ("link/" <> show toId)
 
-linkNode :: Record SubTreeParamsIn -> R.Hooks R.Element
-linkNode p@{dispatch, subTreeParams, id, nodeType, session} = do
+linkNode :: Record SubTreeParamsIn -> R.Element
+linkNode p = R.createElement linkNodeCpt p []
 
-  action@(valAction /\ setAction) :: R.State Action <- R.useState' (LinkNode {params:Nothing})
+linkNodeCpt :: R.Component SubTreeParamsIn
+linkNodeCpt = R.hooksComponent "G.C.F.T.N.A.L.linkNode" cpt
+  where
+    cpt p@{dispatch, subTreeParams, id, nodeType, session} _ = do
 
-  let button = case valAction of
-        LinkNode {params} -> case params of
-          Just val -> submitButton (LinkNode {params: Just val}) dispatch
-          Nothing -> H.div {} []
-        _                   -> H.div {} []
+      action@(valAction /\ setAction) :: R.State Action <- R.useState' (LinkNode {params:Nothing})
 
-  pure $ panel [ subTreeView { action
-                             , dispatch
-                             , id
-                             , nodeType
-                             , session
-                             , subTreeParams
-                             }
-               ] button
+      let button = case valAction of
+              LinkNode {params} -> case params of
+                Just val -> submitButton (LinkNode {params: Just val}) dispatch
+                Nothing -> H.div {} []
+              _                   -> H.div {} []
 
+      pure $ panel [
+          subTreeView { action
+                      , dispatch
+                      , id
+                      , nodeType
+                      , session
+                      , subTreeParams
+                      }
+              ] button

src/Gargantext/Components/Forest/Tree/Node/Action/Merge.purs

@@ -19,34 +19,39 @@ mergeNodeReq :: Session -> GT.ID -> GT.ID -> Aff (Array GT.ID)
 mergeNodeReq session fromId toId =
   put_ session $ NodeAPI GT.Node (Just fromId) ("merge/" <> show toId)
 
-mergeNode :: Record SubTreeParamsIn -> R.Hooks R.Element
-mergeNode p@{dispatch, subTreeParams, id, nodeType, session} = do
-  action@(valAction /\ setAction) :: R.State Action <- R.useState' (MergeNode {params:Nothing})
+mergeNode :: Record SubTreeParamsIn -> R.Element
+mergeNode p = R.createElement mergeNodeCpt p []
 
-  merge   <- R.useState' false
-  options <- R.useState' (Set.singleton GT.MapTerm)
+mergeNodeCpt :: R.Component SubTreeParamsIn
+mergeNodeCpt = R.hooksComponent "G.C.F.T.N.A.M.mergeNode" cpt
+  where
+    cpt p@{dispatch, subTreeParams, id, nodeType, session} _ = do
+      action@(valAction /\ setAction) :: R.State Action <- R.useState' (MergeNode {params:Nothing})
 
-  let button = case valAction of
-        MergeNode {params} -> case params of
-          Just val -> submitButton (MergeNode {params: Just val}) dispatch
-          Nothing -> H.div {} []
-        _                   -> H.div {} []
+      merge   <- R.useState' false
+      options <- R.useState' (Set.singleton GT.MapTerm)
 
-  pure $ panel [ subTreeView { action
-                             , dispatch
-                             , id
-                             , nodeType
-                             , session
-                             , subTreeParams
-                             }
-               , H.div { className:"panel panel-primary"}
-                       [ H.text "Merge which list?"
-                       , checkboxes [GT.MapTerm, GT.CandidateTerm, GT.StopTerm] options
-                       ]
-               , H.div { className:"panel panel-primary"}
-                       [ H.text "Title"
-                       , H.div {className: "checkbox"}
-                               [checkbox merge, H.text "Merge data?"]
-                       ]
-               ] button
+      let button = case valAction of
+            MergeNode {params} -> case params of
+              Just val -> submitButton (MergeNode {params: Just val}) dispatch
+              Nothing -> H.div {} []
+            _                   -> H.div {} []
 
+      pure $ panel [
+          subTreeView { action
+                      , dispatch
+                      , id
+                      , nodeType
+                      , session
+                      , subTreeParams
+                      }
+        , H.div { className:"panel panel-primary"}
+                [ H.text "Merge which list?"
+                , checkboxes [GT.MapTerm, GT.CandidateTerm, GT.StopTerm] options
+                ]
+        , H.div { className:"panel panel-primary"}
+                [ H.text "Title"
+                , H.div {className: "checkbox"}
+                        [checkbox merge, H.text "Merge data?"]
+                ]
+        ] button

src/Gargantext/Components/Forest/Tree/Node/Action/Move.purs

@@ -18,22 +18,26 @@ moveNodeReq :: Session -> GT.ID -> GT.ID -> Aff (Array GT.ID)
 moveNodeReq session fromId toId =
   put_ session $ NodeAPI GT.Node (Just fromId) ("move/" <> show toId)
 
-moveNode :: Record SubTreeParamsIn -> R.Hooks R.Element
-moveNode p@{dispatch, subTreeParams, id, nodeType, session} = do
-  action@(valAction /\ setAction) :: R.State Action <- R.useState' (MoveNode {params: Nothing})
+moveNode :: Record SubTreeParamsIn -> R.Element
+moveNode p = R.createElement moveNodeCpt p []
 
-  let button = case valAction of
-        MoveNode {params} -> case params of
-          Just val -> submitButton (MoveNode {params: Just val}) dispatch
-          Nothing -> H.div {} []
-        _                   -> H.div {} []
+moveNodeCpt :: R.Component SubTreeParamsIn
+moveNodeCpt = R.hooksComponent "G.C.F.T.N.A.M.moveNode" cpt
+  where
+    cpt p@{dispatch, subTreeParams, id, nodeType, session} _ = do
+      action@(valAction /\ setAction) :: R.State Action <- R.useState' (MoveNode {params: Nothing})
 
-  pure $ panel [ subTreeView { action
-                             , dispatch
-                             , id
-                             , nodeType
-                             , session
-                             , subTreeParams
-                             }
-               ] button
+      let button = case valAction of
+              MoveNode {params} -> case params of
+                Just val -> submitButton (MoveNode {params: Just val}) dispatch
+                Nothing -> H.div {} []
+              _                   -> H.div {} []
 
+      pure $ panel [ subTreeView { action
+                                 , dispatch
+                                 , id
+                                 , nodeType
+                                 , session
+                                 , subTreeParams
+                                 }
+              ] button

src/Gargantext/Components/Forest/Tree/Node/Box.purs

@@ -3,9 +3,10 @@ module Gargantext.Components.Forest.Tree.Node.Box where
 import Data.Array as A
 import Data.Maybe (Maybe(..), isJust)
 import Data.String as S
+import Data.Tuple (fst)
 import Data.Tuple.Nested ((/\))
+import DOM.Simple.Console (log2)
 import Effect.Aff (Aff)
-import Effect.Uncurried (mkEffectFn1)
 import Reactix as R
 import Reactix.DOM.HTML as H
 
@@ -62,6 +63,9 @@ nodePopupCpt = R.hooksComponent "G.C.F.T.N.B.nodePopupView" cpt
       search  <- R.useState'
                $ defaultSearch { node_id = Just p.id }
 
+      R.useEffect' $ do
+        log2 "[nodePopup] nodePopupState" $ fst nodePopupState
+
       pure $ H.div tooltipProps $
         [ H.div { className: "popup-container" }
           [ H.div { className: "panel panel-default" }
@@ -138,8 +142,8 @@ nodePopupCpt = R.hooksComponent "G.C.F.T.N.B.nodePopupView" cpt
                   -> R.Element
         panelBody nodePopupState {dispatch: d, nodeType} =
           H.div {className: "panel-body flex-space-between"}
-                $ [ H.p { "style": {"margin":"10px"}} []
-                  , H.div { className: "flex-center"} 
+                $ [ H.p { "style": {"margin":"10px"} } []
+                  , H.div { className: "flex-center" }
                           [ buttonClick { action: doc
                                         , state: nodePopupState
                                         , nodeType
@@ -206,29 +210,20 @@ buttonClickCpt = R.hooksComponent "G.C.F.T.N.B.buttonClick" cpt
                                                       (action == (Just todo)   )
                          , id: show todo
                          , title: show todo
-                         , onClick : mkEffectFn1 $ \_ -> {-undo *>-} doToDo
+                         , on: { click: \_ -> doToDo }
                        }
                      []
                    ]
       where
-        -- FIXME
-        -- If uncommenting the code below
-        --   then mpanelAction state is not
-        --        updated and leads to some bug (state of subtree 
-        --        not updated and search value not initilized)
-        --   else current action' forces the user to click twice when
-        --        changing the action button.
-        action' = if isJust action {-== (Just todo)-}
-                      then Nothing
-                      else (Just todo)
         {- -- This shows the Help of this button
         undo = setNodePopup
              $ const (node { action = Nothing })
         -}
 
-        doToDo = setNodePopup $ const (node { action = action' })
+        doToDo = setNodePopup $ const $ node { action = Just todo }
 
-        iconAStyle :: GT.NodeType -> NodeAction -> { color      :: String
+        iconAStyle :: GT.NodeType -> NodeAction -> {
+                        color      :: String
                       , paddingTop :: String
                       , paddingBottom :: String
                       }
@@ -272,7 +267,7 @@ panelActionCpt = R.hooksComponent "G.C.F.T.N.B.panelAction" cpt
     cpt {action: Upload, dispatch, id, nodeType, session} _ = actionUpload   nodeType id session dispatch
     cpt {action: Delete, nodeType, dispatch}              _ = actionDelete   nodeType dispatch
 
-    cpt {action: Add xs, dispatch, id, name, nodePopup: p, nodeType} _ = do
+    cpt {action: Add xs, dispatch, id, name, nodeType} _ = do
       pure $ addNodeView {dispatch, id, name, nodeType, nodeTypes: xs}
 
     cpt {action: Refresh , dispatch, id, nodeType, session} _ = update nodeType dispatch
@@ -283,13 +278,13 @@ panelActionCpt = R.hooksComponent "G.C.F.T.N.B.panelAction" cpt
 -----------
     -- Functions using SubTree
     cpt {action: Merge {subTreeParams}, dispatch, id, nodeType, session} _ = do
-      mergeNode {dispatch, id, nodeType, session, subTreeParams}
+      pure $ mergeNode {dispatch, id, nodeType, session, subTreeParams}
 
     cpt {action: Move {subTreeParams}, dispatch, id, nodeType, session} _ = do
-      moveNode {dispatch, id, nodeType, session, subTreeParams}
+      pure $ moveNode {dispatch, id, nodeType, session, subTreeParams}
 
     cpt {action: Link {subTreeParams}, dispatch, id, nodeType, session} _ = do
-      linkNode {dispatch, id, nodeType, session, subTreeParams}
+      pure $ linkNode {dispatch, id, nodeType, session, subTreeParams}
 -----------
 
     cpt {action : Share, dispatch, id, name } _ = do