>>> continue (store)

src/Gargantext/Components/App/Data.purs

@@ -6,7 +6,6 @@ import Gargantext.Prelude
 import Data.Maybe (Maybe(..))
 import Data.Set as Set
 import Gargantext.AsyncTasks as GAT
-import Gargantext.Components.GraphExplorer.Sidebar.Types as GEST
 import Gargantext.Components.Lang as Lang
 import Gargantext.Components.Nodes.Lists.Types as ListsT
 import Gargantext.Components.Nodes.Texts.Types as TextsT
@@ -36,7 +35,6 @@ type App =
   , showCorpus          :: Boolean
   , showLogin           :: Boolean
   , showTree            :: Boolean
-  , sidePanelGraph      :: Maybe (Record GEST.SidePanel)
   , sidePanelLists      :: Maybe (Record ListsT.SidePanel)
   , sidePanelTexts      :: Maybe (Record TextsT.SidePanel)
   , sidePanelState      :: SidePanelState
@@ -63,7 +61,6 @@ emptyApp =
   , showCorpus          : false
   , showLogin           : false
   , showTree            : true
-  , sidePanelGraph      : GEST.initialSidePanel
   , sidePanelLists      : ListsT.initialSidePanel
   , sidePanelTexts      : TextsT.initialSidePanel
   , sidePanelState      : InitialClosed
@@ -89,7 +86,6 @@ type Boxes =
   , showCorpus          :: T.Box Boolean
   , showLogin           :: T.Box Boolean
   , showTree            :: T.Box Boolean
-  , sidePanelGraph      :: T.Box (Maybe (Record GEST.SidePanel))
   , sidePanelLists      :: T.Box (Maybe (Record ListsT.SidePanel))
   , sidePanelTexts      :: T.Box (Maybe (Record TextsT.SidePanel))
   , sidePanelState      :: T.Box SidePanelState

src/Gargantext/Components/GraphExplorer/Sidebar/Types.purs

-module Gargantext.Components.GraphExplorer.Sidebar.Types where
-
-import Gargantext.Prelude
-
-import Data.Maybe (Maybe(..), maybe)
-import Data.Set as Set
-import Gargantext.Components.GraphExplorer.Types as GET
-import Gargantext.Hooks.Sigmax.Types as SigmaxT
-import Gargantext.Types as GT
-import Reactix as R
-import Toestand as T
-
-type SidePanel =
-  (
-    mGraph             :: Maybe SigmaxT.SGraph
-  , mMetaData          :: Maybe GET.MetaData
-  , multiSelectEnabled :: Boolean
-  , removedNodeIds     :: SigmaxT.NodeIds
-  , selectedNodeIds    :: SigmaxT.NodeIds
-  , showControls       :: Boolean
-  , sideTab            :: GET.SideTab
-  , showSidebar        :: GT.SidePanelState
-  , showDoc            :: Maybe GT.ListId
-  )
-
-initialSidePanel :: Maybe (Record SidePanel)
-initialSidePanel = Nothing
-
-
-focusedSidePanel :: T.Box (Maybe (Record SidePanel))
-                 -> R.Hooks { mGraph              :: T.Box (Maybe SigmaxT.SGraph)
-                            , mMetaData          :: T.Box (Maybe GET.MetaData)
-                            , multiSelectEnabled :: T.Box Boolean
-                            , removedNodeIds     :: T.Box SigmaxT.NodeIds
-                            , selectedNodeIds    :: T.Box SigmaxT.NodeIds
-                            , showControls       :: T.Box Boolean
-                            , sideTab            :: T.Box GET.SideTab
-                            , showSidebar        :: T.Box GT.SidePanelState
-                            , showDoc            :: T.Box (Maybe GT.ListId)
-                            }
-focusedSidePanel sidePanel = do
-  mGraph <- T.useFocused
-            (maybe Nothing _.mGraph)
-            (\val -> maybe Nothing (\sp -> Just $ sp { mGraph = val })) sidePanel
-  mMetaData <- T.useFocused
-            (maybe Nothing _.mMetaData)
-            (\val -> maybe Nothing (\sp -> Just $ sp { mMetaData = val })) sidePanel
-  multiSelectEnabled <- T.useFocused
-                        (maybe false _.multiSelectEnabled)
-                        (\val -> maybe Nothing (\sp -> Just $ sp { multiSelectEnabled = val })) sidePanel
-  removedNodeIds <- T.useFocused
-                     (maybe Set.empty _.removedNodeIds)
-                     (\val -> maybe Nothing (\sp -> Just $ sp { removedNodeIds = val })) sidePanel
-  selectedNodeIds <- T.useFocused
-                     (maybe Set.empty _.selectedNodeIds)
-                     (\val -> maybe Nothing (\sp -> Just $ sp { selectedNodeIds = val })) sidePanel
-  showControls <- T.useFocused
-                  (maybe false _.showControls)
-                  (\val -> maybe Nothing (\sp -> Just $ sp { showControls = val })) sidePanel
-  sideTab <- T.useFocused
-                  (maybe GET.SideTabLegend _.sideTab)
-                  (\val -> maybe Nothing (\sp -> Just $ sp { sideTab = val })) sidePanel
-  showSidebar <- T.useFocused
-                  (maybe GT.InitialClosed _.showSidebar)
-                  (\val -> maybe Nothing (\sp -> Just $ sp { showSidebar = val })) sidePanel
-  showDoc <- T.useFocused
-                (maybe Nothing _.showDoc)
-                (\val -> maybe Nothing (\sp -> Just $ sp { showDoc = val }
-                )) sidePanel
-
-  pure $ {
-    mGraph
-  , mMetaData
-  , multiSelectEnabled
-  , removedNodeIds
-  , selectedNodeIds
-  , showControls
-  , sideTab
-  , showSidebar
-  , showDoc
-  }

