solidus_starter_frontend 0.1.0

data/app/views/spree/components/checkout/_payment_method_selector.html.erb

@@ -0,0 +1,14 @@
+<ul class="payment-method-selector">
+  <% methods.each do |method| %>
+    <li>
+      <%= render(
+        'spree/components/forms/inputs/radio_input',
+        checked: method == @order.available_payment_methods.first,
+        id: "order_payments_attributes__payment_method_id_#{method.id}",
+        label: t(method.name, scope: 'spree.payment_methods', default: method.name),
+        name: "order[payments_attributes][][payment_method_id]",
+        value: method.id
+      ) %>
+    </li>
+  <% end %>
+</ul>

data/app/views/spree/components/checkout/_proposed_shipment.erb

@@ -0,0 +1,18 @@
+<div class="proposed-shipment">
+  <h2 class="proposed-shipment__title">
+    <%= t('spree.package_from') %>
+    <%= ship_form.object.stock_location.name %>
+  </h2>
+
+  <%= render "spree/components/checkout/shipment_items", shipment_items: ship_form.object.manifest %>
+
+  <h3 class="proposed-shipment__secondary-title">
+    <%= t('spree.shipping_method') %>:
+  </h3>
+
+  <%= render(
+    "spree/components/checkout/shipping_methods",
+    form: ship_form,
+    shipping_rates: ship_form.object.shipping_rates
+  ) %>
+</div>

data/app/views/spree/components/checkout/_shipment_items.html.erb

@@ -0,0 +1,22 @@
+<ul class="shipment-items">
+  <% shipment_items.each do |shipment_item| %>
+    <li>
+      <div class="shipment-items__image">
+        <%= render(
+          'spree/shared/image',
+          image: shipment_item.variant.gallery.images.first || shipment_item.variant.product.gallery.images.first,
+          size: :small
+        ) %>
+      </div>
+      <div class="shipment-items__name">
+        <%= shipment_item.variant.name %>
+      </div>
+      <div class="shipment-items__quantity">
+        <%= shipment_item.quantity %>
+      </div>
+      <div class="shipment-items__price">
+        <%= display_price(shipment_item.variant) %>
+      </div>
+    </li>
+  <% end %>
+</ul>

data/app/views/spree/components/checkout/_shipping_methods.html.erb

@@ -0,0 +1,20 @@
+<%
+  def generate_id(form, input_name, rate)
+    "#{form.object_name.gsub(/[\[\]]/, '[' => '_', ']' => '_')}#{input_name}_#{rate.id}"
+  end
+%>
+
+<ul class="shipping-methods">
+  <% shipping_rates.each do |rate| %>
+    <li class="shipping-methods__rate">
+      <%= render(
+        'spree/components/forms/inputs/radio_input',
+        checked: rate.selected,
+        id: generate_id(form, "selected_shipping_rate_id", rate),
+        label: "#{rate.name} #{rate.display_cost}",
+        name: "#{form.object_name}[selected_shipping_rate_id]",
+        value: rate.id
+      ) %>
+    </li>
+  <% end %>
+</ul>

data/app/views/spree/components/checkout/_unshippable_items.html.erb

@@ -0,0 +1,7 @@
+<div class="unshippable-items">
+  <h3>
+    <%= t('spree.unshippable_items') %>
+  </h3>
+
+  <%= render "spree/components/products/variants_list", variants: items %>
+</div>

data/app/views/spree/components/checkout/steps/_address_step.html.erb

