From b93fcabeb327c39151944925a2a32564e50f8610 Mon Sep 17 00:00:00 2001
From: arturo <alting@hotmail.fr>
Date: Fri, 8 Jul 2022 16:06:38 +0200
Subject: [PATCH] >>> BEGIN

---
 dist/styles/bootstrap-darkster.css            |  2 +-
 dist/styles/bootstrap-default.css             |  2 +-
 dist/styles/bootstrap-greyson.css             |  2 +-
 dist/styles/bootstrap-herbie.css              |  2 +-
 dist/styles/bootstrap-monotony.css            |  2 +-
 .../Components/NgramsTable/Search.purs        | 64 ++++++++++++++-----
 src/sass/_legacy/_list.sass                   |  2 +-
 7 files changed, 53 insertions(+), 23 deletions(-)

diff --git a/dist/styles/bootstrap-darkster.css b/dist/styles/bootstrap-darkster.css
index adbeb322..e6c39c94 100644
--- a/dist/styles/bootstrap-darkster.css
+++ b/dist/styles/bootstrap-darkster.css
@@ -8955,7 +8955,7 @@ select.form-control {
   margin-right: 8px;
 }
 
-.search-button-prepend .input-group-text {
+.ngrams-table-search-button .input-group-text {
   width: 41px;
   z-index: initial;
 }
diff --git a/dist/styles/bootstrap-default.css b/dist/styles/bootstrap-default.css
index 4e4723cd..edff2f61 100644
--- a/dist/styles/bootstrap-default.css
+++ b/dist/styles/bootstrap-default.css
@@ -8908,7 +8908,7 @@ select.form-control {
   margin-right: 8px;
 }
 
-.search-button-prepend .input-group-text {
+.ngrams-table-search-button .input-group-text {
   width: 41px;
   z-index: initial;
 }
diff --git a/dist/styles/bootstrap-greyson.css b/dist/styles/bootstrap-greyson.css
index 2c9078bd..6a658f94 100644
--- a/dist/styles/bootstrap-greyson.css
+++ b/dist/styles/bootstrap-greyson.css
@@ -8664,7 +8664,7 @@ select.form-control {
   margin-right: 8px;
 }
 
-.search-button-prepend .input-group-text {
+.ngrams-table-search-button .input-group-text {
   width: 41px;
   z-index: initial;
 }
diff --git a/dist/styles/bootstrap-herbie.css b/dist/styles/bootstrap-herbie.css
index fcc15e1d..1a7a79c9 100644
--- a/dist/styles/bootstrap-herbie.css
+++ b/dist/styles/bootstrap-herbie.css
@@ -8912,7 +8912,7 @@ select.form-control {
   margin-right: 8px;
 }
 
-.search-button-prepend .input-group-text {
+.ngrams-table-search-button .input-group-text {
   width: 41px;
   z-index: initial;
 }
diff --git a/dist/styles/bootstrap-monotony.css b/dist/styles/bootstrap-monotony.css
index 5882f49e..9dc4e621 100644
--- a/dist/styles/bootstrap-monotony.css
+++ b/dist/styles/bootstrap-monotony.css
@@ -8913,7 +8913,7 @@ select.form-control {
   margin-right: 8px;
 }
 
-.search-button-prepend .input-group-text {
+.ngrams-table-search-button .input-group-text {
   width: 41px;
   z-index: initial;
 }
diff --git a/src/Gargantext/Components/NgramsTable/Search.purs b/src/Gargantext/Components/NgramsTable/Search.purs
index 6ea9be91..159fd730 100644
--- a/src/Gargantext/Components/NgramsTable/Search.purs
+++ b/src/Gargantext/Components/NgramsTable/Search.purs
@@ -45,42 +45,73 @@ type SearchButtonProps =
 
 searchButton :: R2.Component SearchButtonProps
 searchButton = R.createElement searchButtonCpt
+
 searchButtonCpt :: R.Component SearchButtonProps
 searchButtonCpt = here.component "searchButton" cpt where
   cpt { inputRef, searchQuery } _ = do
+    -- | States
+    -- |
     searchQuery' <- T.useLive T.unequal searchQuery
 
+    -- | Behaviors
+    -- |
+    let
+      onReset _ = do
+        R2.setInputValue inputRef ""
+        T.write_ "" searchQuery
+
+      onSubmit _ = do
+        T.write_ (R2.getInputValue inputRef) searchQuery
+
+    -- | Render
+    -- |
     pure $
 
       H.div
-      { className: "search-button-append input-group-append" }
+      { className: intercalate " "
+          [ "ngrams-table-search-button"
+          , "input-group-append"
+          ]
+      }
       [
         if searchQuery' /= ""
         then
           R.fragment
-            [ B.button
+            [
+              B.button
               { variant: ButtonVariant Light
-              , callback: \_ -> do
-                                  R2.setInputValue inputRef ""
-                                  T.write_ "" searchQuery
-              , className: "input-group-text" }
-                [ B.icon
+              , callback: onReset
+              , className: "input-group-text"
+              }
+                [
+                  B.icon
                   { name: "times"
                   , className: "text-danger"
                   }
                 ]
-            , B.button { callback: \_ -> T.write_ (R2.getInputValue inputRef) searchQuery
-                       , className: "input-group-text" }
-                [ B.icon { name: "search" }
-                         
+            ,
+              B.button
+              { variant: ButtonVariant Light
+              , callback: onSubmit
+              , className: "input-group-text"
+              }
+                [ B.icon
+                  { name: "search"
+                  , className: "text-secondary"
+                  }
                 ]
             ]
         else
-          B.button { callback: \_ -> T.write_ (R2.getInputValue inputRef) searchQuery
-                   , className: "input-group-text" }
-            [ B.icon
-              { name: "search" }
-            ]
+          B.button
+          { variant: ButtonVariant Light
+          , callback: onSubmit
+          , className: "input-group-text"
+          }
+          [ B.icon
+            { name: "search"
+            , className: "text-secondary"
+            }
+          ]
       ]
 
 type SearchFieldInputProps =
@@ -109,4 +140,3 @@ searchFieldInputCpt = here.component "searchFieldInput" cpt where
             T.write_ (R2.getInputValue inputRef) searchQuery
           else
             pure unit
-
diff --git a/src/sass/_legacy/_list.sass b/src/sass/_legacy/_list.sass
index 04edfbc7..ff0f2054 100644
--- a/src/sass/_legacy/_list.sass
+++ b/src/sass/_legacy/_list.sass
@@ -52,7 +52,7 @@
 
 ///////////////////////////////////////////////////:
 
-.search-button-prepend
+.ngrams-table-search-button
 
   .input-group-text
     // @XXX Glyphicon icons lack of homogeneous width
-- 
2.21.0