src/Gargantext/Components/GraphExplorer/Store.purs

+module Gargantext.Components.GraphExplorer.Store
+  ( Store
+  , State
+  , options
+  , context
+  , provide
+  ) where
+
+import Gargantext.Prelude
+
+import Data.Maybe (Maybe(..))
+import Data.Set as Set
+import Gargantext.Components.GraphExplorer.Types as GET
+import Gargantext.Hooks.Sigmax.Types as SigmaxT
+import Gargantext.Types as GT
+import Gargantext.Utils.Range as Range
+import Gargantext.Utils.Reactix as R2
+import Gargantext.Utils.Stores as Stores
+import Reactix as R
+import Toestand as T
+import Unsafe.Coerce (unsafeCoerce)
+
+here :: R2.Here
+here = R2.here "Gargantext.Components.GraphExplorer.Store"
+
+type Store =
+  -- Data
+  ( graph              :: T.Box SigmaxT.SGraph
+  , graphId            :: T.Box GET.GraphId
+  , mMetaData          :: T.Box (Maybe GET.MetaData)
+  , hyperdataGraph     :: T.Box GET.HyperdataGraph
+  -- Layout
+  , showControls       :: T.Box Boolean
+  , sideTab            :: T.Box GET.SideTab
+  , showSidebar        :: T.Box GT.SidePanelState
+  , showDoc            :: T.Box (Maybe GT.ListId)
+  -- Controls
+  , multiSelectEnabled :: T.Box Boolean
+  , edgeConfluence     :: T.Box Range.NumberRange
+  , edgeWeight         :: T.Box Range.NumberRange
+  , forceAtlasState    :: T.Box SigmaxT.ForceAtlasState
+  , graphStage         :: T.Box GET.Stage
+  , nodeSize           :: T.Box Range.NumberRange
+  , showEdges          :: T.Box SigmaxT.ShowEdgesState
+  , showLouvain        :: T.Box Boolean
+  , labelSize          :: T.Box Number
+  , mouseSelectorSize  :: T.Box Number
+  , startForceAtlas    :: T.Box Boolean
+  -- Terms update
+  , removedNodeIds     :: T.Box SigmaxT.NodeIds
+  , selectedNodeIds    :: T.Box SigmaxT.NodeIds
+  )
+
+type State =
+  -- Data
+  ( graph              :: SigmaxT.SGraph
+  , graphId            :: GET.GraphId
+  , mMetaData          :: Maybe GET.MetaData
+  , hyperdataGraph     :: GET.HyperdataGraph
+  -- Layout
+  , showControls       :: Boolean
+  , sideTab            :: GET.SideTab
+  , showSidebar        :: GT.SidePanelState
+  , showDoc            :: Maybe GT.ListId
+  -- Controls
+  , multiSelectEnabled :: Boolean
+  , edgeConfluence     :: Range.NumberRange
+  , edgeWeight         :: Range.NumberRange
+  , forceAtlasState    :: SigmaxT.ForceAtlasState
+  , graphStage         :: GET.Stage
+  , nodeSize           :: Range.NumberRange
+  , showEdges          :: SigmaxT.ShowEdgesState
+  , showLouvain        :: Boolean
+  , labelSize          :: Number
+  , mouseSelectorSize  :: Number
+  , startForceAtlas    :: Boolean
+  -- Terms update
+  , removedNodeIds     :: SigmaxT.NodeIds
+  , selectedNodeIds    :: SigmaxT.NodeIds
+  )
+
+options ::
+  { labelSize           :: Number
+  , mouseSelectorSize   :: Number
+  , multiSelectEnabled  :: Boolean
+  , removedNodeIds      :: SigmaxT.NodeIds
+  , selectedNodeIds     :: SigmaxT.NodeIds
+  , showControls        :: Boolean
+  , showDoc             :: Maybe GT.ListId
+  , showSidebar         :: GT.SidePanelState
+  , sideTab             :: GET.SideTab
+  , edgeConfluence      :: Range.NumberRange
+  , graphStage          :: GET.Stage
+  , nodeSize            :: Range.NumberRange
+  , showLouvain         :: Boolean
+  , showEdges           :: SigmaxT.ShowEdgesState
+  }
+options =
+  -- Layout
+  { showControls        : false
+  , sideTab             : GET.SideTabLegend
+  , showSidebar         : GT.InitialClosed
+  , showDoc             : Nothing
+  -- Controls
+  , multiSelectEnabled  : false
+  , labelSize           : 14.0
+  , mouseSelectorSize   : 15.0
+  , edgeConfluence      : Range.Closed { min: 0.0, max: 1.0 }
+  , graphStage          : GET.Init
+  , nodeSize            : Range.Closed { min: 0.0, max: 100.0 }
+  , showLouvain         : false
+  , showEdges           : SigmaxT.EShow
+  -- Terms update
+  , removedNodeIds      : Set.empty
+  , selectedNodeIds     : Set.empty
+  }
+
+context :: R.Context (Record Store)
+context = R.createContext $ unsafeCoerce unit
+
+provide :: Record State -> Array R.Element -> R.Element
+provide values = Stores.provideStore here.name values context

