From fd651dccf2c1d68c52f03be31ec23abe4bad3e88 Mon Sep 17 00:00:00 2001
From: Elia Schito <elia@schito.me>
Date: Mon, 18 Sep 2023 12:25:28 +0200
Subject: [PATCH] Reimplement text_field, selext, and text_area with the input
 component

---
 .../ui/forms/select/component.rb              | 42 ++++++---------
 .../ui/forms/text_area/component.rb           | 37 +++++--------
 .../ui/forms/text_field/component.rb          | 54 +++++--------------
 3 files changed, 42 insertions(+), 91 deletions(-)

diff --git a/admin/app/components/solidus_admin/ui/forms/select/component.rb b/admin/app/components/solidus_admin/ui/forms/select/component.rb
index 83bc1753977..193934fbbc7 100644
--- a/admin/app/components/solidus_admin/ui/forms/select/component.rb
+++ b/admin/app/components/solidus_admin/ui/forms/select/component.rb
@@ -25,7 +25,7 @@ def initialize(
     errors: nil,
     tip: nil,
     options: {},
-    attributes: {}
+    **attributes
   )
     @field = field
     @builder = builder
@@ -33,39 +33,29 @@ def initialize(
     @choices = choices
     @hint = hint
     @tip = tip
-    @options = options
+    @options = options.presence and raise ArgumentError, "options are deprecated"
     @attributes = HashWithIndifferentAccess.new(attributes)
-    @errors = errors || @builder.object&.errors
+    @errors = (errors || @builder.object&.errors).messages_for(@field).presence
   end
 
   def call
-    @attributes[:class] = [
-      %w[
-        block px-3 py-1.5 w-full
-        appearance-none
-        text-black
-        bg-white border border-gray-300 rounded-sm
-        hover:border-gray-500
-        focus:border-gray-500 focus:shadow-[0_0_0_2px_#bbb] focus-visible:outline-none
-        disabled:bg-gray-50 disabled:text-gray-300
-      ],
-      SIZES.fetch(@size)[:select],
-      @attributes[:class],
-    ].compact.join(" ")
-
     render component("ui/forms/field").new(
       label: @builder.object.class.human_attribute_name(@field),
       hint: @hint,
       tip: @tip,
-      error: helpers.safe_join(@errors.messages_for(@field), tag.br).presence,
+      error: (helpers.safe_join(@errors, tag.br).presence if @errors),
       **@attributes
-    ).with_content(@builder.select(
-      @field,
-      @choices,
-      @options,
-      "data-#{stimulus_id}-target" => "select",
-      "data-action" => "#{stimulus_id}#refreshSelectClass",
-      **@attributes,
-    ))
+    ).with_content(
+      render(
+        component('ui/forms/input').new(
+          tag: :select,
+          value: @builder.object.public_send(@field),
+          error: (@errors.to_sentence.capitalize if @errors),
+          **@attributes,
+        ).with_content(
+          helpers.options_for_select(@choices, @builder.object.public_send(@field))
+        )
+      )
+    )
   end
 end
diff --git a/admin/app/components/solidus_admin/ui/forms/text_area/component.rb b/admin/app/components/solidus_admin/ui/forms/text_area/component.rb
index 7f749614084..63136805593 100644
--- a/admin/app/components/solidus_admin/ui/forms/text_area/component.rb
+++ b/admin/app/components/solidus_admin/ui/forms/text_area/component.rb
@@ -1,12 +1,6 @@
 # frozen_string_literal: true
 
 class SolidusAdmin::UI::Forms::TextArea::Component < SolidusAdmin::BaseComponent
-  SIZES = {
-    s: %w[h-20 body-small],
-    m: %w[h-28 body-small],
-    l: %w[h-36 body-text]
-  }.freeze
-
   def initialize(
     field:,
     builder:,
@@ -22,31 +16,26 @@ def initialize(
     @hint = hint
     @tip = tip
     @attributes = HashWithIndifferentAccess.new(attributes)
-    @errors = errors || @builder.object&.errors
+    @errors = (errors || @builder.object&.errors).messages_for(@field).presence
   end
 
   def call
-    @attributes[:class] = [
-      %w[
-        block px-3 py-4 w-full
-        text-black
-        bg-white border border-gray-300 rounded-sm
-        hover:border-gray-500
-        placeholder:text-gray-400
-        focus:border-gray-500 focus:shadow-[0_0_0_2px_#bbb] focus-visible:outline-none
-        disabled:bg-gray-50 disabled:text-gray-300
-      ],
-      SIZES.fetch(@size),
-      (%w[border-red-400 text-red-400] if @errors.present?),
-      @attributes[:class],
-    ].compact.join(" ")
-
     render component("ui/forms/field").new(
       label: @builder.object.class.human_attribute_name(@field),
       hint: @hint,
       tip: @tip,
-      error: helpers.safe_join(@errors.messages_for(@field), tag.br).presence,
+      error: (helpers.safe_join(@errors, tag.br).presence if @errors),
       **@attributes
-    ).with_content(@builder.text_area(@field, **@attributes))
+    ).with_content(
+      render(
+        component('ui/forms/input').new(
+          size: @size,
+          tag: :textarea,
+          value: @builder.object.public_send(@field),
+          error: (@errors.to_sentence.capitalize if @errors),
+          **@attributes,
+        )
+      )
+    )
   end
 end
diff --git a/admin/app/components/solidus_admin/ui/forms/text_field/component.rb b/admin/app/components/solidus_admin/ui/forms/text_field/component.rb
index a36aa4584f8..0e2c9dc5877 100644
--- a/admin/app/components/solidus_admin/ui/forms/text_field/component.rb
+++ b/admin/app/components/solidus_admin/ui/forms/text_field/component.rb
@@ -7,23 +7,6 @@ class SolidusAdmin::UI::Forms::TextField::Component < SolidusAdmin::BaseComponen
     l: %w[leading-9 body-text]
   }.freeze
 
-  TYPES = {
-    color: :color_field,
-    date: :date_field,
-    datetime: :datetime_field,
-    email: :email_field,
-    month: :month_field,
-    number: :number_field,
-    password: :password_field,
-    phone: :phone_field,
-    range: :range_field,
-    search: :search_field,
-    text: :text_field,
-    time: :time_field,
-    url: :url_field,
-    week: :week_field
-  }.freeze
-
   def initialize(
     field:,
     builder:,
@@ -42,36 +25,25 @@ def initialize(
     @type = type
     @tip = tip
     @attributes = HashWithIndifferentAccess.new(attributes)
-    @errors = errors || @builder.object&.errors
+    @errors = (errors || @builder.object&.errors).messages_for(@field).presence
   end
 
   def call
-    @attributes[:class] = [
-      %w[
-        form-input
-        block px-3 py-1.5 w-full
-        text-black
-        bg-white border border-gray-300 rounded-sm
-        hover:border-gray-500
-        placeholder:text-gray-400
-        focus:border-gray-500 focus:shadow-[0_0_0_2px_#bbb] focus-visible:outline-none
-        disabled:bg-gray-50 disabled:text-gray-300
-      ],
-      SIZES.fetch(@size),
-      (%w[border-red-400 text-red-400] if @errors.present?),
-      @attributes[:class],
-    ].compact.join(" ")
-
     render component("ui/forms/field").new(
       label: @builder.object.class.human_attribute_name(@field),
       hint: @hint,
       tip: @tip,
-      error: helpers.safe_join(@errors.messages_for(@field), tag.br).presence,
-      **@attributes
-    ).with_content(@builder.send(
-      TYPES.fetch(@type),
-      @field,
-      @attributes,
-    ))
+      error: (helpers.safe_join(@errors, tag.br).presence if @errors),
+    ).with_content(
+      render(
+        component('ui/forms/input').new(
+          size: @size,
+          type: @type,
+          value: @builder.object.public_send(@field),
+          error: (@errors.to_sentence.capitalize if @errors),
+          **@attributes,
+        )
+      )
+    )
   end
 end