Merge branch 'refs/heads/main' into edit-toolbar-logic-local

# Conflicts:
#	apps/web/components/Editor/Editor.vue
#	apps/web/components/ui/Toolbar/Toolbar.vue
#	apps/web/composables/useJsonEditor/useJsonEditor.ts
#	apps/web/layouts/default.vue
#	apps/web/pages/index.vue

.github/workflows/build-windows.yml

@@ -0,0 +1,60 @@
+name: Windows Build
+
+on:
+  workflow_dispatch:
+  push:
+    branches:
+      - main
+
+jobs:
+  build:        
+    runs-on: windows-latest
+
+    steps:
+      - name: Checkout code
+        uses: actions/checkout@v4
+
+      # When using Corepack and yarn on Windows, it's necessary to set up the node version twice. Otherwise the version doesn't match the engine specified in package.json.
+      - name: Setup node
+        uses: actions/setup-node@v4
+        with:
+          node-version: '20.5'
+
+      - name: Enable corepack
+        run: corepack enable
+
+      - name: Setup node
+        uses: actions/setup-node@v4
+        with:
+          node-version: '20.5'
+          cache: 'yarn'
+          registry-url: 'https://npm.pkg.github.com'
+
+      - name: Set yarn version
+        run: |
+          yarn set version stable
+          yarn set version 3.6.4
+
+      - name: Setup .yarnrc.yml
+        run: |
+          yarn config set nodeLinker node-modules
+          yarn config set npmScopes.plentymarkets.npmRegistryServer "https://npm.pkg.github.com"
+          yarn config set npmScopes.plentymarkets.npmAlwaysAuth true
+          yarn config set npmScopes.plentymarkets.npmAuthToken $env:NODE_AUTH_TOKEN
+        env:
+          NODE_AUTH_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+
+      - name: Set environment
+        run: |
+          New-Item -ItemType File -Path apps/web/.env -Force
+          Add-Content -Path apps/web/.env -Value "API_SECURITY_TOKEN=${{ secrets.API_SECURITY_TOKEN }}"
+          Add-Content -Path apps/web/.env -Value "API_ENDPOINT=https://mevofvd5omld.c01-14.plentymarkets.com"
+          Add-Content -Path apps/web/.env -Value "DEFAULT_FEEDBACK_ITEMS_PER_PAGE=1"
+        shell: pwsh
+
+      - name: Install dependencies
+        run: yarn --immutable
+
+      - name: Build app
+        run: |
+          yarn build

apps/web/__tests__/support/pageObjects/CheckoutPageObject.ts

@@ -154,7 +154,7 @@ export class CheckoutPageObject extends PageObject {
   }
 
   displayFullyPaid() {
-    this.orderPaymentStatus.contains('fullyPaid');
+    this.orderPaymentStatus.contains('Paid');
     return this;
   }
 

apps/web/assets/style.scss

@@ -70,3 +70,12 @@ apple-pay-button {
 .swiper-button-next {
   color: rgb(var(--colors-2-primary-500)) !important;
 }
+
+#google-pay-button {
+  div {
+    button {
+      width: 100% !important;
+      display: block;
+    }
+  }
+}

apps/web/build/configurator/AppConfigurator.ts

