@ikas/storefront-providers 4.0.0-alpha.85 → 4.0.0-alpha.9

package/{build/models/ui/index.d.ts → src/models/ui/index.ts}

@@ -1,12 +1,12 @@
-export * from "./blog-category-list";
-export * from "./blog-list";
-export * from "./brand-list";
-export * from "./category-list";
-export * from "./component-renderer";
-export * from "./customer-review-list";
-export * from "./customer-review-summary-list";
-export * from "./navigation-link";
-export * from "./product-attribute-detail";
-export * from "./product-attribute-list";
-export * from "./product-list";
-export * from "./raffle-list";
+export * from "./blog-category-list";
+export * from "./blog-list";
+export * from "./brand-list";
+export * from "./category-list";
+export * from "./component-renderer";
+export * from "./customer-review-list";
+export * from "./customer-review-summary-list";
+export * from "./navigation-link";
+export * from "./product-attribute-detail";
+export * from "./product-attribute-list";
+export * from "./product-list";
+export * from "./raffle-list";

package/src/models/ui/navigation-link/index.ts

@@ -0,0 +1,7 @@
+export type IkasNavigationLink = {
+  href: string;
+  label: string;
+  subLinks: IkasNavigationLink[];
+  isExternal?: boolean | null;
+  itemId?: string;
+};

package/src/models/ui/product-attribute-detail/index.ts

@@ -0,0 +1,7 @@
+import { IkasProduct } from "@ikas/storefront-models";
+import { IkasAttributePropValue } from "../../prop-value/attribute";
+
+export type IkasProductAttributeDetail = {
+  productDetail: IkasProduct | null;
+  attributePropValue: IkasAttributePropValue;
+};

package/src/models/ui/product-attribute-list/index.ts

@@ -0,0 +1,7 @@
+import { IkasProduct } from "@ikas/storefront-models";
+import { IkasAttributeListPropValue } from "../../prop-value/attribute-list";
+
+export type IkasAttributeList = {
+  productDetail: IkasProduct | null;
+  attributeListPropValue: IkasAttributeListPropValue;
+};

package/src/models/ui/product-list/index.ts

@@ -0,0 +1,80 @@
+import {
+  IkasBrand,
+  IkasCategory,
+  IkasFilterCategory,
+  IkasProduct,
+  IkasProductFilter,
+  IkasThemeJsonPageType,
+} from "@ikas/storefront-models";
+import { IkasRelatedProductProps } from "../../../providers/prop-value/product-list";
+import { IkasProductListPropValue } from "../../prop-value/product-list";
+
+export type IkasProductList = {
+  data: IkasProduct[];
+  filters: IkasProductFilter[] | null;
+  filterCategories?: IkasFilterCategory[] | null;
+  type: IkasProductListType;
+  pageType: IkasThemeJsonPageType;
+  sort: IkasProductListSortType;
+  limit: number;
+  page: number;
+  infiniteScrollPage: number | null;
+  count: number;
+  searchKeyword?: string;
+  initialized?: boolean;
+  minPage?: number | null;
+  productListPropValue: IkasProductListPropValue;
+
+  filterBrandId?: string | null;
+  filterCategoryId?: string | null;
+  relatedProductData?: IkasRelatedProductProps | null;
+  pageSpecificData: IkasCategory | IkasBrand | null;
+
+  recommendFor?: string | null; // productId
+  isLoading?: boolean;
+  fetchRequestTime?: number;
+};
+
+export enum IkasProductListType {
+  ALL = "ALL",
+  STATIC = "STATIC",
+  DISCOUNTED = "DISCOUNTED",
+  RECOMMENDED = "RECOMMENDED",
+  CATEGORY = "CATEGORY",
+  SEARCH = "SEARCH",
+  LAST_VIEWED = "LAST_VIEWED",
+  RELATED_PRODUCTS = "RELATED_PRODUCTS",
+}
+
+export enum IkasProductListSortType {
+  INCREASING_PRICE = "INCREASING_PRICE",
+  DECREASING_PRICE = "DECREASING_PRICE",
+  LAST_ADDED = "LAST_ADDED",
+  FIRST_ADDED = "FIRST_ADDED",
+  INCREASING_DISCOUNT = "INCREASING_DISCOUNT",
+  DECRASING_DISCOUNT = "DECRASING_DISCOUNT",
+  FEATURED = "FEATURED",
+}
+
+export enum IkasRelatedProductsType {
+  CATEGORY = "CATEGORY",
+  BRAND = "BRAND",
+}
+
+export enum IkasProductSearchShowStockOption {
+  HIDE_OUT_OF_STOCK = "HIDE_OUT_OF_STOCK",
+  SHOW_ALL = "SHOW_ALL",
+  SHOW_OUT_OF_STOCK_AT_END = "SHOW_OUT_OF_STOCK_AT_END",
+}
+
+export type Facet = {
+  id: string;
+  values: FacetValue[];
+};
+
+export type FacetValue = {
+  id: string;
+  count: number;
+};
+
+export type { IkasRelatedProductProps };

