fix: add missing sw-language-id header

.changeset/great-spoons-relax.md

@@ -0,0 +1,5 @@
+---
+"vue-demo-store": patch
+---
+
+Added `sw-language-id` header property in `SwContactForm.vue` and `App.vue` components

.changeset/healthy-goats-buy.md

@@ -0,0 +1,5 @@
+---
+"@shopware/composables": patch
+---
+
+Added `sw-language-id` header property for API calls in `useCart`, `useCategorySearch`, `useCheckout`, `useCustomerOrders`, `useInternationalization`, and `useLandingSearch` composables.

examples/commercial-quick-order/src/App.vue

@@ -10,7 +10,8 @@ import type { Schemas } from "#shopware";
 
 const { apiClient } = useShopwareContext();
 // for initialize the session and get the current currency
-const { currency, refreshSessionContext } = useSessionContext();
+const { currency, refreshSessionContext, languageIdChain } =
+  useSessionContext();
 // to log in a customer, because the Quick Order feature is enabled for specifically selected users (in admin panel)
 const { login } = useUser();
 
@@ -108,6 +109,9 @@ const onAddToCartClick = async () => {
     body: {
       items: lineItemsPayload,
     },
+    headers: {
+      "sw-language-id": languageIdChain.value,
+    },
   });
 
   chosenItems.value = new Map();

packages/cms-base-layer/components/SwContactForm.vue

@@ -11,6 +11,7 @@ import {
   useCmsElementConfig,
   useNavigationContext,
   useSalutations,
+  useSessionContext,
   useShopwareContext,
 } from "#imports";
 
@@ -84,6 +85,7 @@ const { getSalutations } = useSalutations();
 const { foreignKey } = useNavigationContext();
 const { apiClient } = useShopwareContext();
 const { getConfigValue } = useCmsElementConfig(props.content);
