Merge pull request #27 from vuestorefront-community/dev

chore: release version 1.2.2
vuestorefront-community · Mar 15, 2022 · dc0d43e · dc0d43e
2 parents f32e4fa + 470c1fa
commit dc0d43e
Show file tree

Hide file tree

Showing 17 changed files with 365 additions and 370 deletions.
diff --git a/packages/api-client/package.json b/packages/api-client/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@vue-storefront/odoo-api",
-  "version": "1.2.0",
+  "version": "1.2.1",
   "private": false,
   "sideEffects": false,
   "server": "server/index.js",

diff --git a/packages/api-client/src/api/getProductTemplatesList/getProductTemplateListQuery.ts b/packages/api-client/src/api/getProductTemplatesList/getProductTemplateListQuery.ts
@@ -16,17 +16,18 @@ export default gql`
       sort: $sort
     ) {
       totalCount
-      attributes {
+      attributeValues {
         id
         name
         displayType
-        values {
+        name
+        htmlColor
+        search
+        attribute{
           id
           name
-          htmlColor
-          search
-          attributeId
         }
+        
       }
       products {
         ${productFragment}

diff --git a/packages/api-client/src/fragments/productFragment.ts b/packages/api-client/src/fragments/productFragment.ts
@@ -25,7 +25,9 @@ export default `
     name
     displayType
     priceExtra
