diff --git a/.routify/config.js b/.routify/config.js index 5626af3f..b499b4be 100644 --- a/.routify/config.js +++ b/.routify/config.js @@ -8,5 +8,5 @@ module.exports = { noHashScroll: false, distDir: 'dist', extensions: ['svelte', 'html', 'svx', 'md'], - started: '2022-01-15T16:52:26.406Z', + started: '2022-01-22T09:29:54.854Z', }; diff --git a/.routify/routes.js b/.routify/routes.js index 5bf494d3..ad54b7c8 100644 --- a/.routify/routes.js +++ b/.routify/routes.js @@ -1,10 +1,10 @@ /** * @roxi/routify 2.7.3 - * File generated Sat Jan 15 2022 16:52:28 GMT+0000 (Greenwich Mean Time) + * File generated Sat Jan 22 2022 09:29:57 GMT+0000 (Greenwich Mean Time) */ export const __version = '2.7.3'; -export const __timestamp = '2022-01-15T16:52:28.988Z'; +export const __timestamp = '2022-01-22T09:29:57.819Z'; //buildRoutes import { buildClientTree } from '@roxi/routify/runtime/buildRoutes'; diff --git a/public/index.html b/public/index.html index 420e8ef4..650f0593 100644 --- a/public/index.html +++ b/public/index.html @@ -1,18 +1,19 @@ - - - - + + + Enki - - - - - - + + + + + + - - - \ No newline at end of file + + diff --git a/src/components/Breadcrumbs/Breadcrumbs.svelte b/src/components/Breadcrumbs/Breadcrumbs.svelte index 09051428..7f1c4de4 100644 --- a/src/components/Breadcrumbs/Breadcrumbs.svelte +++ b/src/components/Breadcrumbs/Breadcrumbs.svelte @@ -22,6 +22,7 @@ Name: 'Shop', ParentId: 0, Children: [], + NominalCode: '', }; onMount(async () => { diff --git a/src/components/Breadcrumbs/Breadcrumbs.test.ts b/src/components/Breadcrumbs/Breadcrumbs.test.ts index 5f8b7ca5..3223b102 100644 --- a/src/components/Breadcrumbs/Breadcrumbs.test.ts +++ b/src/components/Breadcrumbs/Breadcrumbs.test.ts @@ -32,12 +32,14 @@ describe('GIVEN Breadcrumbs', () => { Id: 123, ParentId: null, Name: 'Clothes', + NominalCode: '', Children: [ { Id: 456, ParentId: 123, Name: 'Adult Clothes', Chlidren: [], + NominalCode: '', }, ], }, @@ -65,11 +67,13 @@ describe('GIVEN Breadcrumbs', () => { Id: 123, ParentId: null, Name: 'Clothes', + NominalCode: '', Children: [ { Id: 456, ParentId: 123, Name: 'Adult Clothes', + NominalCode: '', Children: [], }, ], diff --git a/src/components/CategoryView/CategoryView.svelte b/src/components/CategoryView/CategoryView.svelte index 3e7a95da..f3e03920 100644 --- a/src/components/CategoryView/CategoryView.svelte +++ b/src/components/CategoryView/CategoryView.svelte @@ -55,6 +55,9 @@ } }; + const removeVariantCategories = (categories: Category[]) => + categories.filter((cat) => cat.NominalCode === 'TRUE'); + onMount(async () => { categoryToShow = isValidCategoryStore ? showCategory(categoryId, Object.assign({}, $categories)) @@ -70,21 +73,27 @@ }); $: categoryToShow = showCategory(categoryId, Object.assign({}, $categories)); + $: variantCategories = categoryToShow?.Children.filter( + (cat) => cat.NominalCode === null + ); {#if categoryToShow} - {#if categoryToShow.Children.length} + {#if removeVariantCategories(categoryToShow.Children).length} {#if categoryToShow.Id === 1875997 || categoryToShow.Id === 1875998} {:else} - + {/if} {/if} - + {/if}

{categoryToShow?.Id || 'no "categoryToShow" from CategoryView'}