@@ -0,0 +1,60 @@
+<div class="address-step">
+  <fieldset class="address-step__billing" id="billing">
+    <legend>
+      <%= t("spree.billing_address") %>
+    </legend>
+
+    <%= form.fields_for :bill_address do |bill_form| %>
+      <%= render(
+        "spree/components/forms/address_inputs",
+        form: bill_form,
+        address_type: "billing",
+        address: @order.bill_address
+      ) %>
+    <% end %>
+  </fieldset>
+
+  <fieldset class="address-step__shipping" id="shipping">
+    <legend>
+      <%= t('spree.shipping_address') %>
+    </legend>
+
+    <%= form.fields_for :ship_address do |ship_form| %>
+      <%= render(
+        'spree/components/forms/inputs/checkbox_input',
+        checked: @order.shipping_eq_billing_address?,
+        id: :order_use_billing,
+        label: t('spree.use_billing_address'),
+        name: "order[use_billing]",
+        value: "1"
+      ) %>
+
+      <%= render(
+        "spree/components/forms/address_inputs",
+        form: ship_form,
+        address_type: "shipping",
+        address: @order.ship_address
+       ) %>
+    <% end %>
+  </fieldset>
+
+  <div class="address-step__actions">
+    <%= render(
+      "spree/components/buttons/button_primary",
+      content: I18n.t("spree.save_and_continue"),
+      name: :commit,
+      type: :submit
+    ) %>
+
+    <% if try_spree_current_user %>
+      <%= render(
+        "spree/components/forms/inputs/checkbox_input",
+        checked: try_spree_current_user.respond_to?(:persist_order_address),
+        id: "save-user-address",
+        label: I18n.t("spree.save_my_address"),
+        name: :save_user_address,
+        value: "1"
+      ) %>
+    <% end %>
+  </div>
+</div>

data/app/views/spree/components/checkout/steps/_confirm_step.html.erb

@@ -0,0 +1,31 @@
+<div class="confirm-step">
+  <fieldset class="confirm-step__info">
+    <legend>
+      <%= t('spree.confirm') %>
+    </legend>
+
+    <%= render 'spree/components/orders/order_details', order: @order %>
+  </fieldset>
+
+  <% SolidusStarterFrontend::Config[:require_terms_and_conditions_acceptance].tap do |requires_acceptance| %>
+    <% if requires_acceptance %>
+      <div class="terms_and_conditions">
+        <%= render partial: "spree/checkout/terms_and_conditions" %>
+        <%= check_box_tag :accept_terms_and_conditions, 'accepted', false %>
+        <%= label_tag :accept_terms_and_conditions, t('spree.agree_to_terms_of_service') %>
+      </div>
+    <% end %>
+
+    <%= render(
+      "spree/components/buttons/button_primary",
+      content: t('spree.place_order'),
+      disabled: requires_acceptance,
+      name: :commit,
+      type: :submit
+    ) %>
+  <% end %>
+</div>
+
+<script>
+  Solidus.disableSaveOnClick();
+</script>

data/app/views/spree/components/checkout/steps/_delivery_step.html.erb

@@ -0,0 +1,31 @@
+<div class="delivery-step">
+  <fieldset class="delivery-step__delivery">
+    <legend>
+      <%= t('spree.delivery') %>
+    </legend>
+
+    <%= form.fields_for :shipments do |ship_form| %>
+      <%= render 'spree/components/checkout/proposed_shipment', ship_form: ship_form %>
+    <% end %>
+
+    <% if @differentiator.try(:missing?) %>
+      <%= render "spree/components/checkout/unshippable_items", items: @differentiator.missing %>
+    <% end %>
+
+    <% if Spree::Config[:shipping_instructions] %>
+      <%= render(
+        'spree/components/forms/inputs/textarea_input',
+        id: :order_special_instructions,
+        label: t('spree.shipping_instructions'),
+        name: 'order[special_instructions]'
+      ) %>
+    <% end %>
+  </fieldset>
+
+  <%= render(
+    'spree/components/buttons/button_primary',
+    content: I18n.t('spree.save_and_continue'),
+    name: :commit,
+    type: :submit
+  ) %>
+</div>

data/app/views/spree/components/checkout/steps/_payment_step.html.erb