-    attributeName
+    attribute {
+      name
+    }
     search
   }
 `;
diff --git a/packages/api-client/src/types/types.ts b/packages/api-client/src/types/types.ts
@@ -5,6 +5,10 @@ export enum SortEnum {
   ASC,
   DESC
 }
+export enum FilterVisibility {
+  Visible = 'Visible',
+  Hidden = 'Hidden'
+}
 
 export enum OrderStage {
   Quotation = 'Quotation',
@@ -47,22 +51,22 @@ export declare type PaymentMethod = {
   name: string;
 };
 
-export type AttributeValueList = {
+export type AttributeValue = {
   id: number;
   name: string;
+  displayType: string;
   htmlColor?: string;
   search: string;
-  attributeId?: number;
+  priceExtra?: number;
+  attribute?: Attribute,
 };
 
 export type Attribute = {
   id: number;
-  name: string;
-  displayType: string;
-  priceExtra?: number;
-  attributeName?: string;
-  search?: string;
-  values?: AttributeValueList[];
+  name?: string;
+  displayType?: string;
+  filterVisibility?: FilterVisibility
+  values?: AttributeValue[]
 };
 
 export type Category = {
@@ -225,7 +229,7 @@ export type SingleProductResult = {
 export type Products = {
   products: Product[];
   totalCount: number;
-  attributes: Attribute[];
+  attributeValues: AttributeValue[];
 }
 
 export type Categories = {
@@ -276,7 +280,7 @@ export type Product = {
   isInWishlist: boolean;
   alternativeProducts?: Product[];
   accessoryProducts?: Product[];
-  attributeValues: Attribute[];
+  attributeValues: AttributeValue[];
   productTemplate?: Product;
   categories: Category[];
 };

diff --git a/packages/composables/package.json b/packages/composables/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@vue-storefront/odoo",
-  "version": "1.2.0",
+  "version": "1.2.1",
   "private": false,
   "sideEffects": false,
   "main": "lib/index.cjs.js",
@@ -19,7 +19,7 @@
   "dependencies": {
     "@nuxtjs/composition-api": "0.31.0",
     "@vue-storefront/core": "2.5.4",
-    "@vue-storefront/odoo-api": "1.2.0"
+    "@vue-storefront/odoo-api": "1.2.1"
   },
   "peerDependencies": {
     "@vue/composition-api": "1.2.4"

diff --git a/packages/composables/src/composables/getters/facetGetters.ts b/packages/composables/src/composables/getters/facetGetters.ts
@@ -24,22 +24,33 @@ const getGrouped = (
 ): AgnosticGroupedFacet[] => {
   if (!searchData?.data?.attributes) return [];
 
-  const formatedAttribute = searchData?.data?.attributes.map((attribute) => ({
-    id: String(attribute.id),
-    label: attribute.name,
-    type: attribute.displayType,
-    count: 0,
-    options: attribute.values.map((value) => ({
+  const data = [];
+
+  searchData.data.attributes.forEach(item => {
+    const current = data.find(itemData => itemData.type === item.displayType);
+
+    if (!current) {
+      data.push({
+        id: String(item.attribute.id),
+        label: item.attribute?.name,
+        type: item.displayType,
+        count: 0,
+        options: []
+      });
+    }
+
+    data.find(itemData => itemData.type === item.displayType).options.push({
       type: '',
-      id: String(value.search),
-      value: value.id,
-      label: value.name,
-      metadata: value.search,
-      htmlColor: value.htmlColor
-    }))
-  }));
-
-  return formatedAttribute;
+      id: String(item.search),
+      value: item.id,
+      label: item.name,
+      metadata: item.search,
+      htmlColor: item.htmlColor
+    });
+
+  });
+
+  return data;
 };
 
 const getSortOptions = (searchData: SearchData): AgnosticSort => ({

diff --git a/packages/composables/src/composables/getters/productGetters.ts b/packages/composables/src/composables/getters/productGetters.ts
@@ -8,15 +8,16 @@ import {
 import {
   Product,
   ProductVariant,
-  Attribute
+  Attribute,
+  AttributeValue
 } from '@vue-storefront/odoo-api';
 
 type ProductFilters = any;
 
 export const getProductName = (product: Product): string =>
   product?.name || 'Product\'s name';
 
-export const getProductProperties = (product: Product): Attribute[] =>
+export const getProductProperties = (product: Product): AttributeValue[] =>
   product?.attributeValues || [];
 
 export const getProductCode = (product: Product): string => product?.sku || '';
@@ -73,15 +74,15 @@ export const getProductAttributes = (
   const groupedByName = {};
 
   product?.attributeValues?.forEach((option) => {
-    groupedByName[option.attributeName] = {
+    groupedByName[option.attribute.name] = {
       type: option.displayType,
       variantId: option.id,
-      label: option.attributeName,
+      label: option.attribute.name,
       values: []
     };
   });
   product?.attributeValues?.forEach((option) => {
-    groupedByName[option.attributeName].values.push({
+    groupedByName[option.attribute.name].values.push({
       value: String(option.id),
       label: option.name
     });
@@ -92,13 +93,13 @@ export const getProductAttributes = (
       attributes[option.displayType] = [];
     }
     if (
-      groupedByName[option.attributeName].type === option.displayType &&
+      groupedByName[option.attribute.name].type === option.displayType &&
       !attributes[option.displayType].some(
         (item) =>
-          item.variantId === groupedByName[option.attributeName].variantId
+          item.variantId === groupedByName[option.attribute.name].variantId
       )
     ) {
-      attributes[option.displayType].push(groupedByName[option.attributeName]);
+      attributes[option.displayType].push(groupedByName[option.attribute.name]);
     }
   });
 

diff --git a/packages/composables/src/composables/types/index.ts b/packages/composables/src/composables/types/index.ts
@@ -1,6 +1,7 @@
 /* eslint-disable @typescript-eslint/no-unused-vars */
 import { FacetSearchResult } from '@vue-storefront/core';
 import {
+  AttributeValue,
   Attribute,
   Category,
   Product
@@ -58,7 +59,7 @@ export interface FacetResultsData {
   totalProducts: number;
   perPageOptions: number;
   itemsPerPage: number;
-  attributes: Attribute[];
+  attributes: AttributeValue[];
 }
 
 export type SearchData = FacetSearchResult<FacetResultsData>;

diff --git a/packages/composables/src/composables/useFacet/index.ts b/packages/composables/src/composables/useFacet/index.ts
@@ -33,7 +33,7 @@ const factoryParams = {
     return {
       categories: data.categories.categories,
       products: productData.products.products,
-      attributes: productData.products.attributes,
+      attributes: productData.products.attributeValues,
       itemsPerPage: 1,
       facets: {},
       perPageOptions: 20,

diff --git a/packages/composables/test/jest/__tests__/__mocks__/productAttributesFormated.ts b/packages/composables/test/jest/__tests__/__mocks__/productAttributesFormated.ts
@@ -20,62 +20,4 @@ export const productVariantsFormatedForProduct = {
   ]
 };
 
-export const attributesFormatedForCategory = [
-  {
-    id: '2',
-    label: 'Color',
-    count: 0,
-    type: 'color',
-    options: [
-      { type: '', id: '2-3', value: 3, label: 'White', metadata: '2-3', htmlColor: '#FFFFFF' },
-      { type: '', id: '2-4', value: 4, label: 'Black', metadata: '2-4', htmlColor: '#000000' },
-      { type: '', id: '2-51', value: 51, label: 'Blue', metadata: '2-51', htmlColor: '#1E90FF' }
-    ]
-  },
-  {
-    id: '4',
-    label: 'Size',
-    count: 0,
-    type: 'select',
-    options: [
-      { type: '', id: '4-8', value: 8, label: 'One Size', metadata: '4-8', htmlColor: null },
-      { type: '', id: '4-9', value: 9, label: '5', metadata: '4-9', htmlColor: null},
-      { type: '', id: '4-10', value: 10, label: '6', metadata: '4-10', htmlColor: null},
-      { type: '', id: '4-11', value: 11, label: '7', metadata: '4-11', htmlColor: null},
-      { type: '', id: '4-12', value: 12, label: '8', metadata: '4-12', htmlColor: null},
-      { type: '', id: '4-13', value: 13, label: '9', metadata: '4-13', htmlColor: null},
-      { type: '', id: '4-14', value: 14, label: '10', metadata: '4-14', htmlColor: null},
-      { type: '', id: '4-15', value: 15, label: '11', metadata: '4-15', htmlColor: null},
-      { type: '', id: '4-16', value: 16, label: '12', metadata: '4-16', htmlColor: null},
-      { type: '', id: '4-17', value: 17, label: '13', metadata: '4-17', htmlColor: null},
-      { type: '', id: '4-18', value: 18, label: '34', metadata: '4-18', htmlColor: null},
-      { type: '', id: '4-19', value: 19, label: '35', metadata: '4-19', htmlColor: null},
-      { type: '', id: '4-20', value: 20, label: '36', metadata: '4-20', htmlColor: null},
-      { type: '', id: '4-21', value: 21, label: '37', metadata: '4-21', htmlColor: null},
-      { type: '', id: '4-22', value: 22, label: '38', metadata: '4-22', htmlColor: null},
-      { type: '', id: '4-23', value: 23, label: '39', metadata: '4-23', htmlColor: null},
-      { type: '', id: '4-24', value: 24, label: '40', metadata: '4-24', htmlColor: null},
-      { type: '', id: '4-25', value: 25, label: '41', metadata: '4-25', htmlColor: null},
-      { type: '', id: '4-26', value: 26, label: '42', metadata: '4-26', htmlColor: null},
-      { type: '', id: '4-27', value: 27, label: '43', metadata: '4-27', htmlColor: null},
-      { type: '', id: '4-28', value: 28, label: '44', metadata: '4-28', htmlColor: null},
-      { type: '', id: '4-29', value: 29, label: '45', metadata: '4-29', htmlColor: null},
-      { type: '', id: '4-30', value: 30, label: '46', metadata: '4-30', htmlColor: null},
-      { type: '', id: '4-31', value: 31, label: '47', metadata: '4-31', htmlColor: null},
-      { type: '', id: '4-32', value: 32, label: '48', metadata: '4-32', htmlColor: null},
-      { type: '', id: '4-33', value: 33, label: '49', metadata: '4-33', htmlColor: null},
-      { type: '', id: '4-34', value: 34, label: '50', metadata: '4-34', htmlColor: null},
-      { type: '', id: '4-35', value: 35, label: '51', metadata: '4-35', htmlColor: null},
-      { type: '', id: '4-36', value: 36, label: '52', metadata: '4-36', htmlColor: null }
-    ]
-  },
-  {
-    id: '5',
-    label: 'Material',
-    count: 0,
-    type: 'radio',
-    options: [
-      { type: '', id: '5-37', value: 37, label: 'Cotton', metadata: '5-37', htmlColor: null }
-    ]
-  }
-];
+export const attributesFormatedForCategory = [{id: '4', label: 'Size', type: 'select', count: 0, options: [{type: '', id: '4-9', value: 9, label: '5', metadata: '4-9', htmlColor: null}, {type: '', id: '4-10', value: 10, label: '6', metadata: '4-10', htmlColor: null}, {type: '', id: '4-11', value: 11, label: '7', metadata: '4-11', htmlColor: null}, {type: '', id: '4-12', value: 12, label: '8', metadata: '4-12', htmlColor: null}, {type: '', id: '4-13', value: 13, label: '9', metadata: '4-13', htmlColor: null}, {type: '', id: '4-14', value: 14, label: '10', metadata: '4-14', htmlColor: null}, {type: '', id: '4-17', value: 17, label: '13', metadata: '4-17', htmlColor: null}, {type: '', id: '4-18', value: 18, label: '34', metadata: '4-18', htmlColor: null}, {type: '', id: '4-19', value: 19, label: '35', metadata: '4-19', htmlColor: null}, {type: '', id: '4-20', value: 20, label: '36', metadata: '4-20', htmlColor: null}, {type: '', id: '4-21', value: 21, label: '37', metadata: '4-21', htmlColor: null}, {type: '', id: '4-22', value: 22, label: '38', metadata: '4-22', htmlColor: null}, {type: '', id: '4-24', value: 24, label: '40', metadata: '4-24', htmlColor: null}, {type: '', id: '4-25', value: 25, label: '41', metadata: '4-25', htmlColor: null}, {type: '', id: '4-26', value: 26, label: '42', metadata: '4-26', htmlColor: null}, {type: '', id: '4-27', value: 27, label: '43', metadata: '4-27', htmlColor: null}, {type: '', id: '4-29', value: 29, label: '45', metadata: '4-29', htmlColor: null}, {type: '', id: '4-30', value: 30, label: '46', metadata: '4-30', htmlColor: null}, {type: '', id: '4-31', value: 31, label: '47', metadata: '4-31', htmlColor: null}, {type: '', id: '4-32', value: 32, label: '48', metadata: '4-32', htmlColor: null}, {type: '', id: '4-33', value: 33, label: '49', metadata: '4-33', htmlColor: null}, {type: '', id: '4-34', value: 34, label: '50', metadata: '4-34', htmlColor: null}, {type: '', id: '4-35', value: 35, label: '51', metadata: '4-35', htmlColor: null}, {type: '', id: '4-36', value: 36, label: '52', metadata: '4-36', htmlColor: null}]}, {id: '5', label: 'Material', type: 'radio', count: 0, options: [{type: '', id: '5-37', value: 37, label: 'Cotton', metadata: '5-37', htmlColor: null}, {type: '', id: '5-38', value: 38, label: 'Leather', metadata: '5-38', htmlColor: null}]}, {id: '6', label: 'Color', type: 'color', count: 0, options: [{type: '', id: '6-40', value: 40, label: 'Black', metadata: '6-40', htmlColor: '#000000'}, {type: '', id: '6-41', value: 41, label: 'Grey', metadata: '6-41', htmlColor: '#bfbfbf'}, {type: '', id: '6-43', value: 43, label: 'Red', metadata: '6-43', htmlColor: '#f40000'}, {type: '', id: '6-45', value: 45, label: 'Blue', metadata: '6-45', htmlColor: '#0c7af7'}, {type: '', id: '6-46', value: 46, label: 'Green', metadata: '6-46', htmlColor: '#14c00b'}, {type: '', id: '6-47', value: 47, label: 'Brown', metadata: '6-47', htmlColor: '#964B00'}, {type: '', id: '6-49', value: 49, label: 'Beige', metadata: '6-49', htmlColor: '#faecdc'}]}];
diff --git a/packages/composables/test/jest/__tests__/__mocks__/productWithAttributes.ts b/packages/composables/test/jest/__tests__/__mocks__/productWithAttributes.ts
@@ -28,23 +28,32 @@ export const productWithAttributes: Product = {
       name: '36',
       displayType: 'select',
       priceExtra: 0,
-      attributeName: 'Size',
+      attribute: {
+        id: 0,
+        name: 'Size'
+      },
       search: '4-160'
     },
     {
       id: 161,
       name: '40',
       displayType: 'select',
       priceExtra: 0,
-      attributeName: 'Size',
+      attribute: {
+        id: 0,
+        name: 'Size'
+      },
       search: '4-161'
     },
     {
       id: 159,
       name: 'Cotton',
       displayType: 'radio',
       priceExtra: 0,
-      attributeName: 'Material',
+      attribute: {
+        id: 0,
+        name: 'Material'
+      },
       search: '5-159'
     }
   ]