Commit 98d17712 authored by Przemyslaw Kaminski's avatar Przemyslaw Kaminski

[Graph] implemented basic node search

parent c57efdc4
...@@ -60,7 +60,6 @@ type LocalControls = ...@@ -60,7 +60,6 @@ type LocalControls =
initialLocalControls :: R.Hooks (Record LocalControls) initialLocalControls :: R.Hooks (Record LocalControls)
initialLocalControls = do initialLocalControls = do
labelSize <- R.useState' 14.0 labelSize <- R.useState' 14.0
search <- R.useState' ""
pure $ { pure $ {
labelSize labelSize
...@@ -151,7 +150,8 @@ controlsCpt = R.hooksComponent "GraphControls" cpt ...@@ -151,7 +150,8 @@ controlsCpt = R.hooksComponent "GraphControls" cpt
-- zoom: 0 -100 - calculate ratio -- zoom: 0 -100 - calculate ratio
, RH.li {} [ multiSelectEnabledButton props.multiSelectEnabled ] -- toggle multi node selection , RH.li {} [ multiSelectEnabledButton props.multiSelectEnabled ] -- toggle multi node selection
-- save button -- save button
, RH.li {} [ nodeSearchControl { selectedNodeIds: props.selectedNodeIds } ] , RH.li {} [ nodeSearchControl { graph: props.graph
, selectedNodeIds: props.selectedNodeIds } ]
] ]
] ]
] ]
......
...@@ -3,49 +3,65 @@ module Gargantext.Components.GraphExplorer.Search ...@@ -3,49 +3,65 @@ module Gargantext.Components.GraphExplorer.Search
, nodeSearchControl , nodeSearchControl
) where ) where
import Global (readFloat)
import Prelude import Prelude
import Data.Maybe (Maybe(..), fromMaybe)
import Data.Sequence as Seq
import Data.Set as Set import Data.Set as Set
import Data.Tuple (snd) import Data.String as S
import Data.Tuple.Nested ((/\)) import Data.Tuple.Nested ((/\))
import DOM.Simple.Console (log2)
import Effect (Effect) import Effect (Effect)
import FFI.Simple ((..)) import FFI.Simple ((..))
import Reactix as R import Reactix as R
import Reactix.DOM.HTML as H import Reactix.DOM.HTML as H
import Gargantext.Hooks.Sigmax as Sigmax
import Gargantext.Hooks.Sigmax.Sigma as Sigma
import Gargantext.Hooks.Sigmax.Types as SigmaxTypes import Gargantext.Hooks.Sigmax.Types as SigmaxTypes
import Gargantext.Utils.Reactix as R2
type Props = ( type Props = (
selectedNodeIds :: R.State SigmaxTypes.SelectedNodeIds graph :: SigmaxTypes.SGraph
, selectedNodeIds :: R.State SigmaxTypes.SelectedNodeIds
) )
-- | Whether a node matches a search string
nodeMatchesSearch :: String -> Record SigmaxTypes.Node -> Boolean
nodeMatchesSearch s n = S.contains (S.Pattern $ normalize s) (normalize n.label)
where
normalize = S.toLower
searchNodes :: String -> Seq.Seq (Record SigmaxTypes.Node) -> Seq.Seq (Record SigmaxTypes.Node)
searchNodes s = Seq.filter (nodeMatchesSearch s)
nodeSearchControl :: Record Props -> R.Element nodeSearchControl :: Record Props -> R.Element
nodeSearchControl props = R.createElement sizeButtonCpt props [] nodeSearchControl props = R.createElement sizeButtonCpt props []
sizeButtonCpt :: R.Component Props sizeButtonCpt :: R.Component Props
sizeButtonCpt = R.hooksComponent "NodeSearchControl" cpt sizeButtonCpt = R.hooksComponent "NodeSearchControl" cpt
where where
cpt {selectedNodeIds} _ = do cpt {graph, selectedNodeIds} _ = do
(search /\ setSearch) <- R.useState' "" search@(search' /\ setSearch) <- R.useState' Nothing
pure $ pure $
H.div { className: "form-group" } H.div { className: "form-group" }
[ H.div { className: "input-group" } [ H.div { className: "input-group" }
[ H.input { type: "text" [ H.input { type: "text"
, className: "form-control" , className: "form-control"
, defaultValue: search , defaultValue: fromMaybe "" search'
, on: { input: \e -> setSearch $ const $ e .. "target" .. "value" } , on: { input: \e -> setSearch $ const $ Just $ e .. "target" .. "value" }
} }
, H.div { className: "btn input-group-addon" , H.div { className: "btn input-group-addon"
, on: { click: \_ -> log2 "[sizeButtonCpt] search" search } , on: { click: \_ -> triggerSearch graph search selectedNodeIds }
} }
[ H.span { className: "fa fa-search" } [] ] [ H.span { className: "fa fa-search" } [] ]
] ]
] ]
-- TODO Wherefrom do I get graph nodes? triggerSearch :: SigmaxTypes.SGraph
-- How to implement filtering here? I want to set selectedNodeIds based on graph data. -> R.State (Maybe String)
-> R.State SigmaxTypes.SelectedNodeIds
-> Effect Unit
triggerSearch graph (search /\ setSearch) (_ /\ setSelectedNodeIds) = do
case search of
Nothing -> pure unit
Just s -> do
let nodes = SigmaxTypes.graphNodes graph
setSelectedNodeIds $ const $ Set.fromFoldable $ ((_.id) <$> searchNodes s nodes)
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