src/Gargantext/Components/GraphExplorer/Topbar/TopBar.purs

@@ -2,42 +2,38 @@ module Gargantext.Components.GraphExplorer.TopBar (topBar) where
 
 import Gargantext.Prelude hiding (max, min)
 
-import Data.Maybe (Maybe)
 import Gargantext.Components.Bootstrap as B
 import Gargantext.Components.Bootstrap.Types (ButtonVariant(..), Variant(..))
+import Gargantext.Components.GraphExplorer.Store as GraphStore
 import Gargantext.Components.GraphExplorer.Topbar.Search (nodeSearchControl)
-import Gargantext.Components.GraphExplorer.Sidebar.Types as GEST
 import Gargantext.Types as GT
 import Gargantext.Utils ((?))
 import Gargantext.Utils.Reactix as R2
+import Gargantext.Utils.Stores as Stores
 import Reactix as R
 import Reactix.DOM.HTML as H
 import Toestand as T
 
-type Props =
-  ( sidePanelGraph :: T.Box (Maybe (Record GEST.SidePanel))
-  )
-
 here :: R2.Here
 here = R2.here "Gargantext.Components.GraphExplorer.TopBar"
 
-topBar :: R2.Leaf Props
+topBar :: R2.Leaf ()
 topBar = R2.leaf component
 
