[Graph] add preliminary node selection query on sidebar

This still doesn't show up because I need GraphSideCorpus array from
somewhere, apparently.

src/Gargantext/Components/Graph.purs

@@ -32,6 +32,7 @@ type Props sigma forceatlas2 =
   ( elRef :: R.Ref (Nullable Element)
   , forceAtlas2Settings :: forceatlas2
   , graph :: Graph
+  , selectedNodeIds :: R.State SigmaxTypes.SelectedNodeIds
   , sigmaSettings :: sigma
   , sigmaRef :: R.Ref Sigmax.Sigma
   )
@@ -43,10 +44,8 @@ graphCpt :: forall s fa2. R.Component (Props s fa2)
 graphCpt = R.hooksComponent "Graph" cpt
   where
     cpt props _ = do
-      (selectedNodeIds /\ setSelectedNodeIds) <- R.useState' $ Set.empty
-
-      let (SigmaxTypes.Graph {nodes: nodes}) = props.graph
-      let nodesMap = Map.fromFoldable $ map (\n -> Tuple n.id {color: n.color}) nodes
+      let nodesMap = SigmaxTypes.nodesMap props.graph
+      let (selectedNodeIds /\ setSelectedNodeIds) = props.selectedNodeIds
 
       R.useEffect' $ do
         Sigmax.dependOnSigma (R.readRef props.sigmaRef) "[graphCpt] no sigma" $ \sigma ->

src/Gargantext/Components/GraphExplorer.purs

@@ -5,10 +5,12 @@ import Gargantext.Prelude hiding (max,min)
 import Data.FoldableWithIndex (foldMapWithIndex)
 import Data.Foldable (foldMap)
 import Data.Int (toNumber)
+import Data.Map as Map
 import Data.Maybe (Maybe(..))
 import Data.Nullable (null, Nullable)
 import Data.Sequence as Seq
-import Data.Tuple (fst,snd)
+import Data.Set as Set
+import Data.Tuple (fst, snd, Tuple(..))
 import Data.Tuple.Nested ((/\))
 import DOM.Simple.Types (Element)
 import Effect.Aff (Aff)
@@ -17,7 +19,7 @@ import Reactix.DOM.HTML as RH
 
 import Gargantext.Hooks.Loader (useLoader)
 import Gargantext.Hooks.Sigmax (Sigma)
-import Gargantext.Hooks.Sigmax.Types as Sigmax
+import Gargantext.Hooks.Sigmax.Types as SigmaxTypes
 import Gargantext.Components.GraphExplorer.Controls as Controls
 import Gargantext.Components.GraphExplorer.Sidebar as Sidebar
 import Gargantext.Components.GraphExplorer.ToggleButton as Toggle
@@ -70,6 +72,8 @@ explorerCpt = R.hooksComponent "G.C.GraphExplorer.explorer" cpt
       controls <- Controls.useGraphControls
       state <- useExplorerState
       showLogin <- snd <$> R.useState' true
+      selectedNodeIds <- R.useState' $ Set.empty
+
       pure $
         RH.div
           { id: "graph-explorer" }
@@ -84,8 +88,9 @@ explorerCpt = R.hooksComponent "G.C.GraphExplorer.explorer" cpt
                 , row [ Controls.controls controls ]
                 , row [ tree {mCurrentRoute, treeId} controls showLogin
                       , RH.div { ref: graphRef, id: "graph-view", className: "col-md-12", style: {height: "95%"} } []  -- graph container
-                      , mGraph graphRef controls.sigmaRef {graphId, graph}
-                      , Sidebar.sidebar {showSidePanel: fst controls.showSidePanel} ]
+                      , mGraph graphRef controls.sigmaRef {graphId, graph, selectedNodeIds}
+                      , mSidebar graph {session, selectedNodeIds, showSidePanel: fst controls.showSidePanel}
+                      ]
                 , row [
                   ]
                 ]
@@ -107,9 +112,27 @@ explorerCpt = R.hooksComponent "G.C.GraphExplorer.explorer" cpt
     pullLeft  = RH.div { className: "pull-left" }
     pullRight = RH.div { className: "pull-right" }
 
-    mGraph :: R.Ref (Nullable Element) -> R.Ref Sigma -> {graphId :: GraphId, graph :: Maybe Graph.Graph} -> R.Element
+    mGraph :: R.Ref (Nullable Element)
+           -> R.Ref Sigma
+           -> { graphId :: GraphId
+              , graph :: Maybe Graph.Graph
+              , selectedNodeIds :: R.State SigmaxTypes.SelectedNodeIds}
+           -> R.Element
     mGraph _ _ {graph: Nothing} = RH.div {} []