package/src/models/ui/product-list/init.ts

@@ -0,0 +1,407 @@
+import { IkasCategoryProductsOrderType } from "@ikas/storefront-models";
+import {
+  IkasProduct,
+  IkasProductFacetInput,
+  IkasProductFilterValue,
+  IkasThemeJsonPageType,
+} from "@ikas/storefront-models";
+import _debounce from "lodash/debounce";
+import {
+  IkasProductList,
+  IkasProductListSortType,
+  IkasProductListType,
+} from "../product-list";
+import { IkasProductFilterFunctions } from "@ikas/storefront-model-functions";
+import {
+  SearchInputOrderByInput,
+  SortByDirectionEnum,
+  SortByTypeEnum,
+} from "@ikas/storefront-api";
+import {
+  getProductFilterData,
+  getRelatedProducts,
+  searchProducts,
+} from "@ikas/storefront-api";
+import { IkasStorefrontConfig } from "@ikas/storefront-config";
+import { Facet, IkasProductSearchShowStockOption } from "..";
+
+export async function getInitial(
+  list: IkasProductList,
+  isInfiteScrollReturn?: boolean
+) {
+  setPageSpecificSort(list);
+  list.isLoading = true;
+
+  const fetchRequestTime = Date.now();
+  list.fetchRequestTime = fetchRequestTime;
+
+  try {
+    let page: number | undefined = isInfiteScrollReturn ? list.page : 1;
+    let limit: number | undefined = list.limit;
+
+    if (isFilterable(list) && !list.filters) {
+      await getFilters(list);
+    }
+
+    if (isSearch(list)) {
+      list.data = [];
+      list.page = 1;
+      list.minPage = 1;
+      list.count = 0;
+      list.initialized = true;
+      return true;
+    }
+
+    let productIdList: string[] | undefined;
+
+    if (isStatic(list)) {
+      page = undefined;
+      limit = 200;
+    } else if (isDiscounted(list)) {
+      page = 1;
+      limit = 10;
+    } else if (isRecommended(list)) {
+      page = 1;
+      limit = 10;
+    } else if (isLastViewed(list)) {
+      return;
+    }
+
+    const response = await _searchProducts(
+      list,
+      page || 1,
+      limit || 10,
+      productIdList
+    );
+    if (!response || list.fetchRequestTime !== fetchRequestTime) return;
+
+    let data: IkasProduct[] = [];
+
+    if (isLastViewed(list)) return;
+
+    if (isStatic(list)) {
+      const idList = list.productListPropValue.productIds || [];
+
+      data =
+        (idList
+          ?.map((pID) => {
+            const product = response.data?.data?.find(
+              (p) => p.id === pID.productId
+            );
+            let variant = product?.variants.find((v) => v.id === pID.variantId);
+
+            if (!variant?.isActive) {
+              variant = product?.variants.find((v) => v.isActive);
+            }
+
+            if (product && variant) {
+              const _product: IkasProduct = {
+                ...product,
+                //@ts-ignore
+                selectedVariantValues: variant.variantValues,
+              };
+              return _product;
+            }
+          })
+          .filter((p) => !!p) as IkasProduct[]) || [];
+    } else {
+      data =
+        response.data?.data?.map((product) => {
+          const selectedVariant = product.variants.find((v) => v.isActive);
+          const _product: IkasProduct = {
+            ...product,
+            //@ts-ignore
+            selectedVariantValues: (selectedVariant || product.variants[0])
+              .variantValues,
+          };
+
+          return _product;
+        }) || [];
+    }
+
+    applyFacets(list, response.data?.facets);
+
+    list.data = data;
+    list.count = response.data?.count || 0;
+    list.initialized = true;
+    list.page = page || 1;
+    list.minPage = list.page;
+
+    return true;
+  } catch (err) {
+    console.error(err);
+  }
+}
+
+function setPageSpecificSort(list: IkasProductList) {
+  if (
+    list.pageSpecificData?.orderType &&
+    [IkasProductListType.ALL, IkasProductListType.CATEGORY].includes(list.type)
+  ) {
+    switch (list.pageSpecificData.orderType) {
+      case IkasCategoryProductsOrderType.HIGHEST_DISCOUNT_RATIO:
+        list.sort = IkasProductListSortType.DECRASING_DISCOUNT;
+        break;
+
+      case IkasCategoryProductsOrderType.LOWEST_DISCOUNT_RATIO:
+        list.sort = IkasProductListSortType.INCREASING_DISCOUNT;
+        break;
+
+      case IkasCategoryProductsOrderType.HIGHEST_PRICE:
+        list.sort = IkasProductListSortType.DECREASING_PRICE;
+        break;
+
+      case IkasCategoryProductsOrderType.LOWEST_PRICE:
+        list.sort = IkasProductListSortType.INCREASING_PRICE;
+        break;
+
+      case IkasCategoryProductsOrderType.NEWEST:
+        list.sort = IkasProductListSortType.LAST_ADDED;
+        break;
+
+      case IkasCategoryProductsOrderType.OLDEST:
+        list.sort = IkasProductListSortType.FIRST_ADDED;
+        break;
+
+      case IkasCategoryProductsOrderType.MANUALLY:
+        list.sort = IkasProductListSortType.FEATURED;
+        break;
+
+      default:
+        break;
+    }
+  }
+}
+
+function isFilterable(list: IkasProductList) {
+  return (
+    list.type === IkasProductListType.ALL ||
+    list.type === IkasProductListType.CATEGORY
+  );
+}
+
+function isStatic(list: IkasProductList) {
+  return list.type === IkasProductListType.STATIC;
+}
+
+function isDiscounted(list: IkasProductList) {
+  return list.type === IkasProductListType.DISCOUNTED;
+}
+
+function isRecommended(list: IkasProductList) {
+  return list.type === IkasProductListType.RECOMMENDED;
+}
+
+function isLastViewed(list: IkasProductList) {
+  return list.type === IkasProductListType.LAST_VIEWED;
+}
+
+function isRelatedProducts(list: IkasProductList) {
+  return list.type === IkasProductListType.RELATED_PRODUCTS;
+}
+
+function isSearch(list: IkasProductList) {
+  return list.type === IkasProductListType.SEARCH;
+}
+
+function getSortParams(
+  list: IkasProductList
+): SearchInputOrderByInput | undefined {
+  let direction: SortByDirectionEnum | undefined = SortByDirectionEnum.DESC;
+  let type: SortByTypeEnum = SortByTypeEnum.CREATED_AT;
+
+  switch (list.sort) {
+    case IkasProductListSortType.INCREASING_PRICE:
+      direction = SortByDirectionEnum.ASC;
+      type = SortByTypeEnum.PRICE;
+      break;
+
+    case IkasProductListSortType.DECREASING_PRICE:
+      direction = SortByDirectionEnum.DESC;
+      type = SortByTypeEnum.PRICE;
+      break;
+
+    case IkasProductListSortType.FIRST_ADDED:
+      direction = SortByDirectionEnum.ASC;
+      type = SortByTypeEnum.CREATED_AT;
+      break;
+
+    case IkasProductListSortType.LAST_ADDED:
+      direction = SortByDirectionEnum.DESC;
+      type = SortByTypeEnum.CREATED_AT;
+      break;
+
+    case IkasProductListSortType.INCREASING_DISCOUNT:
+      direction = SortByDirectionEnum.ASC;
+      type = SortByTypeEnum.DISCOUNT_RATIO;
+      break;
+
+    case IkasProductListSortType.DECRASING_DISCOUNT:
+      direction = SortByDirectionEnum.DESC;
+      type = SortByTypeEnum.DISCOUNT_RATIO;
+      break;
+
+    case IkasProductListSortType.FEATURED:
+      if (!isSearch(list)) {
+        direction = SortByDirectionEnum.ASC;
+        type = SortByTypeEnum.MANUAL_SORT;
+      } else {
+        return;
+      }
+      break;
+
+    default:
+      break;
+  }
+
+  return {
+    direction,
+    type,
+  };
+}
+
+async function _searchProducts(
+  list: IkasProductList,
+  page: number,
+  limit: number,
+  productIdList?: string[]
+) {
+  const filterList: IkasProductFilterValue[] = [];
+  const facetList: IkasProductFacetInput[] = [];
+  const { getValueList } = IkasProductFilterFunctions;
+
+  list.filters?.forEach((filter) => {
+    const valueList = getValueList(filter);
+    if (valueList.length) {
+      filterList.push({
+        id: filter.id,
+        type: filter.type,
+        displayType: filter.displayType,
+        valueList: valueList,
+      });
+    }
+
+    if (filter.isFacetFilter) {
+      facetList.push({
+        id: filter.id,
+        type: filter.type,
+        displayType: filter.displayType,
+      });
+    }
+  });
+
+  const selectedCategoryIds = list.filterCategories
+    ?.filter((fc) => fc.isSelected)
+    .map((fc) => fc.id);
+
+  const sortParams = getSortParams(list);
+
+  if (isRelatedProducts(list)) {
+    if (list.relatedProductData) {
+      return await getRelatedProducts({
+        priceListId: IkasStorefrontConfig.getPriceListId(),
+        salesChannelId: IkasStorefrontConfig.getSalesChannelId(),
+        productId: list.relatedProductData.productId,
+        brandIds: list.relatedProductData.brandIds,
+        categoryIds: list.relatedProductData.categoryIds,
+      });
+    }
+  }
+
+  return await searchProducts({
+    input: {
+      page,
+      perPage: limit,
+      productIdList: isStatic(list)
+        ? list.productListPropValue.productIds?.map((p) => p.productId)
+        : productIdList,
+      filterList: filterList as any,
+      facetList: facetList as any,
+      brandId:
+        list.pageType === IkasThemeJsonPageType.BRAND &&
+        list.type !== IkasProductListType.SEARCH
+          ? list.filterBrandId
+          : undefined,
+      categoryIdList:
+        selectedCategoryIds && selectedCategoryIds.length
+          ? selectedCategoryIds
+          : list.filterCategoryId
+          ? [list.filterCategoryId]
+          : undefined,
+      priceListId: IkasStorefrontConfig.getPriceListId(),
+      salesChannelId: IkasStorefrontConfig.getSalesChannelId(),
+      query: list.searchKeyword,
+      order:
+        list.type === IkasProductListType.SEARCH
+          ? null
+          : sortParams
+          ? [sortParams]
+          : null,
+      showStockOption:
+        (IkasStorefrontConfig.getStockPreference() as any) ||
+        IkasProductSearchShowStockOption.SHOW_ALL,
+    },
+  });
+}
+
+async function getFilters(list: IkasProductList) {
+  const getFiltersResponse = await getProductFilterData({
+    categoryId: list.filterCategoryId ? list.filterCategoryId : undefined,
+  });
+
+  list.filters = getFiltersResponse?.data?.filters || null;
+  list.filterCategories = getFiltersResponse?.data?.categories || null;
+
+  if (
+    list.pageType !== IkasThemeJsonPageType.CATEGORY &&
+    list.filterCategoryId
+  ) {
+    const filterCategory = list.filterCategories?.find(
+      (fc) => fc.id === list.filterCategoryId
+    );
+    if (filterCategory) filterCategory.isSelected = true;
+  }
+
+  if (list.filters)
+    list.filters.sort((f1, f2) => (f1.order > f2.order ? 1 : -1));
+}
+
+function applyFacets(
+  list: IkasProductList,
+  facets: Facet[] | undefined | null
+) {
+  const { isCustomValueFilter } = IkasProductFilterFunctions;
+  list.filters?.forEach((filter) => {
+    const facet = facets?.find((f) => f.id === filter.id);
+
+    if (facet) {
+      filter.values?.forEach((filterValue) => {
+        const facetValue = facet.values.find(
+          (facetValue) => facetValue.id === filterValue.id
+        );
+        if (facetValue) filterValue.resultCount = facetValue.count;
+        else if (isCustomValueFilter(filter)) filterValue.resultCount = null;
+        else filterValue.resultCount = 0;
+      });
+    } else if (isCustomValueFilter(filter)) {
+      filter.values?.forEach((v) => (v.resultCount = null));
+    } else {
+      filter.values?.forEach((v) => (v.resultCount = 0));
+    }
+  });
+
+  // Category facets
+  const categoryFacet = facets?.find((f) => f.id === "category");
+  if (categoryFacet) {
+    list.filterCategories?.forEach((filterCategory) => {
+      const facetValue = categoryFacet.values.find(
+        (fv) => fv.id === filterCategory.id
+      );
+      if (facetValue) {
+        filterCategory.resultCount = facetValue.count;
+      } else {
+        filterCategory.resultCount = 0;
+      }
+    });
+  }
+}

