From f1ac5b52f6634e4c7d830d166f4a775dbaab8cd7 Mon Sep 17 00:00:00 2001 From: Maciej Kucmus Date: Wed, 27 Nov 2019 10:25:16 +0100 Subject: [PATCH] feat(helper): add params, update productView --- .../components/views/ProductView.vue | 18 +++++--- .../product/getProductMainImageUrl.spec.ts | 4 +- .../product/getProductMediaGallery.spec.ts | 6 +-- .../product/getProductReviews.spec.ts | 45 +++++++++++++++++++ .../__tests__/product/isProductSimple.spec.ts | 23 ++++++++++ .../src/product/getProductMainImageUrl.ts | 7 ++- .../src/product/getProductMediaGallery.ts | 8 +++- .../helpers/src/product/getProductReviews.ts | 8 +++- .../helpers/src/product/isProductSimple.ts | 7 ++- 9 files changed, 110 insertions(+), 16 deletions(-) create mode 100644 packages/helpers/__tests__/product/getProductReviews.spec.ts create mode 100644 packages/helpers/__tests__/product/isProductSimple.spec.ts diff --git a/packages/default-theme/components/views/ProductView.vue b/packages/default-theme/components/views/ProductView.vue index 4b3de0012..73f8214fd 100644 --- a/packages/default-theme/components/views/ProductView.vue +++ b/packages/default-theme/components/views/ProductView.vue @@ -261,13 +261,13 @@ export default { return this.product && this.product.childCount > 0 }, isSimple() { - return isProductSimple(this.product) + return isProductSimple({product: this.product}) }, mainImage() { - return getProductMainImageUrl(this.product) + return getProductMainImageUrl({product: this.product}) }, mediaGallery() { - return getProductMediaGallery(this.product) + return getProductMediaGallery({product: this.product}) }, properties() { return getProductProperties({product: this.product}) @@ -293,13 +293,19 @@ export default { }) }, colors() { - return getProductOptions(this.product, "color") + return getProductOptions({ + product: this.product, + attribute: "color" + }) }, sizes() { - return getProductOptions(this.product, "size") + return getProductOptions({ + product: this.product, + attribute: "size" + }) }, reviews() { - return getProductReviews(this.product) + return getProductReviews({product: this.product}) }, stock() { return this.product && this.product.stock diff --git a/packages/helpers/__tests__/product/getProductMainImageUrl.spec.ts b/packages/helpers/__tests__/product/getProductMainImageUrl.spec.ts index e8640da7a..30aa5fe1e 100644 --- a/packages/helpers/__tests__/product/getProductMainImageUrl.spec.ts +++ b/packages/helpers/__tests__/product/getProductMainImageUrl.spec.ts @@ -4,13 +4,13 @@ import * as product from "./__mock__/product.json" describe("Shopware helpers - getProductMainImageUrl", () => { it("should contain url in nested media object", () => { - const coverUrl = getProductMainImageUrl(product) + const coverUrl = getProductMainImageUrl({product}) expect(coverUrl).toEqual("https://shopware.test/media/8a/fd/cb/1572351035/msh06-gray_main_2.jpg"); }); it("should return null for product without cover media", () => { const emptyProduct:any = {} - const coverUrl = getProductMainImageUrl(emptyProduct) + const coverUrl = getProductMainImageUrl({product: emptyProduct}) expect(coverUrl).toBeNull(); }); }); \ No newline at end of file diff --git a/packages/helpers/__tests__/product/getProductMediaGallery.spec.ts b/packages/helpers/__tests__/product/getProductMediaGallery.spec.ts index e72c0eef7..9f23a028a 100644 --- a/packages/helpers/__tests__/product/getProductMediaGallery.spec.ts +++ b/packages/helpers/__tests__/product/getProductMediaGallery.spec.ts @@ -4,13 +4,13 @@ import * as product from "./__mock__/product.json" describe("Shopware helpers - getProductMediaGallery", () => { it("should return array of UiMediaGalleryItem", () => { - const mediaGallery = getProductMediaGallery(product) + const mediaGallery = getProductMediaGallery({product}) expect(mediaGallery).toHaveLength(product.media.length) }); it("should return empty array of UiMediaGalleryItem on empty media", () => { const emptyProduct:any = {} - const mediaGallery = getProductMediaGallery(emptyProduct) + const mediaGallery = getProductMediaGallery({product: emptyProduct}) expect(mediaGallery).toHaveLength(0) }); @@ -37,7 +37,7 @@ describe("Shopware helpers - getProductMediaGallery", () => { } ] } - const mediaGallery = getProductMediaGallery(unmappedMediaSizes) + const mediaGallery = getProductMediaGallery({product: unmappedMediaSizes}) expect(mediaGallery).toHaveLength(1) }); }); \ No newline at end of file diff --git a/packages/helpers/__tests__/product/getProductReviews.spec.ts b/packages/helpers/__tests__/product/getProductReviews.spec.ts new file mode 100644 index 000000000..80ccfcd13 --- /dev/null +++ b/packages/helpers/__tests__/product/getProductReviews.spec.ts @@ -0,0 +1,45 @@ +import { getProductReviews } from "@shopware-pwa/helpers"; + +describe("Shopware helpers - getProductReviews", () => { + + it("should return an array of UiProductReview objects", () => { + const productWithReviews: any = { + productReviews: [ + { + id: "3858d1baf2544a379c92535ea3d2fe53", + customerId: "4ac7c8a40f6bc49e24d26f0ccb15e5e6", + externalUser: "Joe Doe", + points: 4, + content: "Great quality!", + createdAt: "2019-10-08T09:42:19+00:00", + }, + { + id: "3f06d7747f904336a78bf75e86a64535", + customerId: "3f06d7747f904336a78bf75e86a6450f", + externalUser: null, + points: 5, + content: "I'm impressed!", + createdAt: "2019-11-14T10:22:15+00:00", + } + ] + } + + const reviews = getProductReviews({product: productWithReviews}) + expect(reviews).toHaveLength(2); + const firstReview = reviews[0]; + const secondReview = reviews[1]; + expect(firstReview.id).toBe("3858d1baf2544a379c92535ea3d2fe53") + expect(firstReview.date).toBe("2019-10-08T09:42:19+00:00") + expect(firstReview.message).toBe("Great quality!") + expect(firstReview.rating).toBe(4) + + expect(secondReview.author).toBe("3f06d7747f904336a78bf75e86a6450f") + + }); + it("should return no reviews if do not exist", () => { + const productWithoutReviews: any = {} + const reviews = getProductReviews({product: productWithoutReviews}) + expect(reviews).toHaveLength(0); + }); + +}); \ No newline at end of file diff --git a/packages/helpers/__tests__/product/isProductSimple.spec.ts b/packages/helpers/__tests__/product/isProductSimple.spec.ts new file mode 100644 index 000000000..7074a220f --- /dev/null +++ b/packages/helpers/__tests__/product/isProductSimple.spec.ts @@ -0,0 +1,23 @@ +import { isProductSimple } from "@shopware-pwa/helpers"; + +describe("Shopware helpers - isProductSimple", () => { + + it("should return true if product has a parent", () => { + const productWithParent: any = { + parentId: "3f06d7747f904336a78bf75e86a6450f" + } + + const isSimple = isProductSimple({product: productWithParent}) + expect(isSimple).toBe(true); + + }); + it("should return true if product has no parent", () => { + const productWithoutParent: any = { + parentId: null + } + + const isSimple = isProductSimple({product: productWithoutParent}) + expect(isSimple).toBe(false); + }); + +}); \ No newline at end of file diff --git a/packages/helpers/src/product/getProductMainImageUrl.ts b/packages/helpers/src/product/getProductMainImageUrl.ts index f1656ca37..170afbe28 100644 --- a/packages/helpers/src/product/getProductMainImageUrl.ts +++ b/packages/helpers/src/product/getProductMainImageUrl.ts @@ -1,8 +1,11 @@ import { Product } from "@shopware-pwa/shopware-6-client"; - +interface Parameters { + product: Product +} /** * gets the cover image */ -export default function getProductMainImageUrl(product: Product): string | null { +export default function getProductMainImageUrl(params: Parameters): string | null { + const { product } = params return (product && product.cover && product.cover.media) ? product.cover.media.url : null } \ No newline at end of file diff --git a/packages/helpers/src/product/getProductMediaGallery.ts b/packages/helpers/src/product/getProductMediaGallery.ts index 4d4bdcb4f..d6ba41a04 100644 --- a/packages/helpers/src/product/getProductMediaGallery.ts +++ b/packages/helpers/src/product/getProductMediaGallery.ts @@ -10,7 +10,13 @@ interface UiMediaGalleryItem { big: UiMediaGalleryItemUrl } -export default function getProductMediaGallery(product: Product): UiMediaGalleryItem[] { +interface Parameters { + product: Product +} + +export default function getProductMediaGallery(params: Parameters): UiMediaGalleryItem[] { + const { product } = params + return product && product.media ? product.media.map(media => { const smallThumb = media.media && media.media.thumbnails && media.media.thumbnails.find(thumb => thumb.width == "400") diff --git a/packages/helpers/src/product/getProductReviews.ts b/packages/helpers/src/product/getProductReviews.ts index 5222ff51f..458572d32 100644 --- a/packages/helpers/src/product/getProductReviews.ts +++ b/packages/helpers/src/product/getProductReviews.ts @@ -9,7 +9,13 @@ interface UiProductReview { rating: number | null } -export default function getProductReviews(product: Product): UiProductReview[] { +interface Parameters { + product: Product +} + +export default function getProductReviews(params: Parameters): UiProductReview[] { + const { product } = params + if (!product.productReviews) { return [] } diff --git a/packages/helpers/src/product/isProductSimple.ts b/packages/helpers/src/product/isProductSimple.ts index 5731a5abd..aa0795bdc 100644 --- a/packages/helpers/src/product/isProductSimple.ts +++ b/packages/helpers/src/product/isProductSimple.ts @@ -1,5 +1,10 @@ import { Product } from "@shopware-pwa/shopware-6-client"; -export default function isProductSimple(product: Product): boolean { +interface Parameters { + product: Product +} + +export default function isProductSimple(params: Parameters): boolean { + const { product } = params return !!product.parentId } \ No newline at end of file