-    mGraph graphRef sigmaRef {graphId, graph: Just graph} = graphView graphRef sigmaRef {graphId, graph}
+    mGraph graphRef sigmaRef {graphId, graph: Just graph, selectedNodeIds} = graphView graphRef sigmaRef {graphId, graph, selectedNodeIds}
+
+    mSidebar :: Maybe Graph.Graph
+             -> { showSidePanel :: Boolean
+                , selectedNodeIds :: R.State SigmaxTypes.SelectedNodeIds
+                , session :: Session }
+             -> R.Element
+    mSidebar Nothing _ = RH.div {} []
+    mSidebar (Just graph) {session, selectedNodeIds, showSidePanel} =
+      Sidebar.sidebar { graph
+                      , session
+                      , selectedNodeIds
+                      , showSidePanel
+                      }
 
 useExplorerState :: R.Hooks (Record GET.State)
 useExplorerState = do pure {}
@@ -132,6 +155,7 @@ useExplorerState = do pure {}
 type GraphProps = (
     graphId :: GraphId
   , graph :: Graph.Graph
+  , selectedNodeIds :: R.State SigmaxTypes.SelectedNodeIds
 )
 
 graphView :: R.Ref (Nullable Element) -> R.Ref Sigma -> Record GraphProps -> R.Element
@@ -140,17 +164,18 @@ graphView elRef sigmaRef props = R.createElement el props []
   where
     --memoCmp props1 props2 = props1.graphId == props2.graphId
     el = R.hooksComponent "GraphView" cpt
-    cpt {graphId, graph} _children = do
+    cpt {graphId, graph, selectedNodeIds} _children = do
       pure $ Graph.graph {
           elRef
         , forceAtlas2Settings: Graph.forceAtlas2Settings
         , graph
+        , selectedNodeIds
         , sigmaSettings: Graph.sigmaSettings
         , sigmaRef: sigmaRef
         }
 
 convert :: GET.GraphData -> Graph.Graph
-convert (GET.GraphData r) = Sigmax.Graph {nodes, edges}
+convert (GET.GraphData r) = SigmaxTypes.Graph {nodes, edges}
   where
     nodes = foldMapWithIndex nodeFn r.nodes
     nodeFn i (GET.Node n) =

src/Gargantext/Components/GraphExplorer/Sidebar.purs

@@ -3,10 +3,25 @@ module Gargantext.Components.GraphExplorer.Sidebar
   where
 
 import Prelude
+import Data.Map as Map
+import Data.Maybe (Maybe(..))
+import Data.Set as Set
+import Data.Tuple.Nested((/\))
 import Reactix as R
 import Reactix.DOM.HTML as RH
 
-type Props = ( showSidePanel :: Boolean )
+import Gargantext.Components.RandomText (words)
+import Gargantext.Components.Nodes.Corpus.Graph.Tabs as GT
+import Gargantext.Components.Graph as Graph
+import Gargantext.Hooks.Sigmax.Types as SigmaxTypes
+import Gargantext.Sessions (Session)
+
+type Props =
+  ( graph :: Graph.Graph
+  , selectedNodeIds :: R.State SigmaxTypes.SelectedNodeIds
+  , session :: Session
+  , showSidePanel :: Boolean
+  )
 
 sidebar :: Record Props -> R.Element
 sidebar props = R.createElement sidebarCpt props []
@@ -17,6 +32,8 @@ sidebarCpt = R.hooksComponent "Sidebar" cpt
     cpt {showSidePanel: false} _children = do
       pure $ RH.div {} []
     cpt props _children = do
+      let nodesMap = SigmaxTypes.nodesMap props.graph
+
       pure $
         RH.div { id: "sp-container", className: "col-md-2" }
         [ RH.div {}
@@ -39,7 +56,16 @@ sidebarCpt = R.hooksComponent "Sidebar" cpt
                 [ checkbox "Pubs"
                 , checkbox "Projects"
                 , checkbox "Patents"
-                , checkbox "Others" ] ] ] ] ]
+                , checkbox "Others"
+                ]
+              ]
+            , RH.div { className: "col-md-12", id: "query" }
+              [
+                query props.session nodesMap props.selectedNodeIds
+              ]
+            ]
+          ]
+        ]
     badge text =
       RH.a { className: "badge badge-light" } [ RH.text text ]
     checkbox text =
@@ -59,3 +85,10 @@ sidebarCpt = R.hooksComponent "Sidebar" cpt
       , "software engineering"
       , "complex systems"
       , "wireless communications" ]
