module Gargantext.Components.GraphExplorer.Search ( Props , nodeSearchControl ) where import Global (readFloat) import Prelude import Data.Set as Set import Data.Tuple (snd) import Data.Tuple.Nested ((/\)) import DOM.Simple.Console (log2) import Effect (Effect) import FFI.Simple ((..)) import Reactix as R 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.Utils.Reactix as R2 type Props = ( selectedNodeIds :: R.State SigmaxTypes.SelectedNodeIds ) nodeSearchControl :: Record Props -> R.Element nodeSearchControl props = R.createElement sizeButtonCpt props [] sizeButtonCpt :: R.Component Props sizeButtonCpt = R.hooksComponent "NodeSearchControl" cpt where cpt {selectedNodeIds} _ = do (search /\ setSearch) <- R.useState' "" pure $ H.div { className: "form-group" } [ H.div { className: "input-group" } [ H.input { type: "text" , className: "form-control" , defaultValue: search , on: { input: \e -> setSearch $ const $ e .. "target" .. "value" } } , H.div { className: "btn input-group-addon" , on: { click: \_ -> log2 "[sizeButtonCpt] search" search } } [ H.span { className: "fa fa-search" } [] ] ] ] -- TODO Wherefrom do I get graph nodes? -- How to implement filtering here? I want to set selectedNodeIds based on graph data.