-component :: R.Component Props
+component :: R.Component ()
 component = here.component "topBar" cpt where
-  cpt { sidePanelGraph } _ = do
+  cpt _ _ = do
     -- States
-    { mGraph
+    { graph
     , multiSelectEnabled
     , selectedNodeIds
     , showControls
     , showSidebar
-    } <- GEST.focusedSidePanel sidePanelGraph
+    } <- Stores.useStore GraphStore.context
 
-    mGraph'         <- R2.useLive' mGraph
-    showControls'   <- R2.useLive' showControls
-    showSidebar' <- R2.useLive' showSidebar
+    graph'              <- R2.useLive' graph
+    showControls'       <- R2.useLive' showControls
+    showSidebar'        <- R2.useLive' showSidebar
 
     -- Render
     pure $
@@ -73,12 +69,10 @@ component = here.component "topBar" cpt where
         ]
       ,
         -- Search
-        R2.fromMaybe_ mGraph' \graph ->
-
-          nodeSearchControl
-          { graph
-          , multiSelectEnabled
-          , selectedNodeIds
-          , className: "graph-topbar__search"
-          }
+        nodeSearchControl
+        { graph: graph'
+        , multiSelectEnabled
+        , selectedNodeIds
+        , className: "graph-topbar__search"
+        }
       ]

src/Gargantext/Components/GraphExplorer/Types.purs

 module Gargantext.Components.GraphExplorer.Types where
 
+import Gargantext.Prelude
+
 import Data.Array ((!!), length)
 import Data.Generic.Rep (class Generic)
 import Data.Eq.Generic (genericEq)
 import Data.Maybe (Maybe(..), fromJust)
 import Data.Newtype (class Newtype)
-import Data.Ord
 import Data.Ord.Generic (genericCompare)
 import Data.Symbol (SProxy(..))
 import Partial.Unsafe (unsafePartial)
 import Record as Record
 import Simple.JSON as JSON
 
