Rename SuperSelector to SelectorWithFilter

app/components/products_table_component.rb

@@ -70,12 +70,12 @@ class ProductsTableComponent < ViewComponentReflex::Component
 
   def toggle_category
     category_clicked = element.dataset['value']
-    @categories_selected = toggle_super_selector(category_clicked, @categories_selected)
+    @categories_selected = toggle_selector_with_filter(category_clicked, @categories_selected)
   end
 
   def toggle_producer
     producer_clicked = element.dataset['value']
-    @producers_selected = toggle_super_selector(producer_clicked, @producers_selected)
+    @producers_selected = toggle_selector_with_filter(producer_clicked, @producers_selected)
   end
 
   def change_page
@@ -93,7 +93,7 @@ class ProductsTableComponent < ViewComponentReflex::Component
     @columns.unshift(ALL_COLUMN)
   end
 
-  def toggle_super_selector(clicked, selected)
+  def toggle_selector_with_filter(clicked, selected)
     selected = if selected.include?(clicked)
                  selected - [clicked]
                else

app/components/products_table_component/products_table_component.html.haml

@@ -3,9 +3,9 @@
     .products-table-form_filter_results
       = render(SearchInputComponent.new(value: @search_term, data: reflex_data_attributes(:search_term)))
     .products-table-form_categories_selector
-      = render(SuperSelectorComponent.new(title: t("admin.products_page.filters.categories.title"), selected: @categories_selected, items: @categories, data: reflex_data_attributes(:toggle_category), selected_items_i18n_key: "admin.products_page.filters.categories.selected_categories"))
+      = render(SelectorWithFilterComponent.new(title: t("admin.products_page.filters.categories.title"), selected: @categories_selected, items: @categories, data: reflex_data_attributes(:toggle_category), selected_items_i18n_key: "admin.products_page.filters.categories.selected_categories"))
     .products-table-form_producers_selector
-      = render(SuperSelectorComponent.new(title: t("admin.products_page.filters.producers.title"), selected: @producers_selected, items: @producers, data: reflex_data_attributes(:toggle_producer), selected_items_i18n_key: "admin.products_page.filters.producers.selected_producers"))
+      = render(SelectorWithFilterComponent.new(title: t("admin.products_page.filters.producers.title"), selected: @producers_selected, items: @producers, data: reflex_data_attributes(:toggle_producer), selected_items_i18n_key: "admin.products_page.filters.producers.selected_producers"))
     .products-table-form_per-page_selector
       = render(SelectorComponent.new(title: t('admin.products_page.filters.per_page', count: @per_page_selected[0]), selected: @per_page_selected, items: @per_page, data: reflex_data_attributes(:toggle_per_page)))
     .products-table-form_columns_selector

app/components/selector_with_filter_component.rb

@@ -1,8 +1,8 @@
 # frozen_string_literal: true
 
-class SuperSelectorComponent < SelectorComponent
+class SelectorWithFilterComponent < SelectorComponent
   def initialize(title:, selected:, items:, data: {},
-                 selected_items_i18n_key: 'components.super_selector.selected_items')
+                 selected_items_i18n_key: 'components.selector_with_filter.selected_items')
     super(title: title, selected: selected, items: items, data: data)
     @query = ""
     @selected_items = items.select { |item| @selected.include?(item[:value]) }

app/components/selector_with_filter_component/selector_with_filter_component.html.haml

@@ -15,7 +15,7 @@
       .selector-arrow{data: reflex_data_attributes(:toggle)}
     .selector-wrapper
       .super-selector-search
-        %input{type: "text", placeholder: t("components.super_selector.search_placeholder"), data: reflex_data_attributes("debounced:input->search"), value: @query}
+        %input{type: "text", placeholder: t("components.selector_with_filter.search_placeholder"), data: reflex_data_attributes("debounced:input->search"), value: @query}
       .selector-items
         - @filtered_items.each do |item|
           .selector-item{ class: ("selected" if item[:selected]), data: @data, "data-value": item[:value] }

app/webpacker/controllers/selector_with_filter_controller.js

@@ -1,5 +1,5 @@
 import SelectorController from "./selector_controller";
 
 export default class extends SelectorController {
-  reflex = "SuperSelectorComponent";
+  reflex = "SelectorWithFilterComponent";
 }

app/webpacker/css/admin/all.scss

@@ -123,7 +123,7 @@
 @import "app/components/product_component/product_component";
 @import "app/components/selector_component/selector_component";
 @import "app/components/products_table_component/products_table_component";
-@import "app/components/super_selector_component/super_selector_component";
+@import "app/components/selector_with_filter_component/selector_with_filter_component";
 @import "app/components/pagination_component/pagination_component";
 @import "app/components/table_header_component/table_header_component";
 @import "app/components/search_input_component/search_input_component";

config/locales/en.yml

@@ -458,7 +458,7 @@ en:
   components:
     search_input:
       placeholder: Search
-    super_selector:
+    selector_with_filter:
       selected_items: "%{count} selected"
       search_placeholder: Search
 # Admin