From e487ed05320dfe65005556b1c2ac6518c5efe9f0 Mon Sep 17 00:00:00 2001 From: Gaetan Craig-Riou Date: Mon, 20 Mar 2023 15:55:55 +1100 Subject: [PATCH] Add link to remove voucher when a voucher has been applied Improve styling to match the design --- app/controllers/split_checkout_controller.rb | 10 +++++-- app/views/split_checkout/_payment.html.haml | 7 +++-- .../css/darkswarm/split-checkout.scss | 26 +++++++++++++++++++ config/locales/en.yml | 3 +++ config/routes.rb | 4 ++- spec/system/consumer/split_checkout_spec.rb | 20 +++++++++++++- 6 files changed, 64 insertions(+), 6 deletions(-) diff --git a/app/controllers/split_checkout_controller.rb b/app/controllers/split_checkout_controller.rb index 63bf2db6a8..10b3632740 100644 --- a/app/controllers/split_checkout_controller.rb +++ b/app/controllers/split_checkout_controller.rb @@ -22,7 +22,6 @@ class SplitCheckoutController < ::BaseController before_action :hide_ofn_navigation, only: [:edit, :update] def edit - # TODO Calculate percent amount covered by the voucher for display purposes @voucher_adjustment = @order.vouchers.first redirect_to_step_based_on_order unless params[:step] @@ -33,7 +32,7 @@ class SplitCheckoutController < ::BaseController end def update - return add_voucher if payment_step? and params[:order][:voucher_code] + return add_voucher if payment_step? && params[:order][:voucher_code] if confirm_order || update_order return if performed? @@ -51,6 +50,13 @@ class SplitCheckoutController < ::BaseController render cable_ready: cable_car.redirect_to(url: checkout_step_path(:payment)) end + def destroy + adjustment = Spree::Adjustment.find_by(id: params[:adjustment_id]) + adjustment.destroy + + redirect_to checkout_step_path(:payment) + end + private def render_error diff --git a/app/views/split_checkout/_payment.html.haml b/app/views/split_checkout/_payment.html.haml index aeeccaa6ba..df952e8895 100644 --- a/app/views/split_checkout/_payment.html.haml +++ b/app/views/split_checkout/_payment.html.haml @@ -4,10 +4,13 @@ .checkout-title = t("split_checkout.step2.voucher.apply_voucher") - .checkout-input.voucher + .checkout-input .two-columns-inputs.voucher -if @voucher_adjustment.present? - = "Voucher used: #{@voucher_adjustment.label}" + %span.button.voucher-added + %i.ofn-i_051-check-big + = "#{@voucher_adjustment.originator.display_value} #{t("split_checkout.step2.voucher.voucher")}" + = link_to t("split_checkout.step2.voucher.remove_code"), checkout_destroy_path(adjustment_id: @voucher_adjustment.id), method: "delete", data: { confirm: t("split_checkout.step2.voucher.confirm_delete") } - else = f.text_field :voucher_code, { placeholder: t("split_checkout.step2.voucher.placeholder"), class: "voucher" } - # TODO: enable button when code entered diff --git a/app/webpacker/css/darkswarm/split-checkout.scss b/app/webpacker/css/darkswarm/split-checkout.scss index 259a9bbfa4..49807dc610 100644 --- a/app/webpacker/css/darkswarm/split-checkout.scss +++ b/app/webpacker/css/darkswarm/split-checkout.scss @@ -406,19 +406,45 @@ &.voucher { justify-content: normal; + align-items: center; input { width: 50%; } + a { + color: inherit; + } + .button { &.cancel { width: 30%; border-radius: 0.5em; padding:0; + height: 2.5em; + background-color: $teal-400 } } } + + .voucher-added { + padding: 10px; + background-color: $teal-300; + color: $teal-500; + margin: 0; + cursor: default; + + i.ofn-i_051-check-big:before { + background-color: $teal-500; + color: $teal-300; + border-radius: 50%; + font-style: normal; + } + + i.ofn-i_051-check-big { + font-style: italic; + } + } > .checkout-input { flex: 1; diff --git a/config/locales/en.yml b/config/locales/en.yml index bfdab857d2..40a5c5c043 100644 --- a/config/locales/en.yml +++ b/config/locales/en.yml @@ -2056,9 +2056,12 @@ en: submit: Next - Order summary cancel: Back to Your details voucher: + voucher: Voucher apply_voucher: Apply voucher apply: Apply placeholder: Enter voucher code + remove_code: Remove code + confirm_delete: Are you sure you want to remove the voucher ? step3: delivery_details: title: Delivery details diff --git a/config/routes.rb b/config/routes.rb index 04a800bfd5..364c0425ed 100644 --- a/config/routes.rb +++ b/config/routes.rb @@ -74,7 +74,7 @@ Openfoodnetwork::Application.routes.draw do match "/checkout", via: :get, controller: "payment_gateways/stripe", action: "confirm" match "/orders/:order_number", via: :get, controller: "payment_gateways/stripe", action: "authorize" end - + namespace :payment_gateways do get "/paypal", to: "paypal#express", as: :paypal_express get "/paypal/confirm", to: "paypal#confirm", as: :confirm_paypal @@ -92,6 +92,8 @@ Openfoodnetwork::Application.routes.draw do put '/checkout/:step', to: 'split_checkout#update', as: :checkout_update end + delete '/checkout/payment', to: 'split_checkout#destroy', as: :checkout_destroy + # Redirects to the new checkout for any other 'step' (ie. /checkout/cart from the legacy checkout) get '/checkout/:other', to: redirect('/checkout') end diff --git a/spec/system/consumer/split_checkout_spec.rb b/spec/system/consumer/split_checkout_spec.rb index 9fd3f90568..f1b353aee9 100644 --- a/spec/system/consumer/split_checkout_spec.rb +++ b/spec/system/consumer/split_checkout_spec.rb @@ -744,7 +744,25 @@ describe "As a consumer, I want to checkout my order" do fill_in "Enter voucher code", with: voucher.code click_button("Apply") - expect(page).to have_content("Voucher used: some_code") + expect(page).to have_content("$10.00 Voucher") + end + end + + describe "removing voucher from order" do + before do + voucher.create_adjustment(voucher.code, order) + # Reload the page so we pickup the voucher + visit checkout_step_path(:payment) + end + + it "removes voucher" do + accept_confirm "Are you sure you want to remove the voucher ?" do + click_on "Remove code" + end + + within '.voucher' do + expect(page).to have_button("Apply") + end end end end