-import Gargantext.Prelude
-
 type GraphId = Int
 
 newtype Node = Node {
@@ -164,7 +163,7 @@ instance Ord SelectedNode where compare = genericCompare
 
 instance Show SelectedNode where show (SelectedNode node) = node.label
 
-type State = (
+-- type State = (
   --  corpusId :: R.State Int
   --, filePath :: R.State String
   --, graphData :: R.State GraphData
@@ -177,7 +176,7 @@ type State = (
   --, sigmaGraphData :: R.State (Maybe SigmaxTypes.SGraph)
   --, sigmaSettings :: R.State ({|Graph.SigmaSettings})
     --treeId :: R.State (Maybe TreeId)
-  )
+  -- )
 
 initialGraphData :: GraphData
 initialGraphData = GraphData {
@@ -255,3 +254,7 @@ instance JSON.ReadForeign HyperdataGraph where
     pure $ HyperdataGraph $ Record.rename cameraP mCameraP inst
 instance JSON.WriteForeign HyperdataGraph where
   writeImpl (HyperdataGraph c) = JSON.writeImpl $ Record.rename mCameraP cameraP c
+
+data Stage = Init | Ready | Cleanup
+derive instance Generic Stage _
+derive instance Eq Stage

src/Gargantext/Components/Nodes/Graph.purs

@@ -5,21 +5,24 @@ module Gargantext.Components.Nodes.Corpus.Graph
 import Gargantext.Prelude
 
 import DOM.Simple (document, querySelector)
+import Data.Int as I
 import Data.Maybe (Maybe(..), isJust, maybe)
-import Data.Set as Set
+import Data.Sequence as Seq
 import Data.Tuple (Tuple(..))
 import Data.Tuple.Nested ((/\))
 import Gargantext.Components.App.Data (Boxes)
 import Gargantext.Components.Bootstrap as B
 import Gargantext.Components.GraphExplorer.Layout (convert, layout)
-import Gargantext.Components.GraphExplorer.Toolbar.Controls as Controls
+import Gargantext.Components.GraphExplorer.Store as GraphStore
 import Gargantext.Components.GraphExplorer.Types as GET
 import Gargantext.Config.REST (AffRESTError, logRESTError)
 import Gargantext.Hooks.Loader (useLoaderEffect)
+import Gargantext.Hooks.Sigmax as Sigmax
 import Gargantext.Hooks.Sigmax.Types as SigmaxT
 import Gargantext.Routes (SessionRoute(NodeAPI))
 import Gargantext.Sessions (Session, get)
 import Gargantext.Types as Types
+import Gargantext.Utils.Range as Range
 import Gargantext.Utils.Reactix as R2
 import Gargantext.Utils.Toestand as T2
 import Reactix as R
@@ -123,18 +126,18 @@ graphLayoutCpt = here.component "explorerLayout" cpt where
       handler loaded@(GET.HyperdataGraph { graph: hyperdataGraph }) =
         content { graph
                 , hyperdataGraph: loaded
-                , mMetaData'
+                , mMetaData
                 , session
                 , boxes: props.boxes
                 , graphId
                 }
         where
-          Tuple mMetaData' graph = convert hyperdataGraph
+          Tuple mMetaData graph = convert hyperdataGraph
 
 --------------------------------------------------------
 
 type ContentProps =
-  ( mMetaData'      :: Maybe GET.MetaData
+  ( mMetaData       :: Maybe GET.MetaData
   , graph           :: SigmaxT.SGraph
   , hyperdataGraph  :: GET.HyperdataGraph
   , session         :: Session
@@ -147,59 +150,63 @@ content = R2.leaf contentCpt
 
 contentCpt :: R.Component ContentProps
 contentCpt = here.component "content" cpt where
-  cpt props@{ boxes
-            , mMetaData'
-            , graph
-            , graphId
-            , session
-            , hyperdataGraph
-            } _ = do
-  -- | Computed
-  -- |
-    let
-      startForceAtlas = maybe true
-        (\(GET.MetaData { startForceAtlas: sfa }) -> sfa) mMetaData'
-
-      forceAtlasS = if startForceAtlas
-                    then SigmaxT.InitialRunning
-                    else SigmaxT.InitialStopped
-
-  -- | Hooks
-  -- |
-
-    -- Hydrate controls
-    controls <- Controls.useGraphControls
-      { forceAtlasS
+  cpt { boxes
+      , mMetaData
       , graph
       , graphId
-      , hyperdataGraph
-      , reloadForest: boxes.reloadForest
       , session
-      , sidePanel: boxes.sidePanelGraph
-      }
+      , hyperdataGraph
+      } _ = do
+    -- | Computed
+    -- |
+    let
+      startForceAtlas = maybe true
+        (\(GET.MetaData { startForceAtlas: sfa }) -> sfa) mMetaData
+
+      forceAtlasState
+        = if startForceAtlas
+          then SigmaxT.InitialRunning
+          else SigmaxT.InitialStopped
+
+      -- Hydrate GraphStore
+      state :: Record GraphStore.State
+      state =
+        -- Data
+        { graph
+        , graphId
+        , mMetaData
+        , hyperdataGraph
+        -- Controls
+        , startForceAtlas
+        , forceAtlasState
+        , edgeWeight:  Range.Closed
+            { min: 0.0
+            , max: I.toNumber $ Seq.length $ SigmaxT.graphEdges graph
+            }
+        -- (default options)
+        -- @WIP: testing order of Record.merge
+        } `Record.merge` GraphStore.options
 
-    -- Hydrate Boxes
-    R.useEffectOnce' $
-      flip T.write_ boxes.sidePanelGraph $ Just
-        { mGraph: Just graph
-        , mMetaData: mMetaData'
-        , multiSelectEnabled: false
-        , removedNodeIds: Set.empty
-        , selectedNodeIds: Set.empty
-        , showControls: false
-        , sideTab: GET.SideTabLegend
-        , showSidebar: Types.InitialClosed
-        , showDoc: Nothing
-        }
+    -- | Hooks
+    -- |
 
-  -- | Render
-  -- |
+    sigmaRef <- Sigmax.initSigma >>= R.useRef
+
+    -- | Render
+    -- |
 
     pure $
 
-      layout $
-      { controls
-      } `Record.merge` props
+      GraphStore.provide
+      state
+      [
+        layout
+        { session
+        , boxes
+        , sigmaRef
+        , graphId
+        }
+      ]
 
 --------------------------------------------------------------
 

src/Gargantext/Utils/Reactix.purs

@@ -91,6 +91,7 @@ type Module = String
 type Here =
   { component   :: forall p. String -> R.HooksComponent p -> R.Component p
   , ntComponent :: forall p. String -> NTHooksComponent p -> NTComponent p
+  , name        :: Module
   | RowConsole
   }
 
@@ -98,6 +99,7 @@ here :: Module -> Here
 here mod =
   { component   : R.hooksComponentWithModule mod
   , ntComponent : ntHooksComponentWithModule mod
+  , name        : mod
   , log         : Console.print   Console.Main mod Console.Log
   , log2        : Console.print2  Console.Main mod Console.Log
   , log3        : Console.print3  Console.Main mod Console.Log

src/Gargantext/Utils/Stores.purs

+module Gargantext.Utils.Stores
+  ( createStore
+  , provideStore
+  , useStore
+  ) where
+
+import Gargantext.Prelude
+
+import Prim.RowList (class RowToList)
+import Reactix as R
+import Toestand as T
+import Toestand.Records as TR
+
+-- StoreFactory: R.Hook (Record Store) → create focus boxes, hydrate box values
+-- StoreProvider: R.Hooks (Record Store) → provide context with previous boxes
+--    ↓
+-- StoreHook: R.Hooks (Record Store) → use context
+
+-- | From state values to focused boxes
+createStore :: forall boxes l state.
+     RowToList state l
+  => TR.UseFocusedFields l boxes () (T.Box (Record state))
+  => Record state
+  -> R.Hooks (Record boxes)
+createStore = T.useBox >=> flip T.useFocusedFields {}
+
+-- | Set <Store.Provider> bearing Stores as a Context
+-- |
+-- | (!) do not use store binds in this specific component (eg. `useStores`)
+provideStore :: forall boxes l state.
+     RowToList state l
+  => TR.UseFocusedFields l boxes () (T.Box (Record state))
+  => String
+  -> Record state
+  -> R.Context (Record boxes)
+  -> Array R.Element
+  -> R.Element
+provideStore name state context
+  = R.createElement (R.hooksComponent name cpt) {}
+    where
+      cpt _ children = do
+        store <- createStore state
+        pure $ R.provideContext context store $ children
+
+-- | (?) As we use "React Provide API", we just want to rely on its Global
+-- |     Reference (and not as Mutable State thanks to "Consumer API")
+-- |     Hence the "unsafeCoerce" used on every provided context, avoiding
+-- |     unwanted computing at each import
+-- |
+-- |     It also implies that every call to the proxy reference (made thanks to
+-- |     below <Store.Provider> are made AFTER first mount of this very,
+-- |     component, otherwise, every call will return the empty `unit`)
+useStore :: forall boxes.
+     R.Context (Record boxes)
+  -> R.Hooks (Record boxes)
+useStore = R.useContext