[ngramsTable] more refactoring

src/Gargantext/Components/NgramsTable.purs

@@ -36,8 +36,10 @@ import Effect.Class (liftEffect)
 import Gargantext.Components.App.Store (Boxes)
 import Gargantext.Components.Bootstrap as B
 import Gargantext.Components.Bootstrap.Types (ButtonVariant(..), Variant(..))
-import Gargantext.Components.NgramsTable.Components as NTC
 import Gargantext.Components.NgramsTable.Core (addNewNgramA, applyNgramsPatches, chartsAfterSync, commitPatch, convOrderBy, coreDispatch, filterTermSize, ngramsRepoElementToNgramsElement, normNgram, patchSetFromMap, setTermListA, singletonNgramsTablePatch, toVersioned)
+import Gargantext.Components.NgramsTable.Search as NTS
+import Gargantext.Components.NgramsTable.SelectionCheckbox as NTSC
+import Gargantext.Components.NgramsTable.Tree as NTT
 import Gargantext.Components.NgramsTable.Loader (useLoaderWithCacheAPI)
 import Gargantext.Components.NgramsTable.SyncResetButton (syncResetButtons)
 import Gargantext.Components.Nodes.Lists.Types as NT
@@ -282,7 +284,7 @@ loadedNgramsTableHeaderCpt = here.component "loadedNgramsTableHeader" cpt where
       [ H.h4 { style: { textAlign : "center" } }
         [ H.span { className: "fa fa-hand-o-down" } []
         , H.text "Extracted Terms" ]
-      , NTC.searchInput { key: "search-input"
+      , NTS.searchInput { key: "search-input"
                         , searchQuery }
       ]
 
@@ -356,7 +358,7 @@ loadedNgramsTableBodyCpt = here.component "loadedNgramsTableBody" cpt where
         filteredConvertedRows = convertRow <$> filteredRows
 
         convertRow ngramsElement =
-          { row: NTC.renderNgramsItem { dispatch: performAction
+          { row: NTT.renderNgramsItem { dispatch: performAction
                                       , getNgramsChildren
                                       , ngrams: ngramsElement ^. _NgramsElement <<< _ngrams
                                       , ngramsElement
@@ -451,7 +453,7 @@ ngramsTableOrderWith orderBy =
     _              -> identity -- the server ordering is enough here
 
 -- This is used to *decorate* the Select header with the checkbox.
-wrapColElts scProps _         (TT.ColumnName "Select") = const [NTC.selectionCheckbox scProps]
+wrapColElts scProps _         (TT.ColumnName "Select") = const [NTSC.selectionCheckbox scProps]
 wrapColElts _       scoreType (TT.ColumnName "Score")  = (_ <> [H.text ("(" <> show scoreType <> ")")])
 wrapColElts _       _         _                        = identity
 
@@ -550,7 +552,7 @@ displayRow { ngramsElement: NgramsElement {ngrams, root, list}
     -- ^ and which satisfies the chosen term size
     || ngramsChildrenDiff ^. at ngrams == Just false
     -- ^ unless they are scheduled to be removed.
-    || NTC.tablePatchHasNgrams ngramsLocalPatch ngrams
+    || NTT.tablePatchHasNgrams ngramsLocalPatch ngrams
     -- ^ unless they are being processed at the moment.
 
 allNgramsSelectedOnFirstPage :: Set NgramsTerm -> PreConversionRows -> Boolean
@@ -687,7 +689,7 @@ ngramsTreeEditRealCpt = here.component "ngramsTreeEditReal" cpt where
     pure $ H.div {}
       [ H.p {}
         [ H.text $ "Editing " <> ngramsTermText ngramsDepth.ngrams ]
-      , NTC.renderNgramsTree { getNgramsChildren: gnc
+      , NTT.renderNgramsTree { getNgramsChildren: gnc
                              , ngramsClick
                              , ngramsDepth
                              , ngramsEdit

src/Gargantext/Components/NgramsTable/Search.purs

+module Gargantext.Components.NgramsTable.Search where
+
+import Data.Nullable (Nullable, null)
+import DOM.Simple as DOM
+import Gargantext.Prelude
+import Gargantext.Utils.Reactix as R2
+import Reactix as R
+import Reactix.DOM.HTML as H
+import Toestand as T
+
+here :: R2.Here
+here = R2.here "Gargantext.Components.NgramsTable.Search"
+
+
+type SearchInputProps =
+  ( searchQuery :: T.Box String
+  )
+
+-- "key": to prevent refreshing & losing input
+searchInput :: R2.Leaf ( key :: String | SearchInputProps )
+searchInput = R2.leafComponent searchInputCpt
+searchInputCpt :: R.Component ( key :: String | SearchInputProps )
+searchInputCpt = here.component "searchInput" cpt
+  where
+    cpt { searchQuery } _ = do
+      inputRef <- R.useRef null
+      
+      pure $ R2.row
+        [ H.div { className: "col-12" }
+          [ H.div { className: "input-group" }
+            [ searchButton { inputRef, searchQuery } []
+            , searchFieldInput { inputRef, searchQuery } []
+            ]
+          ]
+        ]
+
+type SearchButtonProps =
+  ( inputRef    :: R.Ref (Nullable DOM.Element)
+  , searchQuery :: T.Box String
+  )
+
+searchButton :: R2.Component SearchButtonProps
+searchButton = R.createElement searchButtonCpt
+searchButtonCpt :: R.Component SearchButtonProps
+searchButtonCpt = here.component "searchButton" cpt where
+  cpt { inputRef, searchQuery } _ = do
+    searchQuery' <- T.useLive T.unequal searchQuery
+
+    pure $ H.div { className: "input-group-prepend" }
+      [ if searchQuery' /= ""
+        then
+          H.button { className: "btn btn-danger"
+                   , on: { click: \_ -> R2.setInputValue inputRef "" } }
+                            -- T.write "" searchQuery } }
+          [ H.span {className: "fa fa-times"} []]
+        else H.span { className: "fa fa-search input-group-text" } []
+      ]
+
+type SearchFieldInputProps =
+  ( inputRef    :: R.Ref (Nullable DOM.Element)
+  , searchQuery :: T.Box String
+  )
+
+searchFieldInput :: R2.Component SearchFieldInputProps
+searchFieldInput = R.createElement searchFieldInputCpt
+searchFieldInputCpt :: R.Component SearchFieldInputProps
+searchFieldInputCpt = here.component "searchFieldInput" cpt where
+  cpt { inputRef, searchQuery } _ = do
+    -- searchQuery' <- T.useLive T.unequal searchQuery
+    
+    pure $ H.input { className: "form-control"
+                   -- , defaultValue: searchQuery'
+                   , name: "search"
+                   , on: { input: \e -> T.write (R.unsafeEventValue e) searchQuery }
+                   , placeholder: "Search"
+                   , ref: inputRef
+                   , type: "value"
+                   }

src/Gargantext/Components/NgramsTable/SelectionCheckbox.purs

+module Gargantext.Components.NgramsTable.SelectionCheckbox where
+
+import Data.Maybe (Maybe(..))
+import Data.Nullable (null, toMaybe)
+import Data.Set (Set)
+import Data.Set as Set
+import FFI.Simple (delay)
+import Gargantext.Core.NgramsTable.Types (Action(..), Dispatch, NgramsTerm)
+import Gargantext.Prelude
+import Gargantext.Utils.Reactix as R2
+import Reactix as R
+import Reactix.DOM.HTML as H
+
+here :: R2.Here
+here = R2.here "Gargantext.Components.NgramsTable.SelectionCheckbox"
+
+
+type SelectionCheckboxProps =
+  ( allNgramsSelected :: Boolean
+  , dispatch          :: Dispatch
+  , ngramsSelection   :: Set NgramsTerm
+  )
+
+selectionCheckbox :: Record SelectionCheckboxProps -> R.Element
+selectionCheckbox props = R.createElement selectionCheckboxCpt props []
+selectionCheckboxCpt :: R.Component SelectionCheckboxProps
+selectionCheckboxCpt = here.component "selectionCheckbox" cpt
+  where
+    cpt { allNgramsSelected, dispatch, ngramsSelection } _ = do
+      ref <- R.useRef null
+
+      R.useEffect' $ delay unit $ \_ -> do
+        let mCb = toMaybe $ R.readRef ref
+        case mCb of
+          Nothing -> pure unit
+          Just cb -> do
+            _ <- if allNgramsSelected || (Set.isEmpty ngramsSelection) then
+              R2.setIndeterminateCheckbox cb false
+            else
+              R2.setIndeterminateCheckbox cb true
+            pure unit
+
+      pure $ H.input { checked: allNgramsSelected
+                     , className: "checkbox"
+                     , on: { change: const $ dispatch $ ToggleSelectAll }
+                     , ref
+                     , type: "checkbox" }

src/Gargantext/Components/NgramsTable/Components.purs → src/Gargantext/Components/NgramsTable/Tree.purs

-module Gargantext.Components.NgramsTable.Components where
+module Gargantext.Components.NgramsTable.Tree where
 
 import Data.Array as A
 import Data.Either (Either(..))
@@ -18,9 +18,8 @@ import DOM.Simple as DOM
 import Effect (Effect)
 import Effect.Aff (Aff, launchAff_)
 import Effect.Class (liftEffect)
-import FFI.Simple (delay)
 import Gargantext.Components.NgramsTable.Core (applyNgramsPatches, setTermListA)
-import Gargantext.Core.NgramsTable.Types (Action(..), Dispatch, NgramsClick, NgramsDepth, NgramsElement, NgramsTable, NgramsTablePatch(..), NgramsTerm, _NgramsElement, _NgramsRepoElement, _PatchMap, _children, _list, _ngrams, _occurrences, ngramsTermText, replace)
+import Gargantext.Core.NgramsTable.Types (Action(..), NgramsClick, NgramsDepth, NgramsElement, NgramsTable, NgramsTablePatch(..), NgramsTerm, _NgramsElement, _NgramsRepoElement, _PatchMap, _children, _list, _ngrams, _occurrences, ngramsTermText, replace)
 import Gargantext.Components.Table as Tbl
 import Gargantext.Config.REST (logRESTError)
 import Gargantext.Hooks.Loader (useLoader)
@@ -36,103 +35,7 @@ import Toestand as T
 import Type.Proxy (Proxy(..))
 
 here :: R2.Here
-here = R2.here "Gargantext.Components.NgramsTable.Components"
-
-type SearchInputProps =
-  ( searchQuery :: T.Box String
-  )
-
--- "key": to prevent refreshing & losing input
-searchInput :: R2.Leaf ( key :: String | SearchInputProps )
-searchInput = R2.leafComponent searchInputCpt
-searchInputCpt :: R.Component ( key :: String | SearchInputProps )
-searchInputCpt = here.component "searchInput" cpt
-  where
-    cpt { searchQuery } _ = do
-      inputRef <- R.useRef null
-      
-      pure $ R2.row
-        [ H.div { className: "col-12" }
-          [ H.div { className: "input-group" }
-            [ searchButton { inputRef, searchQuery } []
-            , searchFieldInput { inputRef, searchQuery } []
-            ]
-          ]
-        ]
-
-type SearchButtonProps =
-  ( inputRef    :: R.Ref (Nullable DOM.Element)
-  , searchQuery :: T.Box String
-  )
-
-searchButton :: R2.Component SearchButtonProps
-searchButton = R.createElement searchButtonCpt
-searchButtonCpt :: R.Component SearchButtonProps
-searchButtonCpt = here.component "searchButton" cpt where
-  cpt { inputRef, searchQuery } _ = do
-    searchQuery' <- T.useLive T.unequal searchQuery
-
-    pure $ H.div { className: "input-group-prepend" }
-      [ if searchQuery' /= ""
-        then
-          H.button { className: "btn btn-danger"
-                   , on: { click: \_ -> R2.setInputValue inputRef "" } }
-                            -- T.write "" searchQuery } }
-          [ H.span {className: "fa fa-times"} []]
-        else H.span { className: "fa fa-search input-group-text" } []
-      ]
-
-type SearchFieldInputProps =
-  ( inputRef    :: R.Ref (Nullable DOM.Element)
-  , searchQuery :: T.Box String
-  )
-
-searchFieldInput :: R2.Component SearchFieldInputProps
-searchFieldInput = R.createElement searchFieldInputCpt
-searchFieldInputCpt :: R.Component SearchFieldInputProps
-searchFieldInputCpt = here.component "searchFieldInput" cpt where
-  cpt { inputRef, searchQuery } _ = do
-    -- searchQuery' <- T.useLive T.unequal searchQuery
-    
-    pure $ H.input { className: "form-control"
-                   -- , defaultValue: searchQuery'
-                   , name: "search"
-                   , on: { input: \e -> T.write (R.unsafeEventValue e) searchQuery }
-                   , placeholder: "Search"
-                   , ref: inputRef
-                   , type: "value"
-                   }
-
-type SelectionCheckboxProps =
-  ( allNgramsSelected :: Boolean
-  , dispatch          :: Dispatch
-  , ngramsSelection   :: Set NgramsTerm
-  )
-
-selectionCheckbox :: Record SelectionCheckboxProps -> R.Element
-selectionCheckbox props = R.createElement selectionCheckboxCpt props []
-selectionCheckboxCpt :: R.Component SelectionCheckboxProps
-selectionCheckboxCpt = here.component "selectionCheckbox" cpt
-  where
-    cpt { allNgramsSelected, dispatch, ngramsSelection } _ = do
-      ref <- R.useRef null
-
-      R.useEffect' $ delay unit $ \_ -> do
-        let mCb = toMaybe $ R.readRef ref
-        case mCb of
-          Nothing -> pure unit
-          Just cb -> do
-            _ <- if allNgramsSelected || (Set.isEmpty ngramsSelection) then
-              R2.setIndeterminateCheckbox cb false
-            else
-              R2.setIndeterminateCheckbox cb true
-            pure unit
-
-      pure $ H.input { checked: allNgramsSelected
-                     , className: "checkbox"
-                     , on: { change: const $ dispatch $ ToggleSelectAll }
-                     , ref
-                     , type: "checkbox" }
+here = R2.here "Gargantext.Components.NgramsTable.Tree"
 
 
 type RenderNgramsTree =