@@ -0,0 +1,25 @@
+<div class="payment-step">
+  <fieldset class="payment-step__payment">
+    <legend>
+      <%= t('spree.payment_information') %>
+    </legend>
+
+    <%= render 'spree/components/checkout/payment_method_selector', methods: @order.available_payment_methods %>
+    <%= render 'spree/components/checkout/payment_method_controls', methods: @order.available_payment_methods %>
+
+    <% if @wallet_payment_sources.present? %>
+      <%= render 'spree/components/checkout/existing_cards', wallet_payment_sources: @wallet_payment_sources %>
+    <% end %>
+  </fieldset>
+
+  <%= render(
+    'spree/components/buttons/button_primary',
+    content: I18n.t('spree.save_and_continue'),
+    name: :commit,
+    type: :submit
+  ) %>
+</div>
+
+<script>
+  Solidus.disableSaveOnClick();
+</script>

data/app/views/spree/components/forms/_address_inputs.html.erb

@@ -0,0 +1,152 @@
+<%
+  def generate_id(form, input_name)
+    "#{form.object_name.gsub(/[\[\]]/, '[' => '_', ']' => '_')}#{input_name}"
+  end
+%>
+
+<div class="address-inputs">
+  <%= render(
+    "spree/components/forms/inputs/text",
+    autocomplete: "#{address_type} given-name",
+    autofocus: true,
+    id: generate_id(form, "firstname"),
+    label: I18n.t("spree.first_name"),
+    name: "#{form.object_name}[firstname]",
+    required: true,
+    value: address.firstname
+  ) %>
+
+  <%= render(
+    "spree/components/forms/inputs/text",
+    autocomplete: "#{address_type} family-name",
+    id: generate_id(form, "lastname"),
+    label: I18n.t("spree.last_name"),
+    name: "#{form.object_name}[lastname]",
+    required: false,
+    value: address.lastname
+  ) %>
+
+  <% if Spree::Config[:company] %>
+    <%= render(
+      "spree/components/forms/inputs/text",
+      autocomplete: "#{address_type} organization",
+      id: :todo,
+      label: I18n.t("spree.company"),
+      name: "#{form.object_name}[company]",
+      value: address.company
+    ) %>
+  <% end %>
+
+  <%= render(
+    "spree/components/forms/inputs/text",
+    autocomplete: "#{address_type} address-line1",
+    id: generate_id(form, "address1"),
+    label: I18n.t("spree.street_address"),
+    name: "#{form.object_name}[address1]",
+    required: true,
+    value: address.address1
+  ) %>
+
+  <%= render(
+    "spree/components/forms/inputs/text",
+    autocomplete: "#{address_type} address-line2",
+    id: generate_id(form, "address2"),
+    label: I18n.t("spree.street_address_2"),
+    name: "#{form.object_name}[address2]",
+    value: address.address2
+  ) %>
+
+  <%= render(
+    "spree/components/forms/inputs/text",
+    autocomplete: "#{address_type} address-level2",
+    id: generate_id(form, "city"),
+    label: I18n.t("spree.city"),
+    name: "#{form.object_name}[city]",
+    required: true,
+    value: address.city
+  ) %>
+
+  <%= render(
+    "spree/components/forms/inputs/collection_select",
+    autocomplete: "#{address_type} country-name",
+    collection: available_countries,
+    form: form,
+    id: generate_id(form, "country_id"),
+    input_class: "js-trigger-state-change",
+    label: t("spree.country"),
+    method: :country_id,
+    required: true,
+    state_container: "##{address_type} .js-address-fields",
+    text_method: :name,
+    value_method: :id
+  ) %>
+
+  <% if Spree::Config[:address_requires_state] %>
+    <% have_states = !address.country.states.empty? %>
+
+    <span class="js-address-fields" style="display: none;">
+      <%= render(
+        "spree/components/forms/inputs/collection_select",
+        autocomplete: "#{address_type} address-level1",
+        collection: address.country.states,
+        disabled: !have_states,
+        form: form,
+        id: generate_id(form, "state_id"),
+        input_class: "required",
+        label: t("spree.state"),
+        method: :state_id,
+        options: { include_blank: true },
+        text_method: :name,
+        value_method: :id
+      ) %>
+      <%= form.text_field(
+        :state_name,
+        class: !have_states ? 'required' : '',
+        style: have_states ? 'display: none;' : '',
+        disabled: have_states,
+        autocomplete: "#{address_type} address-level1"
+      ) %>
+    </span>
+    <noscript>
+      <%= form.text_field(
+        :state_name,
+        class: 'required',
+        autocomplete: "#{address_type} address-level1",
+        required: true
+      ) %>
+    </noscript>
+  <% end %>
+
+  <%= render(
+    "spree/components/forms/inputs/text",
+    autocomplete: "#{address_type} postal-code",
+    id: generate_id(form, "zipcode"),
+    label: I18n.t("spree.zip"),
+    name: "#{form.object_name}[zipcode]",
+    required: address.require_zipcode?,
+    value: address.zipcode
+  ) %>
+
+  <%= render(
+    "spree/components/forms/inputs/text",
+    autocomplete: "#{address_type} home tel",
+    id: generate_id(form, "phone"),
+    label: I18n.t("spree.phone"),
+    name: "#{form.object_name}[phone]",
+    required: address.require_phone?,
+    type: :tel,
+    value: address.phone
+  ) %>
+
+  <% if Spree::Config[:alternative_shipping_phone] %>
+    <%= render(
+      "spree/components/forms/inputs/text",
+      autocomplete: "#{address_type} tel",
+      id: generate_id(form, "alternative_phone"),
+      label: I18n.t("spree.alternative_phone"),
+      name: "#{form.object_name}[alternative_phone]",
+      type: :tel,
+      value: address.alternative_phone
+    ) %>
+  <% end %>
+</div>