package/src/models/ui/raffle-list/index.ts

@@ -0,0 +1,17 @@
+import { IkasRaffle } from "@ikas/storefront-models";
+
+export type IkasRaffleList = {
+  data: IkasRaffle[];
+  limit: number;
+  page: number;
+  count: number;
+  initialized?: boolean;
+  minPage?: number | null;
+  start?: number | null;
+  end?: number | null;
+  includeDeleted?: boolean | null;
+  name?: string | null;
+  search?: string | null;
+  id?: string | null;
+  isLoading?: boolean;
+};

package/src/models/ui/raffle-list/init.ts

@@ -0,0 +1,44 @@
+import { listRaffle } from "@ikas/storefront-api";
+import { IkasRaffleList } from ".";
+import { populateRaffleProducts } from "../../../providers/helpers/raffle";
+
+export async function getInitial(list: IkasRaffleList) {
+  if (list.isLoading) return;
+  list.isLoading = true;
+
+  try {
+    const response = await getRaffleList(list, list.page, list.limit);
+
+    list.data = response.data?.data || [];
+    list.count = response.data?.count || 0;
+    list.initialized = true;
+    list.minPage = list.page;
+  } catch (err) {
+    console.log(err);
+  } finally {
+    list.isLoading = false;
+  }
+}
+
+async function getRaffleList(
+  list: IkasRaffleList,
+  page: number,
+  limit: number
+) {
+  const response = await listRaffle({
+    start: list.start ? { eq: list.start } : undefined,
+    end: list.end ? { eq: list.end } : undefined,
+    includeDeleted: list.includeDeleted || false,
+    name: list.name ? { eq: list.name } : undefined,
+    id: list.id ? { eq: list.id } : undefined,
+    search: list.search || undefined,
+    pagination: {
+      limit,
+      page,
+    },
+  });
+
+  await populateRaffleProducts(response.data?.data || []);
+
+  return response;
+}

