Commit 14586cea authored by Przemyslaw Kaminski's avatar Przemyslaw Kaminski

Merge branch 'dev-graph-eff-rewrite' into dev

parents 8fd75474 22367b4a
......@@ -12,7 +12,7 @@
}
#graph-explorer #sp-container {
position: absolute;
left: 63%;
left: 70%;
top: 150px;
z-index: 1;
border: 1px white solid;
......
......@@ -12,7 +12,7 @@
#sp-container
position: absolute
left: 63%
left: 70%
top: 150px
z-index: 1
border: 1px white solid
......
......@@ -5,15 +5,15 @@ module Gargantext.Components.FacetsTable where
import Prelude
import Data.Argonaut (class DecodeJson, class EncodeJson, decodeJson, jsonEmptyObject, (.:), (:=), (~>))
import Data.Array (filter, (!!))
import Data.Array (concat, filter, (!!))
import Data.Generic.Rep (class Generic)
import Data.Generic.Rep.Show (genericShow)
import Data.Maybe (Maybe(..))
import Data.Set (Set)
import Data.Set as Set
import Data.Tuple (fst)
import Data.Tuple (fst, snd)
import Data.Tuple.Nested ((/\))
import DOM.Simple.Console (log)
import DOM.Simple.Console (log, log2)
import Effect (Effect)
import Effect.Class (liftEffect)
import Effect.Aff (Aff, launchAff_)
......@@ -44,7 +44,8 @@ newtype SearchQuery = SearchQuery { query :: TextQuery }
instance encodeJsonSearchQuery :: EncodeJson SearchQuery where
encodeJson (SearchQuery {query})
= "query" := query !! 0 -- TODO anoe
-- = "query" := query !! 0 -- TODO anoe
= "query" := concat query
~> jsonEmptyObject
newtype SearchResults = SearchResults { results :: Array Response }
......@@ -170,6 +171,14 @@ docViewCpt = R.hooksComponent "G.C.FacetsTable.DocView" cpt
cpt {frontends, session, nodeId, listId, query, totalRecords, chart, container} _ = do
deletions <- R.useState' initialDeletions
path <- R.useState' $ initialPagePath {nodeId, listId, query, session}
R.useEffect' $ do
let ipp = initialPagePath {nodeId, listId, query, session}
if fst path == ipp then
pure unit
else
snd path $ const ipp
pure $ H.div { className: "container1" }
[ H.div { className: "row" }
[ chart
......@@ -237,7 +246,6 @@ initialPagePath {session, nodeId, listId, query} = {session, nodeId, listId, que
loadPage :: PagePath -> Aff (Array DocumentsView)
loadPage {session, nodeId, listId, query, params: {limit, offset, orderBy}} = do
liftEffect $ log "loading documents page: loadPage with Offset and limit"
let p = Search { listId, offset, limit, orderBy: convOrderBy <$> orderBy } (Just nodeId)
SearchResults res <- post session p $ SearchQuery {query}
pure $ res2corpus <$> res.results
......@@ -280,10 +288,10 @@ page :: Record PageProps -> R.Element
page props = R.createElement pageCpt props []
pageCpt :: R.Component PageProps
pageCpt = R.staticComponent "G.C.FacetsTable.Page" cpt
pageCpt = R.hooksComponent "G.C.FacetsTable.Page" cpt
where
cpt {frontends, totalRecords, container, deletions, documents, session, path: path@({nodeId, listId, query} /\ setPath)} _ = do
T.table { rows, container, colNames, totalRecords, params, wrapColElts}
pure $ T.table { rows, container, colNames, totalRecords, params, wrapColElts }
where
setParams f = setPath $ \p@{params: ps} -> p {params = f ps}
params = (fst path).params /\ setParams
......
......@@ -4,31 +4,28 @@ module Gargantext.Components.Graph
-- , forceAtlas2Settings, ForceAtlas2Settings, ForceAtlas2OptionalSettings
-- )
where
import Prelude (bind, discard, pure, ($), unit, map)
import Prelude (bind, const, discard, pure, ($), unit)
import Data.Either (Either(..))
import Data.Map as Map
import Data.Maybe (Maybe(..))
import Data.Nullable (notNull, null, Nullable)
import Data.Set as Set
import Data.Tuple (fst, snd, Tuple(..))
import Data.Nullable (Nullable)
import Data.Tuple (fst)
import Data.Tuple.Nested ((/\))
import DOM.Simple (createElement, setAttr)
import DOM.Simple.Console (log, log2)
import DOM.Simple.Types (Element)
import Effect.Timer (setTimeout)
import FFI.Simple (delay, (..))
import FFI.Simple (delay)
import Reactix as R
import Reactix.DOM.HTML as RH
import Gargantext.Hooks.Sigmax as Sigmax
import Gargantext.Hooks.Sigmax.Types as SigmaxTypes
import Gargantext.Hooks.Sigmax.Sigma as Sigma
import Gargantext.Utils.Reactix as R2
type OnProps = ()
type Graph = SigmaxTypes.Graph SigmaxTypes.Node SigmaxTypes.Edge
data Stage = Init | Ready | Cleanup
type Props sigma forceatlas2 =
( elRef :: R.Ref (Nullable Element)
, forceAtlas2Settings :: forceatlas2
......@@ -36,6 +33,7 @@ type Props sigma forceatlas2 =
, selectedNodeIds :: R.State SigmaxTypes.SelectedNodeIds
, sigmaSettings :: sigma
, sigmaRef :: R.Ref Sigmax.Sigma
, stage :: R.State Stage
)
graph :: forall s fa2. Record (Props s fa2) -> R.Element
......@@ -45,14 +43,18 @@ graphCpt :: forall s fa2. R.Component (Props s fa2)
graphCpt = R.hooksComponent "Graph" cpt
where
cpt props _ = do
let nodesMap = SigmaxTypes.nodesMap props.graph
let selectedNodeIds = props.selectedNodeIds
stageHooks props
R.useEffect' $ do
Sigmax.dependOnSigma (R.readRef props.sigmaRef) "[graphCpt] no sigma" $ \sigma ->
Sigmax.markSelectedNodes sigma (fst selectedNodeIds) nodesMap
-- NOTE: This div is not empty after sigma initializes.
-- When we change state, we make it empty though.
--pure $ RH.div { ref: props.elRef, style: {height: "95%"} } []
pure $ case R.readNullableRef props.elRef of
Nothing -> RH.div {} []
Just el -> R.createPortal [] el
stageHooks props@{stage: (Init /\ setStage)} = do
R.useEffectOnce $ do
log "[graphCpt] effect once"
let rSigma = R.readRef props.sigmaRef
case Sigmax.readSigma rSigma of
......@@ -76,20 +78,26 @@ graphCpt = R.hooksComponent "Graph" cpt
Sigma.startForceAtlas2 sig props.forceAtlas2Settings
-- bind the click event only initially, when ref was empty
Sigmax.bindSelectedNodesClick props.sigmaRef selectedNodeIds
Sigmax.bindSelectedNodesClick props.sigmaRef props.selectedNodeIds
Just sig -> do
pure unit
setStage $ const $ Ready
delay unit $ \_ -> do
log "[GraphCpt] cleanup"
log "[graphCpt] cleanup"
pure $ pure unit
-- NOTE: This div is not empty after sigma initializes.
-- When we change state, we make it empty though.
--pure $ RH.div { ref: props.elRef, style: {height: "95%"} } []
pure $ case R.readNullableRef props.elRef of
Nothing -> RH.div {} []
Just el -> R.createPortal [] el
stageHooks props@{stage: (Ready /\ setStage)} = do
let nodesMap = SigmaxTypes.nodesMap props.graph
-- TODO Probably this can be optimized to re-mark selected nodes only when they changed
R.useEffect' $ do
Sigmax.dependOnSigma (R.readRef props.sigmaRef) "[graphCpt] no sigma" $ \sigma ->
Sigmax.markSelectedNodes sigma (fst props.selectedNodeIds) nodesMap
stageHooks _ = pure unit
type SigmaSettings =
( animationsTime :: Number
......
......@@ -18,6 +18,7 @@ import Reactix.DOM.HTML as RH
import Gargantext.Hooks.Loader (useLoader)
import Gargantext.Hooks.Sigmax (Sigma)
import Gargantext.Hooks.Sigmax as Sigmax
import Gargantext.Hooks.Sigmax.Types as SigmaxTypes
import Gargantext.Components.GraphExplorer.Controls as Controls
import Gargantext.Components.GraphExplorer.Sidebar as Sidebar
......@@ -69,12 +70,23 @@ explorerCpt :: R.Component Props
explorerCpt = R.hooksComponent "G.C.GraphExplorer.explorer" cpt
where
cpt {frontends, graph, graphId, mCurrentRoute, mMetaData, session, sessions, treeId} _ = do
dataRef <- R.useRef graph
graphRef <- R.useRef null
controls <- Controls.useGraphControls
state <- useExplorerState
showLogin <- snd <$> R.useState' true
selectedNodeIds <- R.useState' $ Set.empty
R.useEffect' $ do
case Tuple (R.readRef dataRef) graph of
Tuple Nothing Nothing -> pure unit
Tuple (Just g1) (Just g2) | SigmaxTypes.eqGraph g1 g2 -> pure unit
_ -> do
let rSigma = R.readRef controls.sigmaRef
Sigmax.cleanupSigma rSigma "explorerCpt"
R.setRef dataRef graph
snd selectedNodeIds $ const Set.empty
snd controls.graphStage $ const Graph.Init
R.useEffect' $ do
if fst controls.showSidePanel == GET.InitialClosed && (not Set.isEmpty $ fst selectedNodeIds) then
snd controls.showSidePanel $ \_ -> GET.Opened
......@@ -94,8 +106,8 @@ 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, selectedNodeIds}
, RH.div { ref: graphRef, id: "graph-view", className: graphClassName controls, style: {height: "95%"} } [] -- graph container
, mGraph graphRef controls.sigmaRef {graphId, graph, graphStage: controls.graphStage, selectedNodeIds}
, mSidebar graph mMetaData {frontends, session, selectedNodeIds, showSidePanel: fst controls.showSidePanel}
]
, row [
......@@ -110,6 +122,11 @@ explorerCpt = R.hooksComponent "G.C.GraphExplorer.explorer" cpt
tree {mCurrentRoute: route, treeId: root} _ showLogin =
RH.div {className: "col-md-2", style: {paddingTop: "60px"}}
[forest {sessions, route, frontends, showLogin}]
graphClassName :: Record Controls.Controls -> String
graphClassName {showSidePanel: (GET.Opened /\ _), showTree: (true /\ _)} = "col-md-8"
graphClassName {showTree: (true /\ _)} = "col-md-10"
graphClassName {showSidePanel: (GET.Opened /\ _)} = "col-md-10"
graphClassName _ = "col-md-12"
outer = RH.div { className: "col-md-12" }
inner = RH.div { className: "container-fluid", style: { paddingTop: "90px" } }
......@@ -123,10 +140,11 @@ explorerCpt = R.hooksComponent "G.C.GraphExplorer.explorer" cpt
-> R.Ref Sigma
-> { graphId :: GraphId
, graph :: Maybe Graph.Graph
, graphStage :: R.State Graph.Stage
, selectedNodeIds :: R.State SigmaxTypes.SelectedNodeIds}
-> R.Element
mGraph _ _ {graph: Nothing} = RH.div {} []
mGraph graphRef sigmaRef {graphId, graph: Just graph, selectedNodeIds} = graphView graphRef sigmaRef {graphId, graph, selectedNodeIds}
mGraph graphRef sigmaRef r@{graph: Just graph} = graphView graphRef sigmaRef $ r { graph = graph }
mSidebar :: Maybe Graph.Graph
-> Maybe GET.MetaData
......@@ -146,27 +164,10 @@ explorerCpt = R.hooksComponent "G.C.GraphExplorer.explorer" cpt
, showSidePanel
}
useExplorerState :: R.Hooks (Record GET.State)
useExplorerState = do pure {}
{- corpusId <- R.useState' 0
cursorSize <- R.useState' 0.0
filePath <- R.useState' ""
graphData <- R.useState' initialGraphData
legendData <- R.useState' []
multiNodeSelection <- R.useState' false
selectedNodes <- R.useState' Set.empty
showControls <- R.useState' false
showSidePanel <- R.useState' false
showTree <- R.useState' false
sigmaGraphData <- R.useState' (Nothing :: Maybe Graph.Graph)
sigmaSettings <- R.useState' Graph.sigmaSettings
treeId <- R.useState' (Nothing :: Maybe TreeId) -}
--treeId : Nothing
type GraphProps = (
graphId :: GraphId
, graph :: Graph.Graph
, graphStage :: R.State Graph.Stage
, selectedNodeIds :: R.State SigmaxTypes.SelectedNodeIds
)
......@@ -184,6 +185,7 @@ graphView elRef sigmaRef props = R.createElement el props []
, selectedNodeIds
, sigmaSettings: Graph.sigmaSettings
, sigmaRef: sigmaRef
, stage: props.graphStage
}
convert :: GET.GraphData -> Tuple (Maybe GET.MetaData) Graph.Graph
......
......@@ -11,10 +11,10 @@ module Gargantext.Components.GraphExplorer.Controls
) where
import Data.Maybe (Maybe(..))
import DOM.Simple.Console (log, log2)
import Data.Tuple (fst)
import Data.Tuple.Nested ((/\), get1)
import Effect (Effect)
import Effect.Timer (clearTimeout, setTimeout)
import Effect.Timer (setTimeout)
import Prelude
import Reactix as R
import Reactix.DOM.HTML as RH
......@@ -26,12 +26,12 @@ import Gargantext.Components.GraphExplorer.SlideButton (cursorSizeButton, labelS
import Gargantext.Components.GraphExplorer.ToggleButton (edgesToggleButton, pauseForceAtlasButton)
import Gargantext.Components.GraphExplorer.Types as GET
import Gargantext.Hooks.Sigmax as Sigmax
import Gargantext.Hooks.Sigmax.Sigma as Sigma
import Gargantext.Utils.Range as Range
import Gargantext.Utils.Reactix as R2
type Controls =
( cursorSize :: R.State Number
, graphStage :: R.State Graph.Stage
, multiNodeSelect :: R.Ref Boolean
, showControls :: R.State Boolean
, showSidePanel :: R.State GET.SidePanelState
......@@ -76,15 +76,19 @@ controlsCpt = R.hooksComponent "GraphControls" cpt
localControls <- initialLocalControls
-- ref to track automatic FA pausing
-- If user pauses FA before auto is triggered, clear the timeoutId
-- TODO: mFAPauseRef needs to be set higher up the tree
mFAPauseRef <- R.useRef Nothing
-- when graph is changed, cleanup the mFAPauseRef
R.useEffect' $ do
case fst props.graphStage of
Graph.Init -> R.setRef mFAPauseRef Nothing
_ -> pure unit
--R.useEffect $ handleForceAtlasPause props.sigmaRef localControls.pauseForceAtlas mFAPauseRef
R.useEffect' $ Sigmax.handleForceAtlas2Pause props.sigmaRef localControls.pauseForceAtlas (get1 localControls.showEdges) mFAPauseRef
R.useEffectOnce' $ do
timeoutId <- setTimeout 2000 $ do
--R.setRef mFAPauseRef Nothing
let (toggled /\ setToggled) = localControls.pauseForceAtlas
if toggled then
setToggled $ const false
......@@ -122,6 +126,7 @@ controlsCpt = R.hooksComponent "GraphControls" cpt
useGraphControls :: R.Hooks (Record Controls)
useGraphControls = do
cursorSize <- R.useState' 10.0
graphStage <- R.useState' Graph.Init
multiNodeSelect <- R.useRef false
showControls <- R.useState' false
showSidePanel <- R.useState' GET.InitialClosed
......@@ -130,6 +135,7 @@ useGraphControls = do
sigmaRef <- R.useRef sigma
pure { cursorSize
, graphStage
, multiNodeSelect
, showControls
, showSidePanel
......
......@@ -99,6 +99,8 @@ instance toUrlFrontendAppRoute :: ToUrl Frontend R.AppRoute where
-- | The currently selected App and Static configurations
newtype Frontends = Frontends { app :: Frontend, static :: Frontend }
derive instance eqFrontends :: Eq Frontends
instance toUrlFrontendsRoutes :: ToUrl Frontends R.AppRoute where
toUrl f r = appUrl f (R.appPath r)
......
module Gargantext.Hooks.Loader where
import Gargantext.Prelude
import Data.Maybe (Maybe(..), isNothing, maybe, maybe')
import Data.Tuple (fst)
import Data.Maybe (Maybe(..), isJust, isNothing, maybe, maybe')
import Data.Tuple (fst, Tuple(..))
import Data.Tuple.Nested ((/\))
import DOM.Simple.Console (log, log2)
import Effect.Aff (Aff)
import Effect.Class (liftEffect)
import FFI.Simple (delay)
import Reactix as R
import Gargantext.Utils.Reactix as R2
import Gargantext.Components.LoadingSpinner (loadingSpinner)
useAff :: forall st.
Aff st -> R.Hooks (Maybe st)
useAff loader = do
(loaded /\ setLoaded) <- R.useState' Nothing
R.useEffect1 loader $ do
if isNothing loaded then
R2.affEffect "G.H.Loader.useAff" $
loader >>= (liftEffect <<< setLoaded <<< const <<< Just)
else pure R.nothing
pure loaded
useLoader :: forall path st.
path -> (path -> Aff st) -> (st -> R.Element) -> R.Hooks R.Element
useLoader path loader render
= maybe' (\_ -> loadingSpinner {}) render
<$> (useAff =<< R.useMemo2 path loader (\_ -> loader path))
useLoader2 :: forall path st.
R.State path -> (path -> Aff st)
-> (st -> R.Element) -> R.Hooks R.Element
useLoader2 path loader render = do
useLoader :: forall path st. Eq path =>
path -> (path -> Aff st)
-> (st -> R.Element) -> R.Hooks R.Element
useLoader path loader render = do
state <- R.useState' Nothing
useLoaderEffect2 path state loader
useLoaderEffect path state loader
pure $ maybe (loadingSpinner {}) render (fst state)
useLoaderEffect :: forall state.
Aff state -> R.State (Maybe state) -> R.Hooks Unit
useLoaderEffect loader (state /\ setState) = do
R.useEffect2 state loader $ do
if isNothing state then
R2.affEffect "G.H.Loader.useLoader" $ loader >>= (liftEffect <<< setState <<< const <<< Just)
else pure R.nothing
useLoaderEffect' :: forall state.
Aff state -> R.Hooks (R.State (Maybe state))
useLoaderEffect' aff = do
state <- R.useState' Nothing
useLoaderEffect aff state
pure state
useLoaderEffect2 :: forall st path.
R.State path -> R.State (Maybe st)
-> (path -> Aff st) -> R.Hooks Unit
useLoaderEffect2 path state loader = do
aff <- useRepointer path loader
useLoaderEffect aff state
useRepointer :: forall path st.
R.State path -> (path -> Aff st) -> R.Hooks (Aff st)
useRepointer path@(path' /\ _) loader = R.useMemo2 loader path' (\_ -> loader path')
useLoaderEffect :: forall st path. Eq path =>
path -> R.State (Maybe st)
-> (path -> Aff st) -> R.Hooks Unit
useLoaderEffect path state@(state' /\ setState) loader = do
oPath <- R.useRef path
R.useEffect' $ do
if (R.readRef oPath == path) && (isJust state') then
pure $ pure unit
else do
R.setRef oPath path
R2.affEffect "G.H.Loader.useLoaderEffect2" $ do
l <- loader path
liftEffect $ setState $ const $ Just l
module Gargantext.Hooks.Sigmax.Types where
import Prelude (map, ($))
import Prelude (map, ($), (&&), (==))
import Data.Map as Map
import Data.Sequence (Seq)
import Data.Set as Set
......@@ -35,3 +35,6 @@ nodesMap :: Graph Node Edge -> NodesMap
nodesMap graph = do
let (Graph {nodes}) = graph
Map.fromFoldable $ map (\n -> Tuple n.id n) nodes
eqGraph :: (Graph Node Edge) -> (Graph Node Edge) -> Boolean
eqGraph (Graph {nodes: n1, edges: e1}) (Graph {nodes: n2, edges: e2}) = (n1 == n2) && (e1 == e2)
module Gargantext.Utils.Reactix where
import Prelude
import Data.Maybe (Maybe(..))
import Data.Nullable (Nullable, null, toMaybe)
import Data.Tuple (Tuple)
import Data.Tuple.Nested ((/\))
import DOM.Simple as DOM
import DOM.Simple.Console (log, log2)
import DOM.Simple.Document (document)
import DOM.Simple.Event as DE
import DOM.Simple.Element as Element
import DOM.Simple.Event as DE
import DOM.Simple.Types (class IsNode)
import Data.Maybe (Maybe(..))
import Data.Nullable (Nullable, null, toMaybe)
import Data.Tuple (Tuple)
import Data.Tuple.Nested ((/\))
import Effect (Effect)
import Effect.Class (liftEffect)
import Effect.Aff (Aff, launchAff, launchAff_, killFiber)
import Effect.Class (liftEffect)
import Effect.Exception (error)
import Effect.Uncurried (EffectFn1, runEffectFn1, mkEffectFn1, mkEffectFn2)
import FFI.Simple ((...), defineProperty, delay, args2, args3)
......@@ -135,7 +136,7 @@ getElementById :: String -> Effect (Maybe DOM.Element)
getElementById = (flip delay) h
where
h id = pure $ toMaybe $ document ... "getElementById" $ [id]
-- We just assume it works, so make sure it's in the html
getPortalHost :: R.Hooks DOM.Element
getPortalHost = R.unsafeHooksEffect $ delay unit $ \_ -> pure $ document ... "getElementById" $ ["portal"]
......@@ -191,3 +192,19 @@ appendChildToParentId ps c = delay unit $ \_ -> do
effectLink :: Effect Unit -> String -> R.Element
effectLink eff msg = H.a {on: {click: const eff}} [H.text msg]
useCache :: forall i o. Eq i => i -> (i -> R.Hooks o) -> R.Hooks o
useCache i f = do
iRef <- R.useRef Nothing
oRef <- R.useRef Nothing
let currI = R.readRef iRef
let currO = R.readRef oRef
if currI == Just i then
case currO of
Nothing -> f i -- this one shouldn't happen, but purescript
Just v -> pure v
else do
new <- f i
R.unsafeHooksEffect (R.setRef iRef $ Just i)
R.unsafeHooksEffect (R.setRef oRef $ Just new)
pure new
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