Add link to remove voucher when a voucher has been applied

Improve styling to match the design

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

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

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;

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

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

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