From 24bbeba2b0ec7325f65df3bdd29be99e8c5e8afc Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Maximilian=20R=C3=B6ll?=
 <30629157+maxiroellplenty@users.noreply.github.com>
Date: Thu, 30 Nov 2023 13:46:43 +0100
Subject: [PATCH] refactor: rename voucher to coupon

---
 .../support/pageObjects/CartPageObject.ts     | 18 ++++++------
 .../smoke/{voucher.cy.ts => coupon.cy.ts}     | 14 +++++-----
 .../CartPageContent/CartPageContent.vue       |  4 +--
 .../Voucher.vue => Coupon/Coupon.vue}         | 26 ++++++++---------
 apps/web/composables/index.ts                 |  2 +-
 apps/web/composables/useCoupon/index.ts       |  3 ++
 apps/web/composables/useCoupon/types.ts       | 17 +++++++++++
 .../useVoucher.ts => useCoupon/useCoupon.ts}  | 28 +++++++++----------
 apps/web/composables/useVoucher/index.ts      |  3 --
 apps/web/composables/useVoucher/types.ts      | 17 -----------
 apps/web/lang/de.json                         |  6 ++--
 apps/web/lang/en.json                         |  6 ++--
 apps/web/pages/checkout.vue                   |  2 +-
 13 files changed, 73 insertions(+), 73 deletions(-)
 rename apps/web/__tests__/test/smoke/{voucher.cy.ts => coupon.cy.ts} (69%)
 rename apps/web/components/{Voucher/Voucher.vue => Coupon/Coupon.vue} (74%)
 create mode 100644 apps/web/composables/useCoupon/index.ts
 create mode 100644 apps/web/composables/useCoupon/types.ts
 rename apps/web/composables/{useVoucher/useVoucher.ts => useCoupon/useCoupon.ts} (68%)
 delete mode 100644 apps/web/composables/useVoucher/index.ts
 delete mode 100644 apps/web/composables/useVoucher/types.ts

diff --git a/apps/web/__tests__/support/pageObjects/CartPageObject.ts b/apps/web/__tests__/support/pageObjects/CartPageObject.ts
index 1d0195bd5..6cc16315b 100644
--- a/apps/web/__tests__/support/pageObjects/CartPageObject.ts
+++ b/apps/web/__tests__/support/pageObjects/CartPageObject.ts
@@ -62,29 +62,29 @@ export class CartPageObject {
     return this;
   }
 
