Provide formatted date values to field component

This change fixes an issue where certain browsers (namely Firefox) will not render the date field correctly when it contains the full date and time format as the value. This change just truncates the available_on and discontinue_on values to match the precision expected, rather switch to the datetime-local input which is not fully supported in all browsers, but also maintains the old admin behaviour. Co-authored-by: Andrew Stewart <[email protected]>
solidusio · Apr 29, 2024 · 69504bd · 69504bd
1 parent 58e23eb
commit 69504bd
Show file tree

Hide file tree

Showing 2 changed files with 20 additions and 3 deletions.
diff --git a/admin/app/components/solidus_admin/products/show/component.html.erb b/admin/app/components/solidus_admin/products/show/component.html.erb
@@ -100,9 +100,20 @@
 
       <%= page_with_sidebar_aside do %>
         <%= render component('ui/panel').new(title: "Publishing") do %>
-          <%= render component("ui/forms/field").text_field(f, :available_on, hint: t(".available_on_html"), type: :date) %>
-          <%= render component("ui/forms/field").text_field(f, :discontinue_on, hint: t(".discontinue_on_html"), type: :date) %>
-
+          <%= render component("ui/forms/field").text_field(
+            f,
+            :available_on,
+            hint: t(".available_on_html"),
+            type: :date,
+            value: f.object.available_on&.to_date
+          ) %>
+          <%= render component("ui/forms/field").text_field(
+            f,
+            :discontinue_on,
+            hint: t(".discontinue_on_html"),
+            type: :date,
+            value: f.object.discontinue_on&.to_date
+          ) %>
           <label class="flex gap-2 items-center">
             <%= render component("ui/forms/checkbox").new(
               name: "#{f.object_name}[promotionable]",

diff --git a/admin/spec/components/solidus_admin/ui/forms/input/component_spec.rb b/admin/spec/components/solidus_admin/ui/forms/input/component_spec.rb
@@ -34,5 +34,11 @@
 
       expect(page).to have_css("input[type='number'][name='name'][value='value']")
     end
+
+    it "renders a date input" do
+      render_inline(described_class.new(type: :date, name: "name", value: "2020-01-01"))
+
+      expect(page).to have_css("input[type='date'][name='name'][value='2020-01-01']")
+    end
   end
 end