+
+    query session nodesMap (selectedNodeIds /\ _) =
+      GT.tabs {session, query: q <$> Set.toUnfoldable selectedNodeIds, sides: []}
+      where
+        q id = case Map.lookup id nodesMap of
+          Nothing -> []
+          Just n -> words n.label

src/Gargantext/Hooks/Sigmax.purs

@@ -22,7 +22,7 @@ import Effect.Class.Console (error)
 import Effect.Timer (TimeoutId, clearTimeout)
 import FFI.Simple (delay, (.=))
 import Gargantext.Hooks.Sigmax.Sigma as Sigma
-import Gargantext.Hooks.Sigmax.Types (Graph(..), Node(..))
+import Gargantext.Hooks.Sigmax.Types (Graph(..), Node(..), NodesMap, SelectedNodeIds)
 import Gargantext.Utils.Reactix as R2
 import Prelude (Unit, bind, const, discard, flip, pure, unit, ($), (*>), (<$), (<$>), (<<<), (<>), (>>=), not)
 import Reactix as R
@@ -330,7 +330,7 @@ setEdges sigma val = do
       Sigma.setSettings sigma settings
     _ -> pure unit
 
-markSelectedNodes :: Sigma.Sigma -> Set.Set String -> Map.Map String {color :: String} -> Effect Unit
+markSelectedNodes :: Sigma.Sigma -> SelectedNodeIds -> NodesMap -> Effect Unit
 markSelectedNodes sigma selectedNodeIds graphNodes = do
   log2 "[markSelectedNodes] selectedNodeIds" selectedNodeIds
   Sigma.forEachNode sigma \n -> do

src/Gargantext/Hooks/Sigmax/Sigma.js

@@ -55,6 +55,7 @@ function killSigma(left, right, sigma) {
 }
 function clear(sigma) { sigma.graph.clear(); }
 function bind(sigma, event, handler) { sigma.bind(event, handler); }
+function unbind(sigma, event) { sigma.unbind(event); }
 function forEachNode(sigma, handler) { sigma.graph.nodes().forEach(handler); }
 function forEachEdge(sigma, handler) { sigma.graph.edges().forEach(handler); }
 function setSettings(sigma, settings) { sigma.settings(settings); }
@@ -82,6 +83,7 @@ exports._setRendererContainer = setRendererContainer;
 exports._killSigma = killSigma
 exports._clear = clear;
 exports._bind = bind;
+exports._unbind = unbind;
 exports._forEachNode = forEachNode;
 exports._forEachEdge = forEachEdge;
 exports._setSettings = setSettings;

src/Gargantext/Hooks/Sigmax/Sigma.purs

@@ -119,6 +119,11 @@ bind_ s e h = runEffectFn3 _bind s e (mkEffectFn1 h)
 
 foreign import _bind :: forall e. EffectFn3 Sigma String (EffectFn1 e Unit) Unit
 
+unbind_ :: forall e. Sigma -> String -> Effect Unit
+unbind_ s e = runEffectFn2 _unbind s e
+
+foreign import _unbind :: forall e. EffectFn2 Sigma String Unit
+
 forEachNode :: Sigma -> (Record Types.Node -> Effect Unit) -> Effect Unit
 forEachNode s f = runEffectFn2 _forEachNode s (mkEffectFn1 f)
 
@@ -134,6 +139,9 @@ bindClickNode sigma f = bind_ sigma "clickNode" $ \e -> do
   let node = e .. "data" .. "node" :: Record Types.Node
   f node
 
+unbindClickNode :: Sigma -> Effect Unit
+unbindClickNode sigma = unbind_ sigma "clickNode"
+
 setSettings :: forall settings. Sigma -> settings -> Effect Unit
 setSettings sigma settings = do
   runEffectFn2 _setSettings sigma settings

src/Gargantext/Hooks/Sigmax/Types.purs

 module Gargantext.Hooks.Sigmax.Types where
 
+import Prelude (map, ($))
+import Data.Map as Map
 import Data.Sequence (Seq)
+import Data.Set as Set
+import Data.Tuple (Tuple(..))
 import DOM.Simple.Types (Element)
 
 newtype Graph n e = Graph { nodes :: Seq {|n}, edges :: Seq {|e} }
@@ -23,3 +27,11 @@ type Node =
   , color :: String )
 
 type Edge = ( id :: String, source :: String, target :: String )
+
+type SelectedNodeIds = Set.Set String
+type NodesMap = Map.Map String (Record Node)
+
+nodesMap :: Graph Node Edge -> NodesMap
+nodesMap graph = do
+  let (Graph {nodes}) = graph
+  Map.fromFoldable $ map (\n -> Tuple n.id n) nodes