Use select component in payment search line

2 files changed, 16 insertions, 5 deletions

diff --git a/client/src/Component/Select.hs b/client/src/Component/Select.hs
index 01ed37a..cf62f26 100644
--- a/client/src/Component/Select.hs
+++ b/client/src/Component/Select.hs
@@ -27,7 +27,8 @@ data (Reflex t) => SelectIn t a b c = SelectIn
   }
 
 data SelectOut t a = SelectOut
-  { _selectOut_value :: Dynamic t (Validation Text a)
+  { _selectOut_raw   :: Dynamic t a
+  , _selectOut_value :: Dynamic t (Validation Text a)
   }
 
 select :: forall t m a b c. (Ord a, MonadWidget t m) => SelectIn t a b c -> m (SelectOut t a)
@@ -77,5 +78,6 @@ select selectIn = do
       return value
 
   return SelectOut
-    { _selectOut_value = validatedValue
+    { _selectOut_raw = value
+    , _selectOut_value = validatedValue
     }
diff --git a/client/src/View/Payment/Header.hs b/client/src/View/Payment/Header.hs
index 73517f0..7a85493 100644
--- a/client/src/View/Payment/Header.hs
+++ b/client/src/View/Payment/Header.hs
@@ -28,7 +28,8 @@ import qualified Common.View.Format     as Format
 
 import           Component              (ButtonIn (..), ButtonOut (..),
                                          InputIn (..), InputOut (..),
-                                         ModalIn (..), ModalOut (..))
+                                         ModalIn (..), ModalOut (..),
+                                         SelectIn (..), SelectOut (..))
 import qualified Component              as Component
 import qualified Util.List              as L
 import           View.Payment.Add       (AddIn (..), AddOut (..))
@@ -140,8 +141,16 @@ searchLine reset = do
           , (Monthly, Msg.get Msg.Payment_MonthlyMale)
           ]
 
-    searchFrequency <- R._dropdown_value <$>
-      R.dropdown Punctual (R.constDyn frequencies) R.def
+    searchFrequency <- _selectOut_raw <$> (Component.select $
+      SelectIn
+        { _selectIn_label        = ""
+        , _selectIn_initialValue = Punctual
+        , _selectIn_value        = R.never
+        , _selectIn_values       = R.constDyn frequencies
+        , _selectIn_reset        = R.never
+        , _selectIn_isValid      = const True
+        , _selectIn_validate     = R.never
+        })
 
     return (searchName, searchFrequency)