@@ -16,6 +16,7 @@ dotenv.config({
 export class AppConfigurator {
   private environmentMap = {
     FETCH_REMOTE_CONFIG: process.env.FETCH_REMOTE_CONFIG,
+    API_URL: process.env.API_URL,
     API_ENDPOINT: process.env.API_ENDPOINT,
     API_SECURITY_TOKEN: process.env.API_SECURITY_TOKEN,
     CONFIG_ID: process.env.CONFIG_ID,

apps/web/build/configurator/__tests__/AppConfigurator.spec.ts

@@ -66,13 +66,15 @@ $color-2-secondary-900: 2 1 55;
         beforeEach(() => {
             vi.resetModules();
             process.env.FETCH_REMOTE_CONFIG = 'true';
+            process.env.API_URL = 'https://api.example.com'
             process.env.API_ENDPOINT = 'https://api.example.com';
             process.env.API_SECURITY_TOKEN = 'securetoken';
             process.env.CONFIG_ID = '1';
         });
 
         afterEach(() => {
             delete process.env.FETCH_REMOTE_CONFIG;
+            delete process.env.API_URL;
             delete process.env.API_ENDPOINT;
             delete process.env.API_SECURITY_TOKEN;
             delete process.env.CONFIG_ID;
@@ -109,6 +111,7 @@ $color-2-secondary-900: 2 1 55;
 
             const EXPECTED = 
 `FETCH_REMOTE_CONFIG=true
+API_URL=https://api.example.com
 API_ENDPOINT=https://api.example.com
 API_SECURITY_TOKEN=securetoken
 CONFIG_ID=1

apps/web/build/logs/Logger.ts

@@ -11,7 +11,7 @@ class BuildLogger implements Logger {
   private logStream: WriteStream;
 
   constructor() {
-    const timestamp = new Date().toISOString();
+    const timestamp = new Date().toISOString().replaceAll(':', '-');
     const logFilePath = path.resolve(__dirname, `./build-${timestamp}.log`);
     this.logStream = createWriteStream(logFilePath);
   }

apps/web/components/ConfirmationPageContent/ConfirmationPageContent.vue

@@ -103,6 +103,7 @@ const { isAuthorized } = useCustomer();
 const { getActiveShippingCountries } = useActiveShippingCountries();
 const localePath = useLocalePath();
 const bankDetails = orderGetters.getOrderPaymentBankDetails(order);
+useProcessingOrder().processingOrder.value = false;
 
 await getActiveShippingCountries();
 </script>

apps/web/components/Editor/Editor.vue

@@ -13,17 +13,17 @@
         @scroll="syncScroll"
         ref="textarea"
         class="w-full p-2 font-mono text-sm border-none resize-none outline-none h-[500px]"
-        placeholder="Edit JSON here..."
+        :placeholder="$t('editMode.editJsonPlaceholder')"
       ></textarea>
     </div>
     <UiButton @click="formatJson" class="mt-4 px-4 py-2 text-white rounded-md bg-blue-500 hover:bg-blue-600">
-      Format JSON
+      {{ $t('editMode.formatJson') }}
     </UiButton>
     <UiButton @click="purgeJson" class="mt-4 ml-2 px-4 py-2 text-white rounded-md bg-green-500 hover:bg-green-600">
-      Minify JSON
+      {{ $t('editMode.minifyJson') }}
     </UiButton>
     <UiButton @click="clearText" class="mt-4 ml-2 px-4 py-2 text-white rounded-md bg-red-500 hover:bg-red-600">
-      Clear Text
+      {{ $t('editMode.clearJson') }}
     </UiButton>
     <div v-if="errorMessage" class="text-red-500 mt-2 text-sm">{{ errorMessage }}</div>
   </div>

apps/web/components/Editor/heroData.ts

@@ -0,0 +1,28 @@
+export const heroData = [
+  {
+    image: 'https://cdn02.plentymarkets.com/mevofvd5omld/frontend/homepage-hero-headphones.avif',
+    tagline: 'Feel the music harder',
+    heading: 'Your Sound, Elevated',
+    description:
+      "Immerse yourself in rich, crystal-clear audio with our cutting-edge headphones. Designed for the ultimate listening experience, whether you're a casual listener or an audiophile. Discover the perfect blend of style, comfort, and sound quality that elevates your music to new heights.",
+    callToAction: 'Order Now',
+    link: '',
+  },
+  {
+    image: 'https://cdn02.plentymarkets.com/mevofvd5omld/frontend/homepage-hero-headphones.avif',
+    tagline: 'Experience Sound Freedom',
+    heading: 'Wireless. Effortless. Seamless.',
+    description:
+      'Unleash your audio with our state-of-the-art wireless earbuds. Designed for all-day comfort and uncompromised sound quality, these earbuds deliver crisp highs and deep bass, letting you enjoy your music without any distractions. Discover freedom with a perfect fit, long battery life, and intuitive controls.',
+    callToAction: 'Shop Earbuds',
+  },
+  {
+    image: 'https://cdn02.plentymarkets.com/mevofvd5omld/frontend/homepage-hero-headphones.avif',
+    tagline: 'Amplify Your Space',
+    heading: 'Big Sound, Compact Design',
+    description:
+      "Transform your space with our portable speakers that pack a punch. Crafted for superior sound performance, these speakers are perfect for home or on the go. With easy connectivity and a sleek design, elevate your listening experience whether you're indoors or outdoors.",
+    callToAction: 'Browse Speakers',
+    link: '',
+  },
+];

apps/web/components/Editor/mediaData.ts

@@ -0,0 +1,7 @@
+export const mediaData = [
+  {
+    text: "<div class='flex flex-col mt-5 sm:mt-20 mt-0 sm:p-0 p-5 text-center sm:text-left'><span class='text-xl font-bold mb-2'>Experience the Future of Sound</span><h2 class='text-2xl font-semibold mb-4'>Redefine Your Listening Experience</h2><p class='text-base mb-6 padding-right-desktop typography-text-sm md:typography-text-lg '>Our latest collection of headphones is designed to deliver unparalleled audio precision, with deep bass, clear highs, and an immersive experience for every genre of music. Combining sleek design, comfort, and cutting-edge technology, these headphones are made for those who refuse to compromise on sound quality.</p><ul class='list-disc list-inside typography-text-sm md:typography-text-lg'><li>Premium, studio-quality sound</li><li>Comfortable fit for extended listening</li><li>Long-lasting battery life</li><li>Seamless wireless connectivity</li></ul></div>",
+    image: 'https://cdn02.plentymarkets.com/mevofvd5omld/frontend/headphones-mediacard.avif',
+    alignment: 'left',
+  },
+];

apps/web/components/ManufacturerResponsibleInfo/ManufacturerResponsibleInfo.vue

@@ -20,7 +20,7 @@
         {{ manufacturerResponsibleInfo.postCode }}
         <span v-if="manufacturerResponsibleInfo.town"> {{ manufacturerResponsibleInfo.town }}</span>
         <span v-if="manufacturerResponsibleInfo.town && manufacturerResponsibleInfo.country">, &nbsp;</span>
-        <span v-if="manufacturerResponsibleInfo.country">{{ manufacturerResponsibleInfo.country }}</span>
+        <span v-if="manufacturerResponsibleInfo.country">{{ manufacturerResponsibleInfo.country.name }}</span>
       </p>
       <p v-if="manufacturerResponsibleInfo.phoneNo">{{ t('phone') }}: {{ manufacturerResponsibleInfo.phoneNo }}</p>
       <p v-if="manufacturerResponsibleInfo.email">{{ t('email') }}: {{ manufacturerResponsibleInfo.email }}</p>

apps/web/components/OrderPaymentSummary/OrderPaymentSummary.vue

@@ -11,7 +11,7 @@
   <p>{{ orderGetters.getPaymentMethodName(order) }}</p>
 
   <h2 class="font-medium text-base mt-4">{{ $t('account.ordersAndReturns.paymentSummary.paymentStatus') }}</h2>
-  <p data-testid="order-payment-status">{{ orderGetters.getPaymentStatus(order) }}</p>
+  <p data-testid="order-payment-status">{{ $t(orderGetters.getPaymentStatusKey(order)) }}</p>
 </template>
 
 <script setup lang="ts">