data/app/views/spree/components/forms/inputs/_checkbox_input.html.erb

@@ -0,0 +1,29 @@
+<%
+  base_class = "checkbox-input".freeze
+
+  # Optional props
+  checked = local_assigns.fetch(:checked, false)
+  disabled = local_assigns.fetch(:disabled, false)
+  id = local_assigns.fetch(:id, nil)
+  value = local_assigns.fetch(:value, nil)
+
+  # Classes
+  class_names = [base_class]
+  class_names = class_names.join(" ")
+%>
+
+<label
+  class="<%= class_names %>"
+  <% if id %>
+    for="<%= id %>"
+  <% end %>
+>
+  <%= check_box_tag(
+    name,
+    value,
+    checked,
+    disabled: disabled,
+    id: id
+  ) %>
+  <%= label %>
+</label>

data/app/views/spree/components/forms/inputs/_collection_select.html.erb

@@ -0,0 +1,42 @@
+<%
+  base_class = "select-input".freeze
+
+  # Optional props
+  autocomplete = local_assigns.fetch(:autocomplete, nil)
+  disabled = local_assigns.fetch(:disabled, false)
+  id = local_assigns.fetch(:id, nil)
+  input_class = local_assigns.fetch(:input_class, nil)
+  label = local_assigns.fetch(:label, false)
+  options = local_assigns.fetch(:options, {})
+  required = local_assigns.fetch(:required, false)
+  state_container = local_assigns.fetch(:state_container, nil)
+
+  # Classes
+  class_names = [base_class]
+  class_names = class_names.join(" ")
+%>
+
+<div class="<%= class_names %>">
+  <% if label %>
+    <label
+      <% if id %>
+        for="<%= id %>"
+      <% end %>
+    >
+      <%= label %>:
+    </label>
+  <% end %>
+
+  <%= form.collection_select(
+    method,
+    collection,
+    value_method,
+    text_method,
+    options,
+    autocomplete: autocomplete,
+    class: input_class,
+    disabled: disabled,
+    required: required,
+    "data-state-container": state_container
+  ) %>
+</div>