-  openVoucherAccordion() {
-    cy.getByTestId('voucherZone').click();
+  openCouponAccordion() {
+    cy.getByTestId('couponZone').click();
     return this;
   }
 
-  addVoucher(voucherCode: string) {
-    cy.getByTestId('voucherCode').find('[data-testid="input-field"]').type(voucherCode);
-    cy.getByTestId('voucherAdd').click();
+  addCoupon(couponCode: string) {
+    cy.getByTestId('couponCode').find('[data-testid="input-field"]').type(couponCode);
+    cy.getByTestId('couponAdd').click();
     return this;
   }
 
-  orderSummayAfterVoucherApplyed(discount: string, total: string) {
+  orderSummayAfterCouponApplyed(discount: string, total: string) {
     cy.getByTestId('coupon-label').should('be.visible');
     cy.getByTestId('coupon-value').contains(discount);
     cy.getByTestId('total').contains(total);
   }
 
-  removeVoucher() {
-    cy.getByTestId('voucherRemove').click();
+  removeCoupon() {
+    cy.getByTestId('couponRemove').click();
     return this;
   }
   
-  orderSummayAfterVoucherRemoved(total: string) {
+  orderSummayAfterCouponRemoved(total: string) {
     cy.getByTestId('coupon-label').should('not.exist');
     cy.getByTestId('total').contains(total);
   }
diff --git a/apps/web/__tests__/test/smoke/voucher.cy.ts b/apps/web/__tests__/test/smoke/coupon.cy.ts
similarity index 69%
rename from apps/web/__tests__/test/smoke/voucher.cy.ts
rename to apps/web/__tests__/test/smoke/coupon.cy.ts
index 86b38c425..96bdb5101 100644
--- a/apps/web/__tests__/test/smoke/voucher.cy.ts
+++ b/apps/web/__tests__/test/smoke/coupon.cy.ts
@@ -3,23 +3,23 @@ import { paths } from '../../../utils/paths';
 
 const cart = new CartPageObject();
 
-describe('Smoke: Voucher test', () => {
+describe('Smoke: Coupon test', () => {
   beforeEach(() => {
     cy.setCookie('vsf-locale', 'en');
     cy.setCookie('consent-cookie', '{"Essentials":{"Session":true,"Consent":true,"Session2":true},"External Media":{"Session":false,"Consent":false,"Session2":false},"Functional":{"Session":false,"Consent":false,"Session2":false},"Marketing":{"Session":false,"Consent":false,"Session2":false}}')
   });
   
-  it('[smoke] Add voucher to cart and check order summary then remove voucher and check order summary', () => {
+  it('[smoke] Add coupon to cart and check order summary then remove coupon and check order summary', () => {
     cy.visitAndHydrate('/study-room-office/office-chair/design-chair-brookhaven-leather-black_105_1003');
     cy.intercept('/plentysystems/doAddCartItem').as('doAddCartItem');
     cy.wait(1000);
     cy.getByTestId('add-to-cart').click();
     cy.wait('@doAddCartItem');
     cy.visitAndHydrate(paths.cart);
-    cart.openVoucherAccordion();
-    cart.addVoucher('KB82AZ');
-    cart.orderSummayAfterVoucherApplyed('-£12.95','£119.99');
-    cart.removeVoucher();
-    cart.orderSummayAfterVoucherRemoved('£132.94');
+    cart.openCouponAccordion();
+    cart.addCoupon('KB82AZ');
+    cart.orderSummayAfterCouponApplyed('-£12.95','£119.99');
+    cart.removeCoupon();
+    cart.orderSummayAfterCouponRemoved('£132.94');
   });
 });
diff --git a/apps/web/components/CartPageContent/CartPageContent.vue b/apps/web/components/CartPageContent/CartPageContent.vue
index fb679810d..1f43954f0 100644
--- a/apps/web/components/CartPageContent/CartPageContent.vue
+++ b/apps/web/components/CartPageContent/CartPageContent.vue
@@ -4,12 +4,12 @@
       <div v-for="cartItem in cart?.items" :key="cartItem.id">
         <UiCartProductCard :cart-item="cartItem" />
       </div>
-      <Voucher class="mb-2" v-if="!isDesktop" />
+      <Coupon class="mb-2" v-if="!isDesktop" />
     </div>
     <div class="relative col-span-5 md:sticky md:top-10 h-fit" :class="{ 'pointer-events-none opacity-50': loading }">
       <SfLoaderCircular v-if="loading" class="absolute top-[130px] right-0 left-0 m-auto z-[999]" size="2xl" />
       <OrderSummary v-if="cart" :cart="cart">
-        <Voucher v-if="isDesktop" class="mb-5" />
+        <Coupon v-if="isDesktop" class="mb-5" />
         <SfButton
           data-testid="checkout-button"
           :tag="NuxtLink"
diff --git a/apps/web/components/Voucher/Voucher.vue b/apps/web/components/Coupon/Coupon.vue
similarity index 74%
rename from apps/web/components/Voucher/Voucher.vue
rename to apps/web/components/Coupon/Coupon.vue
index 3c10e0997..5652ec62c 100644
--- a/apps/web/components/Voucher/Voucher.vue
+++ b/apps/web/components/Coupon/Coupon.vue
@@ -1,24 +1,24 @@
 <template>
   <div class="border-b border-neutral-200">
-    <SfAccordionItem v-if="!cartGetters.getCouponDiscount(cart)" data-testid="voucherZone" v-model="openedVoucher">
+    <SfAccordionItem v-if="!cartGetters.getCouponDiscount(cart)" data-testid="couponZone" v-model="openedCoupon">
       <template #summary>
         <div
           class="flex justify-between font-medium p-3 border-2 border-solid border-transparent"
-          :class="{ 'mb-3 bg-gray-100 !border-dashed !border-red-200': openedVoucher }"
+          :class="{ 'mb-3 bg-gray-100 !border-dashed !border-red-200': openedCoupon }"
         >
           <p class="pl-3">{{ $t('coupon.title') }}</p>
           <SfIconChevronLeft
-            :class="['text-neutral-500', { 'rotate-90': openedVoucher, '-rotate-90': !openedVoucher }]"
+            :class="['text-neutral-500', { 'rotate-90': openedCoupon, '-rotate-90': !openedCoupon }]"
           />
         </div>
       </template>
       <div class="flex mb-2">
-        <div class="flex-grow mr-2" data-testid="voucherCode">
+        <div class="flex-grow mr-2" data-testid="couponCode">
           <SfInput :placeholder="$t('coupon.enterCode')" type="text" v-model="couponCode" required />
         </div>
         <SfButton
-          data-testid="voucherAdd"
-          @click="addVoucher({ couponCode })"
+          data-testid="couponAdd"
+          @click="addCoupon({ couponCode })"
           class="ml-2"
           type="reset"
           variant="primary"
@@ -35,8 +35,8 @@
       <div class="text-primary-800 pl-3 pt-2 font-medium">{{ couponCode }}</div>
       <div>
         <SfButton
-          data-testid="voucherRemove"
-          @click="handleDeleteVoucher"
+          data-testid="couponRemove"
+          @click="handleDeleteCoupon"
           variant="tertiary"
           class="text-stone-800"
           :disabled="loading"
@@ -64,18 +64,18 @@ import {
 } from '@storefront-ui/vue';
 import { ref, onMounted } from 'vue';
 import { useCart } from '~/composables';
-const openedVoucher = ref(false);
+const openedCoupon = ref(false);
 const couponCode = ref('');
-const { addVoucher, deleteVoucher, loading } = useVoucher();
+const { addCoupon, deleteCoupon, loading } = useCoupon();
 const { data: cart } = useCart();
 
-const handleDeleteVoucher = async () => {
-  await deleteVoucher({ couponCode: couponCode.value });
+const handleDeleteCoupon = async () => {
+  await deleteCoupon({ couponCode: couponCode.value });
   couponCode.value = '';
 };
 
 onMounted(() => {
   couponCode.value = cartGetters.getCouponCode(cart.value);
-  openedVoucher.value = cartGetters.getCouponDiscount(cart.value) !== 0;
+  openedCoupon.value = cartGetters.getCouponDiscount(cart.value) !== 0;
 });
 </script>
diff --git a/apps/web/composables/index.ts b/apps/web/composables/index.ts
index 5f6eafce1..2c572a078 100644
--- a/apps/web/composables/index.ts
+++ b/apps/web/composables/index.ts
@@ -29,5 +29,5 @@ export * from './useProductReviewAverage';
 export * from './useProductReviews';
 export * from './useProducts';
 export * from './useSearch';
-export * from './useVoucher';
+export * from './useCoupon';
 export * from './useStructuredData';
diff --git a/apps/web/composables/useCoupon/index.ts b/apps/web/composables/useCoupon/index.ts
new file mode 100644
index 000000000..dfb41765a
--- /dev/null
+++ b/apps/web/composables/useCoupon/index.ts
@@ -0,0 +1,3 @@
+export * from './useCoupon';
+
+export * from './types';
diff --git a/apps/web/composables/useCoupon/types.ts b/apps/web/composables/useCoupon/types.ts
new file mode 100644
index 000000000..ceebef393
--- /dev/null
+++ b/apps/web/composables/useCoupon/types.ts
@@ -0,0 +1,17 @@
+import { Ref } from 'vue';
+import { DoAddCouponParams, Cart } from '@plentymarkets/shop-api';
+
+export interface UseCouponState {
+  loading: boolean;
+}
+
+export type AddCoupon = (params: DoAddCouponParams) => Promise<Cart>;
+export type DeleteCoupon = (params: DoAddCouponParams) => Promise<Cart>;
+
+export interface UseCoupon {
+  loading: Readonly<Ref<boolean>>;
+  addCoupon: AddCoupon;
+  deleteCoupon: DeleteCoupon;
+}
+
+export type UseCouponReturn = () => UseCoupon;
diff --git a/apps/web/composables/useVoucher/useVoucher.ts b/apps/web/composables/useCoupon/useCoupon.ts
similarity index 68%
rename from apps/web/composables/useVoucher/useVoucher.ts
rename to apps/web/composables/useCoupon/useCoupon.ts
index 4e59ad64f..40853ef72 100644
--- a/apps/web/composables/useVoucher/useVoucher.ts
+++ b/apps/web/composables/useCoupon/useCoupon.ts
@@ -1,31 +1,31 @@
-import { UseVoucherReturn, UseVoucherState, AddVoucher, DeleteVoucher } from './types';
+import { UseCouponReturn, UseCouponState, AddCoupon, DeleteCoupon } from './types';
 import { useSdk } from '~/sdk';
 import { DoAddCouponParams } from '@plentymarkets/shop-api';
 /**
- * @description Composable for managing vouchers.
- * @returns UseVoucherReturn
+ * @description Composable for managing coupons.
+ * @returns UseCouponReturn
  * @example
  * ``` ts
- * const { addVoucher, deleteVoucher, loading } = useVoucher();
+ * const { addCoupon, deleteCoupon, loading } = useCoupon();
  * ```
  */
-export const useVoucher: UseVoucherReturn = () => {
-  const state = useState<UseVoucherState>('voucher', () => ({
+export const useCoupon: UseCouponReturn = () => {
+  const state = useState<UseCouponState>('coupon', () => ({
     loading: false,
   }));
 
   /**
-   * @description Function for adding a voucher to curent cart.
+   * @description Function for adding a coupon to curent cart.
    * @param params { DoAddCouponParams }
    * @return Cart
    * @example
    * ``` ts
-   * addVoucher({
+   * addCoupon({
       couponCode: 'KB82AZ'
     })
    * ```
    */
-  const addVoucher: AddVoucher = async (params: DoAddCouponParams) => {
+  const addCoupon: AddCoupon = async (params: DoAddCouponParams) => {
     const { $i18n } = useNuxtApp();
     const { send } = useNotification();
     const { getCart } = useCart();
@@ -34,7 +34,7 @@ export const useVoucher: UseVoucherReturn = () => {
     state.value.loading = false;
     if (response.data.value.data) {
       getCart();
-      send({ message: $i18n.t('coupon.voucherApplied'), type: 'positive' });
+      send({ message: $i18n.t('coupon.couponApplied'), type: 'positive' });
     } else if (response.data.value.error) {
       const error = {
         status: 500,
@@ -46,7 +46,7 @@ export const useVoucher: UseVoucherReturn = () => {
     return response.data.value.data;
   };
 
-  const deleteVoucher: DeleteVoucher = async (params: DoAddCouponParams) => {
+  const deleteCoupon: DeleteCoupon = async (params: DoAddCouponParams) => {
     state.value.loading = true;
     const { $i18n } = useNuxtApp();
     const { send } = useNotification();
@@ -56,7 +56,7 @@ export const useVoucher: UseVoucherReturn = () => {
     state.value.loading = false;
     if (response.data.value.data) {
       getCart();
-      send({ message: $i18n.t('coupon.voucherRemoved'), type: 'positive' });
+      send({ message: $i18n.t('coupon.couponRemoved'), type: 'positive' });
     } else if (response.data.value.error) {
       const error = {
         status: 500,
@@ -70,8 +70,8 @@ export const useVoucher: UseVoucherReturn = () => {
   };
 
   return {
-    addVoucher,
-    deleteVoucher,
+    addCoupon,
+    deleteCoupon,
     ...toRefs(state.value),
   };
 };
diff --git a/apps/web/composables/useVoucher/index.ts b/apps/web/composables/useVoucher/index.ts
deleted file mode 100644
index 7ed2c6eeb..000000000
--- a/apps/web/composables/useVoucher/index.ts
+++ /dev/null
@@ -1,3 +0,0 @@
-export * from './useVoucher';
-
-export * from './types';
diff --git a/apps/web/composables/useVoucher/types.ts b/apps/web/composables/useVoucher/types.ts
deleted file mode 100644
index 108cda0e6..000000000
--- a/apps/web/composables/useVoucher/types.ts
+++ /dev/null
@@ -1,17 +0,0 @@
-import { Ref } from 'vue';
-import { DoAddCouponParams, Cart } from '@plentymarkets/shop-api';
-
-export interface UseVoucherState {
-  loading: boolean;
-}
-
-export type AddVoucher = (params: DoAddCouponParams) => Promise<Cart>;
-export type DeleteVoucher = (params: DoAddCouponParams) => Promise<Cart>;
-
-export interface UseVoucher {
-  loading: Readonly<Ref<boolean>>;
-  addVoucher: AddVoucher;
-  deleteVoucher: DeleteVoucher;
-}
-
-export type UseVoucherReturn = () => UseVoucher;
diff --git a/apps/web/lang/de.json b/apps/web/lang/de.json
index 5fac8ab85..3b9678a23 100644
--- a/apps/web/lang/de.json
+++ b/apps/web/lang/de.json
@@ -499,9 +499,9 @@
     "title": "Haben sie einen Gutscheincode?",
     "enterCode": "Gutschein-Code eingeben",
     "apply": "Einlösen",
-    "voucherApplied": "Der Gutschein wurde erfolgreich eingelöst.",
-    "voucherRemoved": "Der Gutschein wurde erfolgreich entfernt.",
-    "voucherInvalid": "Der Gutschein wurde bereits verwendet oder ist ungültig."
+    "couponApplied": "Der Gutschein wurde erfolgreich eingelöst.",
+    "couponRemoved": "Der Gutschein wurde erfolgreich entfernt.",
+    "couponInvalid": "Der Gutschein wurde bereits verwendet oder ist ungültig."
   },
   "error": {
     "errorActionIsNotExecuted": "Die Aktion konnte nicht ausgeführt werden.",
diff --git a/apps/web/lang/en.json b/apps/web/lang/en.json
index 5bc4e9a47..5c061fd5e 100644
--- a/apps/web/lang/en.json
+++ b/apps/web/lang/en.json
@@ -499,9 +499,9 @@
     "title": "Have a coupon code?",
     "enterCode": "Enter code",
     "apply": "Apply",
-    "voucherApplied": "The coupon has been added successfully",
-    "voucherRemoved": "The coupon has been removed successfully.",
-    "voucherInvalid": "The coupon has already been used or is invalid."
+    "couponApplied": "The coupon has been added successfully",
+    "couponRemoved": "The coupon has been removed successfully.",
+    "couponInvalid": "The coupon has already been used or is invalid."
   },
   "error": {
     "errorActionIsNotExecuted": "This action could not be executed.",
diff --git a/apps/web/pages/checkout.vue b/apps/web/pages/checkout.vue
index 75f6c19ec..303e6b9d3 100644
--- a/apps/web/pages/checkout.vue
+++ b/apps/web/pages/checkout.vue
@@ -58,7 +58,7 @@
         </div>
         <div class="relative md:sticky mt-4 md:top-20 h-fit" :class="{ 'pointer-events-none opacity-50': cartLoading }">
           <SfLoaderCircular v-if="cartLoading" class="absolute top-[130px] right-0 left-0 m-auto z-[999]" size="2xl" />
-          <Voucher class="my-5"></Voucher>
+          <Coupon class="my-5"/>
           <OrderSummary v-if="cart" :cart="cart">
             <PayPalExpressButton
               type="Checkout"