fix(helpers): use translated names and labels (#1243)

vuestorefront · Nov 18, 2020 · 8537e36 · 8537e36
1 parent 8681dc8
commit 8537e36
Show file tree

Hide file tree

Showing 2 changed files with 22 additions and 9 deletions.
diff --git a/packages/helpers/__tests__/product/getProductOptions.spec.ts b/packages/helpers/__tests__/product/getProductOptions.spec.ts
@@ -12,6 +12,12 @@ describe("Shopware helpers - getProductOptions", () => {
               name: "blue",
               group: {
                 name: "color",
+                translated: {
+                  name: "colour",
+                },
+              },
+              translated: {
+                name: "blau",
               },
               productOptions: [
                 {
@@ -24,6 +30,12 @@ describe("Shopware helpers - getProductOptions", () => {
               name: "blue",
               group: {
                 name: "color",
+                translated: {
+                  name: "colour",
+                },
+              },
+              translated: {
+                name: "blau",
               },
               productOptions: undefined,
             },
@@ -47,8 +59,8 @@ describe("Shopware helpers - getProductOptions", () => {
     const productOptions = getProductOptions({
       product: productWithChildren,
     });
-    expect(productOptions).toHaveProperty("color");
-    expect(productOptions["color"][0].matchingIds).toStrictEqual(["12345"]);
+    expect(productOptions).toHaveProperty("colour");
+    expect(productOptions["colour"][0].matchingIds).toStrictEqual(["12345"]);
   });
 
   it("should return no matching ids for given variant if there is no productOptions within variant option", () => {

diff --git a/packages/helpers/src/product/getProductOptions.ts b/packages/helpers/src/product/getProductOptions.ts
@@ -23,13 +23,14 @@ export function getProductOptions({
     }
 
     for (let option of variant.options) {
-      if (option.group?.name) {
-        if (!typeOptions.hasOwnProperty(option.group.name)) {
-          typeOptions[option.group.name] = [];
+      const groupName = option.group?.translated?.name || option.group?.name;
+      if (groupName) {
+        if (!typeOptions.hasOwnProperty(groupName)) {
+          typeOptions[groupName] = [];
         }
 
         if (
-          !typeOptions[option.group.name].find(
+          !typeOptions[groupName].find(
             (valueOption: any) => option.id == valueOption.code
           )
         ) {
@@ -39,10 +40,10 @@ export function getProductOptions({
               matchingOptionIds.push(...productOption.optionIds);
           });
 
-          typeOptions[option.group.name].push({
-            label: option.name,
+          typeOptions[groupName].push({
+            label: option.translated?.name || option.name,
             code: option.id,
-            value: option.name,
+            value: option.translated?.name || option.name,
             color: option.colorHexCode,
             matchingIds: matchingOptionIds,
           } as UiProductOption);