[CSS|Ergo] subtree fix

dist/styles/Login.css

@@ -204,6 +204,7 @@ a:focus, a:hover {
 
 .copy-from-corpus .tree .node {
   padding-left: 10px;
+  margin-top: 5px;
 }
 .copy-from-corpus .tree .node .name.clickable {
   color: #337ab7;

dist/styles/Login.sass

@@ -192,6 +192,7 @@ a:focus, a:hover
   .tree
     .node
       padding-left: 10px
+      margin-top: 5px
       .name
         &.clickable
           color: #337ab7

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

@@ -14,6 +14,7 @@ import Gargantext.Components.Forest.Tree.Node.Box.Types (CommonProps)
 import Gargantext.Components.Forest.Tree.Node.Tools.ProgressBar (asyncProgressBar, BarType(..))
 import Gargantext.Components.Forest.Tree.Node.Tools.Task (Tasks)
 import Gargantext.Components.Forest.Tree.Node.Tools.Sync (nodeActionsGraph, nodeActionsNodeList)
+import Gargantext.Components.Forest.Tree.Node.Tools (nodeText)
 import Gargantext.Components.GraphExplorer.API as GraphAPI
 import Gargantext.Components.Lang (Lang(EN))
 import Gargantext.Components.Nodes.Corpus (loadCorpusWithChild)
@@ -166,28 +167,6 @@ fldr nt open = if open
 -}
 
 
--- START node text
-type NodeTextProps =
-  ( isSelected :: Boolean
-  , name       :: Name
-  )
-
-nodeText :: Record NodeTextProps -> R.Element
-nodeText p = R.createElement nodeTextCpt p []
-
-nodeTextCpt :: R.Component NodeTextProps
-nodeTextCpt = R.hooksComponent "G.C.F.T.N.B.nodeText" cpt
-  where
-    cpt { isSelected: true, name } _ = do
-      pure $ H.u {} [
-        H.b {} [
-           H.text ("| " <> name <> " |    ")
-         ]
-        ]
-    cpt {isSelected: false, name} _ = do
-      pure $ H.text (name <> "    ")
--- END node text
-
 -- START nodeActions
 
 type NodeActionsProps =

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

@@ -4,7 +4,7 @@ module Gargantext.Components.Forest.Tree.Node.Action.Move
 import Data.Maybe (Maybe(..))
 import Data.Tuple.Nested ((/\))
 import Effect.Aff (Aff)
-import Gargantext.Components.Forest.Tree.Node.Action (Props, Action(..))
+import Gargantext.Components.Forest.Tree.Node.Action (Action(..))
 import Gargantext.Components.Forest.Tree.Node.Tools (submitButton, panel)
 import Gargantext.Components.Forest.Tree.Node.Tools.SubTree (SubTreeParamsIn, subTreeView, SubTreeOut(..))
 import Gargantext.Prelude

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

@@ -6,6 +6,7 @@ import Data.Set (Set)
 import Data.Set as Set
 import Data.String as S
 import Data.Tuple.Nested ((/\))
+import Gargantext.Types (Name)
 import Effect (Effect)
 import Effect.Aff (Aff, launchAff)
 import Effect.Uncurried (mkEffectFn1)
@@ -31,10 +32,9 @@ panel bodies submit =
           [ H.div { className: "row"
                   , style: {"margin":"10px"}
                   }
-                  [ H.div { className: "col-md-10" }
+                  [ H.div { className: "col-md-12" } bs
                           -- TODO add type for text or form here
-                          [ H.form {className: "form-horizontal"} bs
-                          ]
+                          -- [ H.form {className: "form-horizontal"} bs ]
                   ]
             ]
       footer sb = 
@@ -227,7 +227,7 @@ checkboxes :: forall a
            -> R.State (Set a)
            -> R.Element
 checkboxes xs (val /\ set) =
-  H.div {} $ map (\a -> H.div {} [ H.input { type: "checkbox"
+  H.fieldset {} $ map (\a -> H.div {} [ H.input { type: "checkbox"
                                            , checked: Set.member a val
                                            , on: { click: \_ -> set
                                                              $ const
@@ -239,4 +239,26 @@ checkboxes xs (val /\ set) =
                   ) xs
 
 
+-- START node text
+type NodeTextProps =
+  ( isSelected :: Boolean
+  , name       :: Name
+  )
+
+nodeText :: Record NodeTextProps -> R.Element
+nodeText p = R.createElement nodeTextCpt p []
+
+nodeTextCpt :: R.Component NodeTextProps
+nodeTextCpt = R.hooksComponent "G.C.F.T.N.B.nodeText" cpt
+  where
+    cpt { isSelected: true, name } _ = do
+      pure $ H.u {} [
+        H.b {} [
+           H.text ("| " <> name <> " |    ")
+         ]
+        ]
+    cpt {isSelected: false, name} _ = do
+      pure $ H.text (name <> "    ")
+-- END node text
+
 

src/Gargantext/Components/Forest/Tree/Node/Tools/SubTree.purs

 module Gargantext.Components.Forest.Tree.Node.Tools.SubTree where
 
-import DOM.Simple.Console (log2)
 import Data.Array as A
 import Data.Maybe (Maybe(..))
 import Data.Tuple.Nested ((/\))
-import Data.Generic.Rep (class Generic)
-import Data.Generic.Rep.Eq (genericEq)
 import Effect.Uncurried (mkEffectFn1)
-import Effect.Aff (Aff, launchAff)
-import Gargantext.Components.Forest.Tree.Node.Action (Props, Action(..))
+import Effect.Aff (Aff)
+import Gargantext.Components.Forest.Tree.Node.Action (Props)
 import Gargantext.Components.Forest.Tree.Node.Settings (SubTreeParams(..))
 import Gargantext.Components.Forest.Tree.Node.Tools.FTree (FTree, LNode(..), NTree(..))
+import Gargantext.Components.Forest.Tree.Node.Tools (nodeText)
 import Gargantext.Hooks.Loader (useLoader)
-import Gargantext.Prelude (discard, map, pure, show, unit, ($), (&&), (/=), (<>), class Eq, const)
+import Gargantext.Prelude (map, pure, show, ($), (&&), (/=), (<>), const, (==))
 import Gargantext.Routes as GR
 import Gargantext.Sessions (Session(..), get)
 import Gargantext.Types as GT
@@ -97,7 +95,7 @@ subTreeTreeViewCpt :: R.Component CorpusTreeProps
 subTreeTreeViewCpt = R.hooksComponent "G.C.F.T.N.A.U.subTreeTreeViewCpt" cpt
   where
     cpt p@{ id
-          , tree: NTree (LNode { id: sourceId
+          , tree: NTree (LNode { id: targetId
                                , name
                                , nodeType
                                }
@@ -106,28 +104,38 @@ subTreeTreeViewCpt = R.hooksComponent "G.C.F.T.N.A.U.subTreeTreeViewCpt" cpt
           , dispatch
           , subTreeOut
           } _ = do
-      pure $ {- H.div {} [ H.h5 { className: GT.fldr nodeType true} []
-      , -} H.div { className: "node" } 
-                 ( [ H.span { className: "name " <> clickable
-                            , on: { click: onClick }
-                            } [ H.text name ]
-
-                   ] <> children
-                 )
-                      -- ]
+            pure $  H.div {} [ -- H.h5 { className: GT.fldr nodeType true} [] 
+                         H.div { className: "node " <> GT.fldr nodeType true} 
+                                  ( [ H.span { className: "name " <> clickable
+                                             , on: { click: onClick }
+                                             } [ nodeText { isSelected: isSelected targetId subTreeOutParams
+                                                          , name
+                                                          }
+                                               ]
+
+                                    ] <> children
+                                  )
+                       ]
       where
 
         SubTreeParams { valitypes } = subTreeParams
 
         children = map (\c -> subTreeTreeView (p { tree = c })) ary
 
-        validNodeType = (A.elem nodeType valitypes) && (id /= sourceId)
+        validNodeType = (A.elem nodeType valitypes) && (id /= targetId)
+
+        clickable    = if validNodeType then "clickable" else ""
+
 
-        clickable = if validNodeType then "clickable" else ""
         sbto@( subTreeOutParams /\ setSubTreeOut) = subTreeOut
+
+        isSelected n sbtop = case sbtop of
+            Nothing -> false
+            (Just (SubTreeOut {out})) -> n == out
+
         onClick _ = mkEffectFn1 $ \_ -> case validNodeType of
                          false -> setSubTreeOut (const Nothing)
-                         true  -> setSubTreeOut (const $ Just $ SubTreeOut { in: id, out:sourceId})
+                         true  -> setSubTreeOut (const $ Just $ SubTreeOut { in: id, out:targetId})
 
 --------------------------------------------------------------------------------------------