+const { languageIdChain } = useSessionContext();
 
 const getConfirmationText = computed(
   () =>
@@ -148,6 +150,9 @@ const invokeSubmit = async () => {
           ...state,
           navigationId: foreignKey.value,
         },
+        headers: {
+          "sw-language-id": languageIdChain.value,
+        },
       });
       formSent.value = true;
     } catch (e) {

packages/composables/src/useCart/useCart.test.ts

@@ -86,6 +86,11 @@ describe("useCart", () => {
     await vm.refreshCart();
     expect(injections.apiClient.invoke).toHaveBeenCalledWith(
       expect.stringContaining("readCart"),
+      expect.objectContaining({
+        headers: {
+          "sw-language-id": "",
+        },
+      }),
     );
   });
 

packages/composables/src/useCart/useCart.ts

@@ -1,7 +1,7 @@
 import { createSharedComposable } from "@vueuse/core";
 import { computed } from "vue";
 import type { ComputedRef } from "vue";
-import { useContext, useShopwareContext } from "#imports";
+import { useContext, useSessionContext, useShopwareContext } from "#imports";
 import type { Schemas, operations } from "#shopware";
 
 /**
@@ -101,6 +101,7 @@ export type UseCartReturn = {
  */
 export function useCartFunction(): UseCartReturn {
   const { apiClient } = useShopwareContext();
+  const { languageIdChain } = useSessionContext();
 
   const _storeCart = useContext<Schemas["Cart"]>("swCart");
   const _storeCartErrors = useContext<Schemas["Cart"]["errors"] | null>(
@@ -115,7 +116,11 @@ export function useCartFunction(): UseCartReturn {
       return newCart;
     }
 
-    const { data } = await apiClient.invoke("readCart get /checkout/cart");
+    const { data } = await apiClient.invoke("readCart get /checkout/cart", {
+      headers: {
+        "sw-language-id": languageIdChain.value,
+      },
+    });
     _storeCart.value = data;
     setCartErrors(data);
     return data;

packages/composables/src/useCategorySearch/useCategorySearch.test.ts

@@ -19,6 +19,7 @@ describe("useCategorySearch", () => {
         },
         headers: {
           "sw-include-seo-urls": true,
+          "sw-language-id": "",
         },
       }),
     );
@@ -41,6 +42,7 @@ describe("useCategorySearch", () => {
         },
         headers: {
           "sw-include-seo-urls": true,
+          "sw-language-id": "",
         },
         body: {
           associations: cmsAssociations,

packages/composables/src/useCategorySearch/useCategorySearch.ts

@@ -1,4 +1,4 @@
-import { useShopwareContext } from "#imports";
+import { useSessionContext, useShopwareContext } from "#imports";
 import type { Schemas } from "#shopware";
 import { cmsAssociations } from "../cms/cmsAssociations";
 
@@ -31,6 +31,7 @@ export type UseCategorySearchReturn = {
  */
 export function useCategorySearch(): UseCategorySearchReturn {
   const { apiClient } = useShopwareContext();
+  const { languageIdChain } = useSessionContext();
 
   async function search(
     categoryId: string,
@@ -48,6 +49,7 @@ export function useCategorySearch(): UseCategorySearchReturn {
         },
         headers: {
           "sw-include-seo-urls": true,
+          "sw-language-id": languageIdChain.value,
         },
         body: {
           associations,
@@ -70,6 +72,9 @@ export function useCategorySearch(): UseCategorySearchReturn {
         associations,
         ...options?.query,
       },
+      headers: {
+        "sw-language-id": languageIdChain.value,
+      },
     });
     return result.data.elements ?? [];
   }

packages/composables/src/useCheckout/useCheckout.ts

@@ -80,6 +80,7 @@ export function useCheckout(): UseCheckoutReturn {
     selectedShippingMethod,
     setShippingMethod,
     setPaymentMethod,
+    languageIdChain,
   } = useSessionContext();
 
   const storeShippingMethods = inject("swShippingMethods", ref());
@@ -109,6 +110,9 @@ export function useCheckout(): UseCheckoutReturn {
         query: {
           onlyAvailable: true,
         },
+        headers: {
+          "sw-language-id": languageIdChain.value,
+        },
       },
     );
     storeShippingMethods.value =
@@ -125,6 +129,9 @@ export function useCheckout(): UseCheckoutReturn {
       "readPaymentMethod post /payment-method",
       {
         body: { onlyAvailable: true },
+        headers: {
+          "sw-language-id": languageIdChain.value,
+        },
       },
     );
     storePaymentMethods.value = response.data.elements || [];
@@ -136,6 +143,9 @@ export function useCheckout(): UseCheckoutReturn {
   ) {
     const order = await apiClient.invoke("createOrder post /checkout/order", {
       body: params,
+      headers: {
+        "sw-language-id": languageIdChain.value,
+      },
     });
     return order.data;
   }

packages/composables/src/useCustomerOrders/useCustomerOrders.ts

@@ -1,6 +1,6 @@
 import { computed, ref } from "vue";
 import type { ComputedRef, Ref } from "vue";
-import { useShopwareContext } from "#imports";
+import { useSessionContext, useShopwareContext } from "#imports";
 import type { Schemas, operations } from "#shopware";
 
 export type UseCustomerOrdersReturn = {
@@ -41,7 +41,7 @@ export type UseCustomerOrdersReturn = {
  */
 export function useCustomerOrders(): UseCustomerOrdersReturn {
   const { apiClient } = useShopwareContext();
-
+  const { languageIdChain } = useSessionContext();
   const orders: Ref<Schemas["Order"][]> = ref([]);
 
   const currentPaginationPage = ref<number>(1);
@@ -61,6 +61,9 @@ export function useCustomerOrders(): UseCustomerOrdersReturn {
     currentParams.value = params;
     const fetchedOrders = await apiClient.invoke("readOrder post /order", {
       body: { ...params, "total-count-mode": "exact" },
+      headers: {
+        "sw-language-id": languageIdChain.value,
+      },
     });
     orders.value = fetchedOrders.data.orders.elements;
     totalOrderItemsCount.value = fetchedOrders.data.orders.total ?? 0;

packages/composables/src/useInternationalization/useInternationalization.test.ts

@@ -29,6 +29,11 @@ describe("useInternationalization", () => {
     vm.getAvailableLanguages();
     expect(injections.apiClient.invoke).toHaveBeenCalledWith(
       expect.stringContaining("readLanguages"),
+      expect.objectContaining({
+        headers: {
+          "sw-language-id": "",
+        },
+      }),
     );
   });
 
@@ -38,7 +43,9 @@ describe("useInternationalization", () => {
     vm.changeLanguage("test-id");
     expect(injections.apiClient.invoke).toHaveBeenCalledWith(
       expect.stringContaining("updateContext"),
-      expect.objectContaining({ body: { languageId: "test-id" } }),
+      expect.objectContaining({
+        body: { languageId: "test-id" },
+      }),
     );
   });
 

packages/composables/src/useInternationalization/useInternationalization.ts

@@ -1,6 +1,6 @@
 import { urlIsAbsolute } from "@shopware/helpers";
 import type { Ref } from "vue";
-import { useContext, useShopwareContext } from "#imports";
+import { useContext, useSessionContext, useShopwareContext } from "#imports";
 import type { Schemas, operations } from "#shopware";
 
 export type UseInternationalizationReturn = {
@@ -82,7 +82,7 @@ export function useInternationalization(
 ): UseInternationalizationReturn {
   const { devStorefrontUrl } = useShopwareContext();
   const { apiClient } = useShopwareContext();
-
+  const { languageIdChain } = useSessionContext();
   const _storeLanguages = useContext<Schemas["Language"][]>("swLanguages");
   const _storeCurrentLanguage = useContext<string>(
     "swLanguagesCurrentLanguage",
@@ -94,7 +94,11 @@ export function useInternationalization(
   }
 
   async function getAvailableLanguages() {
-    const { data } = await apiClient.invoke("readLanguages post /language");
+    const { data } = await apiClient.invoke("readLanguages post /language", {
+      headers: {
+        "sw-language-id": languageIdChain.value,
+      },
+    });
     _storeLanguages.value = data.elements;
     return data;
   }

packages/composables/src/useLandingSearch/useLandingSearch.ts

@@ -1,4 +1,4 @@
-import { useShopwareContext } from "#imports";
+import { useSessionContext, useShopwareContext } from "#imports";
 import type { Schemas, operations } from "#shopware";
 import { cmsAssociations } from "../cms/cmsAssociations";
 
@@ -29,7 +29,7 @@ export function useLandingSearch(): {
   ) => Promise<Schemas["LandingPage"]>;
 } {
   const { apiClient } = useShopwareContext();
-
+  const { languageIdChain } = useSessionContext();
   const search = async (
     navigationId: string,
     options?: {
@@ -47,6 +47,9 @@ export function useLandingSearch(): {
         body: {
           associations,
         },
+        headers: {
+          "sw-language-id": languageIdChain.value,
+        },
       },
     );
     return result.data;

packages/composables/src/useListing/useListing.test.ts

@@ -21,7 +21,12 @@ describe("useListing", () => {
 
     expect(injections.apiClient.invoke).toHaveBeenCalledWith(
       expect.stringContaining("search"),
-      expect.objectContaining({}),
+      expect.objectContaining({
+        headers: {
+          "sw-include-seo-urls": true,
+          "sw-language-id": "",
+        },
+      }),
     );
 
     expect(vm.getCurrentPage).toBe(1);
@@ -48,6 +53,7 @@ describe("useListing", () => {
         },
         headers: {
           "sw-include-seo-urls": true,
+          "sw-language-id": "",
         },
         pathParams: {
           categoryId: "1234",
@@ -92,6 +98,7 @@ describe("useListing", () => {
         },
         headers: {
           "sw-include-seo-urls": true,
+          "sw-language-id": "",
         },
         pathParams: {
           categoryId: "1234",
@@ -131,6 +138,7 @@ describe("useListing", () => {
         },
         headers: {
           "sw-include-seo-urls": true,
+          "sw-language-id": "",
         },
         pathParams: {
           categoryId: "1234",
@@ -189,6 +197,7 @@ describe("useListing", () => {
         },
         headers: {
           "sw-include-seo-urls": true,
+          "sw-language-id": "",
         },
       }),
     );
@@ -211,6 +220,7 @@ describe("useListing", () => {
         },
         headers: {
           "sw-include-seo-urls": true,
+          "sw-language-id": "",
         },
       }),
     );
@@ -233,6 +243,7 @@ describe("useListing", () => {
         },
         headers: {
           "sw-include-seo-urls": true,
+          "sw-language-id": "",
         },
       }),
     );

packages/composables/src/useListing/useListing.ts

@@ -2,7 +2,7 @@ import { getListingFilters } from "@shopware/helpers";
 import { createInjectionState, createSharedComposable } from "@vueuse/core";
 import { computed, inject, provide, ref } from "vue";
 import type { ComputedRef, Ref } from "vue";
-import { useCategory, useShopwareContext } from "#imports";
+import { useCategory, useSessionContext, useShopwareContext } from "#imports";
 import type { Schemas, operations } from "#shopware";
 
 function isObject<T>(item: T): boolean {
@@ -186,7 +186,7 @@ export function useListing(params?: {
 }): UseListingReturn {
   const listingType = params?.listingType || "categoryListing";
   let categoryId = params?.categoryId || null;
-
+  const { languageIdChain } = useSessionContext();
   // const { getDefaults } = useDefaults({ defaultsKey: contextName });
   const { apiClient } = useShopwareContext();
 
@@ -205,6 +205,7 @@ export function useListing(params?: {
       const { data } = await apiClient.invoke("searchPage post /search", {
         headers: {
           "sw-include-seo-urls": true,
+          "sw-language-id": languageIdChain.value,
         },
         body: searchCriteria,
       });
@@ -224,6 +225,7 @@ export function useListing(params?: {
         {
           headers: {
             "sw-include-seo-urls": true,
+            "sw-language-id": languageIdChain.value,
           },
           pathParams: {
             categoryId: categoryId as string, // null exception in useCategory,