From 27c1fe2f06c2e47eb814a1a7ca6f215d55f33fc2 Mon Sep 17 00:00:00 2001
From: Jean-Baptiste Bellet <jb.bellet@gmail.com>
Date: Thu, 24 Mar 2022 10:30:13 +0100
Subject: [PATCH] Add search query input to search for product by name

---
 app/components/products_table_component.rb                 | 7 +++++++
 .../products_table_component.html.haml                     | 5 +----
 2 files changed, 8 insertions(+), 4 deletions(-)

diff --git a/app/components/products_table_component.rb b/app/components/products_table_component.rb
index 599aab0bae..840dae0b66 100644
--- a/app/components/products_table_component.rb
+++ b/app/components/products_table_component.rb
@@ -37,6 +37,7 @@ class ProductsTableComponent < ViewComponentReflex::Component
     @producers_selected = ["all"]
     @page = 1
     @sort = { column: "name", direction: "asc" }
+    @search_term = ""
   end
 
   def before_render
@@ -44,6 +45,10 @@ class ProductsTableComponent < ViewComponentReflex::Component
     refresh_columns
   end
 
+  def search_term
+    @search_term = element.dataset['value']
+  end
+
   def toggle_column
     column = element.dataset['value']
     @columns_selected = if @columns_selected.include?(column)
@@ -128,6 +133,8 @@ class ProductsTableComponent < ViewComponentReflex::Component
               query.merge({ supplier_id_in: @producers_selected })
             end
 
+    query = query.merge({ name_cont: @search_term }) if @search_term.present?
+
     if @categories_selected.include?("all")
       query.merge({ primary_taxon_id_eq: "" })
     else
diff --git a/app/components/products_table_component/products_table_component.html.haml b/app/components/products_table_component/products_table_component.html.haml
index 14709e16e9..7976b1d94b 100644
--- a/app/components/products_table_component/products_table_component.html.haml
+++ b/app/components/products_table_component/products_table_component.html.haml
@@ -1,10 +1,7 @@
 = component_controller do
   #products_page_form
     #filter_results
-      %input.search{type: 'text', placeholder: 'Search', id: 'search_query'}
-      %button.btn.btn-primary{type: 'submit'}
-        Filter results
-
+      = render(SearchInputComponent.new(value: @search_term, data: reflex_data_attributes(:search_term)))
     #categories_selector
       = render(SuperSelectorComponent.new(title: "Categories", selected: @categories_selected, items: @categories, data: reflex_data_attributes(:toggle_category)))
     #producers_selector