package/src/providers/helpers/raffle.ts

@@ -0,0 +1,69 @@
+import { listProductOptionSet, searchProducts } from "@ikas/storefront-api";
+import { IkasRaffle } from "@ikas/storefront-models";
+
+export const populateRaffleProducts = async (raffles: IkasRaffle[]) => {
+  const productIds: string[] = [];
+  for (const raffle of raffles) {
+    raffle.variants?.forEach((v) => {
+      if (!productIds.find((id) => id === v.productId)) {
+        productIds.push(v.productId);
+      }
+    });
+  }
+
+  const productSearchResponse = await searchProducts({
+    input: {
+      productIdList: productIds,
+      // priceListId: IkasStorefrontConfig.priceListId,
+      // salesChannelId: IkasStorefrontConfig.salesChannelId,
+    },
+  });
+
+  if (productSearchResponse.isSuccess) {
+    const productList = productSearchResponse.data?.data || [];
+
+    if (productList.length) {
+      const productOptionSetIds = productList
+        .map((p) => p.productOptionSetId)
+        .filter((id) => !!id) as string[];
+
+      const productOptionSetsResponse = await listProductOptionSet({
+        id: { in: productOptionSetIds },
+      });
+      const productOptionSets = productOptionSetsResponse.data;
+
+      raffles.forEach((raffle) => {
+        raffle.variants?.forEach((variant) => {
+          const product = productList.find(
+            (product) => variant.productId === product.id
+          );
+
+          if (product) {
+            //@ts-ignore
+            product.productOptionSet = productOptionSets?.find(
+              (pos) => pos.id === product.productOptionSetId
+            );
+
+            const selectedVariant =
+              product.variants.find(
+                (v) => v.isActive && variant.variantId === v.id
+              ) || product.variants[0];
+
+            const _raffleProduct = raffle.products.find(
+              (p) => p.id === product.id
+            );
+
+            if (!_raffleProduct) {
+              //@ts-ignore
+              product.selectedVariantValues = selectedVariant.variantValues;
+              product.variants = product.variants.filter((v) =>
+                raffle.variants?.find((_v) => _v.variantId === v.id)
+              );
+              raffle.products.push(product);
+            }
+          }
+        });
+      });
+    }
+  }
+};