diff --git a/src/components/CategoryView/CategoryView.test.ts b/src/components/CategoryView/CategoryView.test.ts index 84ea0bcf..7c58dfb2 100644 --- a/src/components/CategoryView/CategoryView.test.ts +++ b/src/components/CategoryView/CategoryView.test.ts @@ -13,21 +13,25 @@ const nestedCategories = { Id: -1, ParentId: null, Name: '', + NominalCode: 'TRUE', Children: [ { Id: 123, ParentId: null, Name: 'Clothes', + NominalCode: 'TRUE', Children: [ { Id: 456, ParentId: null, Name: 'Shoes', + NominalCode: 'TRUE', Children: [ { Id: 789, ParentId: null, Name: 'Hats', + NominalCode: 'TRUE', Children: [], }, ], @@ -59,6 +63,7 @@ describe('GIVEN CategoryView', () => { ParentId: null, Name: '', Children: [], + NominalCode: '', }); }); }); @@ -70,6 +75,7 @@ describe('GIVEN CategoryView', () => { ParentId: null, Name: 'Clothes', Children: [], + NominalCode: 'TRUE', }); render(CategoryView, { @@ -82,6 +88,7 @@ describe('GIVEN CategoryView', () => { ParentId: null, Name: 'Clothes', Children: [], + NominalCode: 'TRUE', }); expect(refreshCategory).toHaveBeenCalledTimes(0); expect(screen.getByRole('heading')).toHaveTextContent('123'); @@ -95,6 +102,7 @@ describe('GIVEN CategoryView', () => { ParentId: null, Name: 'Shoes', Children: [], + NominalCode: 'TRUE', }, ]); @@ -108,6 +116,7 @@ describe('GIVEN CategoryView', () => { ParentId: null, Name: '', Children: [], + NominalCode: '', }); expect(refreshCategory).toHaveBeenCalledTimes(1); await tick(); // using tick helps to flush any state changes in the component @@ -118,6 +127,7 @@ describe('GIVEN CategoryView', () => { Name: 'Shoes', ParentId: null, Children: [], + NominalCode: 'TRUE', }); expect(screen.getByRole('heading')).toHaveTextContent('456'); cleanup(); diff --git a/src/components/HexGrid/HexGrid.test.ts b/src/components/HexGrid/HexGrid.test.ts index c04a3b7f..d229b091 100644 --- a/src/components/HexGrid/HexGrid.test.ts +++ b/src/components/HexGrid/HexGrid.test.ts @@ -11,6 +11,7 @@ const mockData: Category[] = [ Name: 'Elephant', ParentId: null, Children: [], + NominalCode: '', }, ]; diff --git a/src/components/ProductView/ProductView.svelte b/src/components/ProductView/ProductView.svelte index 451bd05f..a72c39e6 100644 --- a/src/components/ProductView/ProductView.svelte +++ b/src/components/ProductView/ProductView.svelte @@ -2,10 +2,13 @@ import { groupBy } from 'lodash-es'; import { fade } from 'svelte/transition'; import { calcShowGrid } from '@/libs/gridCalc'; + import VariantCategory from '../VariantCategory/VariantCategory.svelte'; import SingleProduct from '@/components/SingleProduct/SingleProduct.svelte'; + import type { Category } from '@/types/category'; import type { Product } from '@/types/product'; export let productArr: readonly Product[] = []; + export let variantCategories: readonly Category[] = []; export let showDetailedView = false; let variantArr: readonly Product[] = []; @@ -16,6 +19,8 @@ groupBy(variantArr, 'VariantGroupId') ); + $: variantCategoryIds = variantCategories.map((cat) => cat.Id); + $: if (productArr.length) { variantArr = productArr.filter(({ VariantGroupId }) => !!VariantGroupId); nonVariantArr = productArr.filter(({ VariantGroupId }) => !VariantGroupId); @@ -30,10 +35,17 @@ ? 'detailed-products-container' : 'products-container'} > + {#if variantCategories.length} + {#each variantCategories as variantCategory (variantCategory.Id)} + + {/each} + {/if} {#if variantArr.length} {#each groupedVariantProducts as variants (variants)} {#each variants as variant (variant)} - + {#if !variantCategoryIds.includes(variant.CategoryId)} + + {/if} {/each} {/each} {/if} diff --git a/src/components/ProductsInCategory/ProductsInCategory.svelte b/src/components/ProductsInCategory/ProductsInCategory.svelte index 26fa4741..c032a17f 100644 --- a/src/components/ProductsInCategory/ProductsInCategory.svelte +++ b/src/components/ProductsInCategory/ProductsInCategory.svelte @@ -3,11 +3,13 @@ import { refreshProducts } from '@/libs/requests'; import type { Product } from '@/types/product'; + import type { Category } from '@/types/category'; export let categoryId: number; - export let productArr: readonly Product[] = []; + export let variantCategories: readonly Category[] = []; export let showDetailedView = false; + let productArr: readonly Product[] = []; const productObj: { [key: string]: { isEmpty: boolean } } = {}; const refreshProductsArr = async ( @@ -46,6 +48,6 @@ $: refreshProductView(productArr, categoryId); -{#if categoryId && productArr.length && !productObj?.[categoryId]?.isEmpty} - +{#if categoryId && ((productArr.length && !productObj?.[categoryId]?.isEmpty) || variantCategories.length)} + {/if} diff --git a/src/components/ProductsInCategory/ProductsInCategory.test.ts b/src/components/ProductsInCategory/ProductsInCategory.test.ts index 48a11b3f..128e2d80 100644 --- a/src/components/ProductsInCategory/ProductsInCategory.test.ts +++ b/src/components/ProductsInCategory/ProductsInCategory.test.ts @@ -45,29 +45,6 @@ describe('GIVEN ProductsInCategory', () => { ).toBeInTheDocument(); cleanup(); }); - - it("THEN display the products which are passed in as a prop AND don't call the api", async () => { - render(ProductsInCategory, { - categoryId: 2, - productArr: [ - { - Name: 'Silver ring', - Id: 456, - CategoryId: 2, - Description: '', - SalePrice: '2000', - ProductImages: [], - ProductTags: [], - VariantGroupId: 0, - CurrentStock: 0, - }, - ], - }); - expect(refreshProducts).toHaveBeenCalledTimes(0); - expect( - await screen.findByRole('heading', { level: 3, name: /silver ring/i }) - ).toBeInTheDocument(); - }); }); }); }); diff --git a/src/components/SingleProduct/SingleProduct.svelte b/src/components/SingleProduct/SingleProduct.svelte index 6a73df23..6e9f889e 100644 --- a/src/components/SingleProduct/SingleProduct.svelte +++ b/src/components/SingleProduct/SingleProduct.svelte @@ -5,11 +5,25 @@ import ImageLoader from '@/components/Image/ImageLoader.svelte'; import type { Product } from '@/types/product'; + import type { Category } from '@/types/category'; - export let product: Product; + export let variantCategory: Category | null = null; + export let product: Product | null; export let showDetailedView = false; +{#if variantCategory} + +{/if} + {#if product} {#if showDetailedView}
+ import { goto } from '@roxi/routify'; + import ImageLoader from '@/components/Image/ImageLoader.svelte'; + import type { Category } from '@/types/category'; + + export let variantCategory: Category; + + +

{JSON.stringify(variantCategory)}

+ + diff --git a/src/stores/categories.ts b/src/stores/categories.ts index 0548fb54..dc08dac2 100644 --- a/src/stores/categories.ts +++ b/src/stores/categories.ts @@ -6,6 +6,7 @@ const initialValue = { ParentId: null, Name: '', Children: [], + NominalCode: '', }; export const categories = writable(initialValue); diff --git a/src/types/category.d.ts b/src/types/category.d.ts index 6aa66de6..75c7e529 100644 --- a/src/types/category.d.ts +++ b/src/types/category.d.ts @@ -3,4 +3,5 @@ import type { Base } from '@/types/base'; export interface Category extends Base { ParentId: number | null; Children: Category[]; + NominalCode: string; }