Add voucher input on checkout payment's step

Voucher input is displayed  only if the distributor has any voucher

app/views/split_checkout/_payment.html.haml

@@ -1,5 +1,15 @@
 .medium-6
   %div.checkout-substep{"data-controller": "paymentmethod"}
+    - if @order.distributor.vouchers.present?
+      .checkout-title
+        = t("split_checkout.step2.voucher.apply_voucher")
+
+      .checkout-input.voucher
+        .two-columns-inputs.voucher
+          = f.text_field :voucher_code, { placeholder: t("split_checkout.step2.voucher.placeholder"), class: "voucher" }
+          - # TODO: enable button when code entered
+          = f.submit t("split_checkout.step2.voucher.apply"), class: "button cancel voucher", disabled: true 
+        
     %div.checkout-title
       = t("split_checkout.step2.payment_method.title")
 

app/webpacker/css/darkswarm/split-checkout.scss

@@ -404,6 +404,22 @@
   gap: 1rem;
   justify-content: space-between;
 
+  &.voucher {
+    justify-content: normal;
+
+    input {
+      width: 50%;
+    }
+
+    .button {
+      &.cancel {
+        width: 30%;
+        border-radius: 0.5em;
+        padding:0;
+      }
+    }
+  }
+
   > .checkout-input {
     flex: 1;
   }
@@ -418,6 +434,11 @@
     &:last-child > .checkout-input {
       margin-bottom: 1.5rem;
     }
+
+    &.voucher {
+      flex-direction: row;
+      gap: 1rem;
+    }
   }
 }
 

config/locales/en.yml

@@ -2055,6 +2055,10 @@ en:
       explaination: You can review and confirm your order in the next step which includes the final costs.
       submit: Next - Order summary
       cancel: Back to Your details
+      voucher:
+        apply_voucher: Apply voucher 
+        apply: Apply 
+        placeholder: Enter voucher code
     step3:
       delivery_details:
         title: Delivery details

spec/system/consumer/split_checkout_spec.rb

@@ -708,6 +708,30 @@ describe "As a consumer, I want to checkout my order" do
         end
       end
 
+      describe "vouchers" do
+        context "with no voucher available" do
+          before do
+            visit checkout_step_path(:payment)
+          end
+
+          it "doesn't show voucher input" do
+            expect(page).not_to have_content "Apply voucher"
+          end
+        end
+
+        context "with voucher available" do
+          let!(:voucher) { Voucher.create(code: 'some_code', enterprise: distributor) }
+
+          before do
+            visit checkout_step_path(:payment)
+          end
+
+          it "shows voucher input" do
+            expect(page).to have_content "Apply voucher"
+          end
+        end
+      end
+
       describe "choosing" do
         shared_examples "different payment methods" do |pay_method|
           context "checking out with #{pay_method}", if: pay_method.eql?("Stripe SCA") == false do