[layout] Description node block hide feature

* #447

src/Gargantext/Components/App/App.purs

@@ -2,24 +2,90 @@ module Gargantext.Components.App (app) where
 
 import Gargantext.Prelude
 
+import Data.Tuple.Nested ((/\))
 import Gargantext.AsyncTasks as GAT
 import Gargantext.Components.App.Store as AppStore
 import Gargantext.Components.Router (router)
 import Gargantext.Hooks (useHashRouter)
+import Gargantext.Hooks.FirstEffect (useFirstEffect')
 import Gargantext.Router as Router
 import Gargantext.Sessions as Sessions
+import Gargantext.Types (CacheParams, defaultCacheParams)
+import Gargantext.Utils (getter)
 import Gargantext.Utils.Reactix as R2
 import Reactix as R
+import Record as Record
 import Toestand as T
 
 here :: R2.Here
 here = R2.here "Gargantext.Components.App"
 
-app :: R2.Component ()
-app = R.createElement appCpt
+
+app :: R2.Leaf ()
+app = R2.leaf appCpt
 
 appCpt :: R.Component ()
-appCpt = here.component "app" cpt where
+appCpt = here.component "container" cpt where
+  cpt _ _ = do
+    -- | States
+    -- |
+
+    cache' /\ cache <- R2.useBox' (defaultCacheParams :: CacheParams)
+
+    -- | Hooks
+    -- |
+
+    -- load Local Storage cache (if exists)
+    useFirstEffect' $
+      R2.loadLocalStorageState R2.appParamsKey cache
+
+    -- | Render
+    -- |
+    pure $
+
+      hydrateStore
+      { cacheParams: cache'
+      }
+
+--------------------------------------------------------------
+
+type HydrateStoreProps =
+  ( cacheParams :: CacheParams
+  )
+
+hydrateStore :: R2.Leaf HydrateStoreProps
+hydrateStore = R2.leaf hydrateStoreCpt
+
+hydrateStoreCpt :: R.Component HydrateStoreProps
+hydrateStoreCpt = here.component "hydrateStore" cpt where
+  cpt { cacheParams
+      } _ = do
+    -- | Computed
+    -- |
+    (state :: Record AppStore.State) <- pure $
+      -- (cache options)
+      { expandTableEdition: getter _.expandTableEdition cacheParams
+      -- (default options)
+      } `Record.merge` AppStore.options
+
+    -- | Render
+    -- |
+    pure $
+
+      AppStore.provide
+      state
+      [
+        mainApp
+        {}
+      ]
+
+--------------------------------------------------------------
+
+mainApp :: R2.Leaf ()
+mainApp = R2.leaf mainAppCpt
+
+mainAppCpt :: R.Component ()
+mainAppCpt = here.component "main" cpt where
   cpt _ _ = do
     boxes <- AppStore.use
     -- tasks   <- T.useBox Nothing             -- storage for asynchronous tasks reductor

src/Gargantext/Components/App/Store.purs

@@ -38,6 +38,7 @@ here = R2.here "Gargantext.Components.App.Store"
 type Store =
   ( backend             :: T.Box (Maybe Backend)
   , errors              :: T.Box (Array FrontendError)
+  , expandTableEdition  :: T.Box Boolean
   , forestOpen          :: T.Box OpenNodes
   , graphVersion        :: T2.ReloadS
   , handed              :: T.Box Handed
@@ -63,6 +64,7 @@ type Store =
 type State =
   ( backend             :: Maybe Backend
   , errors              :: Array FrontendError
+  , expandTableEdition  :: Boolean
   , forestOpen          :: OpenNodes
   , graphVersion        :: T2.Reload
   , handed              :: Handed
@@ -89,6 +91,7 @@ options :: Record State
 options =
   { backend             : Nothing
   , errors              : []
+  , expandTableEdition  : false
   , forestOpen          : OpenNodes $ Set.empty
   , graphVersion        : T2.newReload
   , handed              : RightHanded

src/Gargantext/Components/Nodes/Annuaire/User/Contact.purs

@@ -137,7 +137,7 @@ contactFormCpt = here.component "form" cpt where
                 }
               ]
             ]
-          , 
+          ,
             H.div
             { className: "form-group" }
             [
@@ -177,7 +177,7 @@ contactFormCpt = here.component "form" cpt where
                 }
               ]
             ]
-          , 
+          ,
             H.div
             { className: "form-group" }
             [
@@ -321,7 +321,7 @@ contactFormCpt = here.component "form" cpt where
         ]
       ,
         B.wad
