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]> (cherry picked from commit 1fdb686)
solidusio · May 3, 2024 · 3f07371 · 3f07371
1 parent 1cd33c2
commit 3f07371
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