<%= page do %>
  <%= page_header do %>
    <%= page_header_back(solidus_admin.products_path) %>
    <%= page_header_title(@product.name) do %>
      <%= render component("products/status").from_product(@product) %>
    <% end %>
    <%= page_header_actions do %>
      <%= render component("ui/button").new(
        tag: :a,
        text: t(".duplicate"),
        href: spree.clone_admin_product_path(@product),
        scheme: :ghost
      ) %>

      <%= render component("ui/button").new(
        tag: :a,
        text: t(".view"),
        href: SolidusAdmin::Config.storefront_product_path(@product),
        target: :_blank,
        scheme: :ghost
      ) %>
      <%= render component("ui/button").new(tag: :button, text: t(".save"), form: form_id) %>
    <% end %>
  <% end %>

  <%= form_for @product, url: solidus_admin.product_path(@product), html: { id: form_id } do |f| %>
    <%= page_with_sidebar do %>
      <%= page_with_sidebar_main do %>
        <%= render component('ui/panel').new do %>
          <%= render component("ui/forms/field").text_field(f, :name) %>
          <%= render component("ui/forms/field").text_field(f, :slug) %>
          <%= render component("ui/forms/field").text_area(f, :description) %>
        <% end %>

        <%= render component('ui/panel').new(title: 'SEO') do %>
          <%= render component("ui/forms/field").text_field(f, :meta_title) %>
          <%= render component("ui/forms/field").text_field(f, :meta_description) %>
          <%= render component("ui/forms/field").text_area(f, :meta_keywords) %>
        <% end %>

        <%= render component('ui/panel').new(title: "Media") do |panel| %>
          <% panel.with_action(
            name: t(".manage_images"),
            href: spree.admin_product_images_path(@product)
          ) %>
        <% end %>

        <%= render component('ui/panel').new(title: 'Pricing') do %>
          <%= render component("ui/forms/field").text_field(f, :price) %>
          <div class="flex gap-4 justify-items-stretch">
            <%= render component("ui/forms/field").text_field(f, :cost_price) %>
            <%= render component("ui/forms/field").text_field(f, :cost_currency) %>
          </div>
        <% end %>

        <%= render component('ui/panel').new(title: 'Stock') do |panel| %>
          <%= render component("ui/forms/field").text_field(f, :sku) %>

          <% panel.with_action(
            name: t(".manage_stock"),
            href: spree.admin_product_stock_path(@product)
          ) %>
        <% end %>

        <%= render component('ui/panel').new(title: 'Shipping') do %>
          <%= render component("ui/forms/field").select(
            f,
            :shipping_category_id,
            [[t(".none"), nil]] + Spree::ShippingCategory.order(:name).pluck(:name, :id),
            tip: t(".hints.shipping_category_html"),
          ) %>
          <%= render component("ui/forms/field").select(
            f,
            :tax_category_id,
            [[t(".none"), nil]] + Spree::TaxCategory.order(:name).pluck(:name, :id),
            tip: t(
              ".hints.tax_category_html",
              default_tax_category: Spree::TaxCategory.default&.name
            ),
          ) %>
        <% end %>

        <%= render component('ui/panel').new(title: "Options") do %>
          <%= render component("ui/forms/field").select(
            f,
            :option_type_ids,
            option_type_options,
            multiple: true,
            "size" => option_type_options.size,
          ) %>
        <% end %>

        <%= render component('ui/panel').new(title: "Specifications") do |panel| %>
          <% panel.with_action(
            name: t(".manage_properties"),
            href: spree.admin_product_product_properties_path(@product)
          ) %>
        <% end %>
      <% end %>

      <%= 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,
            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]",
              checked: f.object.promotionable
            ) %>
            <span class="font-normal text-xs"><%= Spree::Product.human_attribute_name :promotionable %></span>
            <%= render component("ui/toggletip").new(text: t(".hints.promotionable_html")) %>
          </label>
        <% end %>

        <%= render component('ui/panel').new(title: "Product organization") do %>
          <%= render component("ui/forms/field").select(
            f,
            :taxon_ids,
            taxon_options,
            multiple: true,
            "size" => taxon_options.size, # use a string key to avoid setting the size of the component
          ) %>
        <% end %>
      <% end %>
    <% end %>
  <% end %>

  <%= page_footer do %>
    <%= page_footer_actions do %>
      <%= form_for @product, url: solidus_admin.product_path(@product), method: :delete do %>
        <%= render component("ui/button").new(
          tag: :button,
          text: t(".delete"),
          scheme: :danger,
          "data-action": "click->#{stimulus_id}#confirmDelete",
          "data-#{stimulus_id}-message-param": t(".delete_confirmation"),
        ) %>
      <% end %>
    <% end %>
    <%= render component("ui/button").new(tag: :button, text: t(".save"), form: form_id) %>
  <% end %>
<% end %>