-        [ "align-self-start", "ml-3" ]
+        [ "align-self-flex-start", "ml-3" ]
         [
           B.caveat
           {}

src/Gargantext/Components/Renameable.purs

@@ -170,8 +170,8 @@ editingCpt = here.component "editing" cpt where
         T.write_ false isEditing
         onRename text
 
-      onReset _ = do
-        T.write_ false isEditing
+      -- onReset _ = do
+      --   T.write_ false isEditing
 
     -- | Render
     -- |

src/Gargantext/Types.purs

@@ -814,3 +814,24 @@ data FrontendError =
 
 derive instance Generic FrontendError _
 instance Eq FrontendError where eq = genericEq
+
+-----------------------------------------------------------------------
+
+newtype CacheParams = CacheParams
+  { expandTableEdition    :: Boolean
+  }
+
+derive instance Newtype CacheParams _
+derive instance Generic CacheParams _
+derive instance Eq CacheParams
+instance Show CacheParams where show = genericShow
+derive newtype instance JSON.ReadForeign CacheParams
+derive newtype instance JSON.WriteForeign CacheParams
+
+-- (!) in case cache storage (ie. JavaScript Local Storage) returns an invalid
+--     objects (eg. possible data migration), this will safely set new default
+--     values
+defaultCacheParams :: CacheParams
+defaultCacheParams = CacheParams
+  { expandTableEdition    : false
+  }

src/Gargantext/Utils/Reactix.purs

@@ -397,6 +397,9 @@ getls = window >>= localStorage
 openNodesKey :: LocalStorageKey
 openNodesKey = "garg-open-nodes"
 
+appParamsKey :: LocalStorageKey
+appParamsKey = "garg-app-params"
+
 graphParamsKey :: LocalStorageKey
 graphParamsKey = "garg-graph-params"
 

src/Main.purs

@@ -6,8 +6,7 @@ import Data.Maybe (Maybe(..))
 import Data.Nullable (toMaybe)
 import Effect (Effect)
 import FFI.Simple ((...))
-import Gargantext.Components.App (app)
-import Gargantext.Components.App.Store as AppStore
+import Gargantext.Components.App as App
 import Gargantext.Utils.Reactix as R2
 import Prelude (Unit, ($))
 
@@ -19,12 +18,6 @@ main = paint $ toMaybe (document ... "getElementById" $ [ "app" ])
 
 paint :: Maybe Element -> Effect Unit
 paint Nothing  = here.error "[main] Container not found"
-paint (Just c) = R2.render app' c
+paint (Just c) = R2.render app c
   where
-    state = AppStore.options
-    app' =
-      AppStore.provide
-      state
-      [
-        app {} []
-      ]
+    app = App.app {}

src/sass/_legacy/_list.sass

@@ -160,18 +160,18 @@
     margin-left: 13px
 
 ////////////////////////////////////////////////////////
-$renameable-icon-margin: space-x(0.5)
-$renameable-button-margin: space-x(2)
-// @XXX Glyphicon icons lack of homogeneous width
-$renameable-icon-width: 16px
 
 .table-header-rename
   margin-bottom: space-x(1)
 
-  &__header
+  &__title
     display: flex
     align-items: center
 
+    &__text
+      font-size: $h3-font-size
+      font-family: $headings-font-family
+
     &__line
       // (?) This is a peculiar line directly coming from the legacy style
       //     It originaly was a solid 2px black one, that added to much
@@ -188,33 +188,31 @@ $renameable-icon-width: 16px
       height: 0
       flex-grow: 1
       margin-left: space-x(4)
+      margin-right: space-x(4)
 
   &__cache-toolbar
     width: $topbar-fixed-button-width
     margin-left: $topbar-item-margin
     margin-right: $topbar-item-margin
 
-  &__calendar
 
-    &__icon
-      margin-right: $renameable-icon-margin
-      width: $renameable-icon-width
+.table-header-rename-edition
+  margin-top: space-x(1)
+  padding: $card-spacer-y $card-spacer-y
 
-  .renameable-wrapper--emphase
-    .renameable-container__text
-      font-size: $h3-font-size
-      font-family: $headings-font-family
+  .form-group
+    display: flex
+    align-items: baseline
+    margin-bottom: space-x(0.75)
 
-.renameable-container
-  display: flex
-  align-items: baseline
-  margin-bottom: space-x(0.75)
+    // remove "bootstrap" not-needed-here rule
+    flex-wrap: initial
 
-  &__icon
-    margin-right: $renameable-icon-margin
+  .form-group__label .b-icon
+    // @XXX Glyphicon icons lack of homogeneous width
+    $icon-width: 16px
+
+    margin-right: space-x(1)
+    width: $icon-width
     font-size: 14px
-    width: $renameable-icon-width
     text-align: center
-
-  &__button
-    margin-left: $renameable-button-margin

src/sass/base/_bootstrap.scss

@@ -4,3 +4,8 @@
 .table {
   border-collapse: collapse;
 }
+
+// remove side-effect's z-index
+.input-group-prepend .btn, .input-group-append .btn {
+  z-index: initial;
+}

src/sass/components/_grouped.scss

@@ -13,6 +13,13 @@
     letter-spacing: space-x(1);
     font-weight: 700;
   }
+
+  // remove "bootstrap" focus ring for this state
+  &--idled:active,
+  &--idled:focus {
+    border-color: $input-border-color;
+    box-shadow: unset;
+  }
 }
 
 /// Modal