@ikas/storefront 4.0.0-alpha.50 → 4.0.0-alpha.52

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

@@ -1,1007 +0,0 @@
-import { makeAutoObservable } from "mobx";
-import { NextRouter } from "next/router.js";
-import _debounce from "lodash/debounce";
-import {
-  IkasBrand,
-  IkasProduct,
-  IkasProductFilter,
-  IkasFilterCategory,
-  IkasThemeJsonPageType,
-  IkasCategory,
-  IkasProductFilterValue,
-  IkasProductFacetInput,
-} from "../../../models/data";
-import ProductStore from "../../../store/product";
-import {
-  IkasProductListPropValue,
-  IkasRelatedProductProps,
-} from "@ikas/storefront-providers";
-import querystring from "query-string";
-import {
-  IkasCategoryProductsOrderType,
-  IkasThemeJsonStockPreference,
-} from "@ikas/storefront-models";
-import {
-  SearchInputOrderByInput,
-  SortByDirectionEnum,
-  SortByTypeEnum,
-} from "@ikas/storefront-api";
-import { IkasStorefrontConfig } from "@ikas/storefront-config";
-import { IkasBaseStore } from "../../..";
-import { Analytics } from "../../../analytics";
-
-export class IkasProductList {
-  data: IkasProduct[];
-  filters?: IkasProductFilter[] | null = null;
-  private _filterCategories?: IkasFilterCategory[] | null = null;
-  private _type: IkasProductListType;
-  private _pageType: IkasThemeJsonPageType;
-  private _sort: IkasProductListSortType;
-  private _limit: number;
-  private _page: number;
-  private _infiniteScrollPage: number | null = null;
-  private _count: number;
-  private _searchKeyword: string;
-  private _initialized = false;
-  private _minPage?: number | null = null;
-  private _productListPropValue: IkasProductListPropValue;
-
-  private _filterBrandId?: string | null = null;
-  private _filterCategoryId?: string | null = null;
-  private _relatedProductData?: IkasRelatedProductProps | null = null;
-  private pageSpecificData?: IkasCategory | IkasBrand | null = null;
-
-  private _recommendFor?: string | null = null; // productId
-  private _isLoading = false;
-  private _fetchRequestTime = 0;
-  private router?: NextRouter | null = null;
-
-  constructor(
-    data: IkasProductListParams | IkasProductList,
-    router?: NextRouter
-  ) {
-    const _params = data as IkasProductListParams;
-    const _list = data as IkasProductList;
-
-    this.data = data.data ? data.data.map((d) => new IkasProduct(d)) : [];
-    this._type =
-      _params.type ||
-      _list._type ||
-      _params.productListPropValue.productListType ||
-      _list._productListPropValue.productListType ||
-      IkasProductListType.ALL;
-    this._pageType = data.pageType;
-    this._sort =
-      data.sort ||
-      data.productListPropValue.initialSort ||
-      IkasProductListSortType.LAST_ADDED;
-    this._limit =
-      data.limit ||
-      _params.productListPropValue.initialLimit ||
-      _list._productListPropValue.initialLimit ||
-      20;
-    this._page = data.page || 1;
-    this._minPage = data.minPage || null;
-    this._count = data.count || 0;
-    this._searchKeyword = data.searchKeyword || "";
-    this._productListPropValue =
-      _params.productListPropValue || _list._productListPropValue;
-
-    this._filterBrandId = _params.filterBrandId || _list._filterBrandId || null;
-    this._filterCategoryId =
-      _params.filterCategoryId || _list._filterCategoryId || null;
-
-    this._relatedProductData =
-      _params.relatedProductData || _list._relatedProductData || null;
-
-    this._recommendFor = _params.recommendFor || _list._recommendFor;
-
-    this.filters = data.filters
-      ? data.filters.map((f) => new IkasProductFilter(f, this))
-      : null;
-    this._filterCategories = data.filterCategories
-      ? data.filterCategories.map((c) => new IkasFilterCategory(c))
-      : null;
-    this.pageSpecificData =
-      _params.pageSpecificData || _list.pageSpecificData || null;
-
-    this.router = router;
-
-    makeAutoObservable(this);
-
-    this.setPageSpecificSort();
-
-    if (this.isBrowser()) {
-      this.restoreInfiniteScrollPage();
-
-      if (
-        location.search &&
-        (this.isFilterable || this._type === IkasProductListType.SEARCH)
-      ) {
-        const queryParams = this.getQueryParams();
-        this.getInitial(queryParams, this._page > 1);
-      } else if (this._page > 1) {
-        this.getInitial(undefined, true);
-      } else if (this.isLastViewed) {
-        this.getInitial();
-      } else {
-        this.handleListingEvent();
-      }
-    }
-  }
-
-  get sort() {
-    return this._sort;
-  }
-
-  get limit() {
-    return this._limit;
-  }
-
-  get pageType() {
-    return this._pageType;
-  }
-
-  get page() {
-    return this._page;
-  }
-
-  get minPage() {
-    return this._minPage || 1;
-  }
-
-  get count() {
-    return this._count;
-  }
-
-  get pageCount() {
-    return Math.ceil(this._count / this._limit);
-  }
-
-  get searchKeyword() {
-    return this._searchKeyword;
-  }
-
-  set searchKeyword(value: string) {
-    if (value === this._searchKeyword) return;
-    this._searchKeyword = value;
-    this.searchDebouncer();
-    this.searchAnalyticsDebouncer();
-  }
-
-  get isInitialized() {
-    return this._initialized;
-  }
-
-  get isFilterable() {
-    return (
-      this._type === IkasProductListType.ALL ||
-      this._type === IkasProductListType.CATEGORY
-    );
-  }
-
-  get isFiltered() {
-    return (
-      this.filters?.some((f) => !!f.valueList.length) ||
-      !!this._searchKeyword ||
-      (this._pageType !== IkasThemeJsonPageType.CATEGORY &&
-        (!!this._filterCategoryId ||
-          this._filterCategories?.some((fc) => fc.isSelected)))
-    );
-  }
-
-  get isStatic() {
-    return this._type === IkasProductListType.STATIC;
-  }
-
-  get isDiscounted() {
-    return this._type === IkasProductListType.DISCOUNTED;
-  }
-
-  get isRecommended() {
-    return this._type === IkasProductListType.RECOMMENDED;
-  }
-
-  get isLastViewed() {
-    return this._type === IkasProductListType.LAST_VIEWED;
-  }
-
-  get isRelatedProducts() {
-    return this._type === IkasProductListType.RELATED_PRODUCTS;
-  }
-
-  get isSearch() {
-    return this._type === IkasProductListType.SEARCH;
-  }
-
-  get hasPrev() {
-    if (
-      this.isStatic ||
-      this.isDiscounted ||
-      this.isRecommended ||
-      !this._minPage
-    )
-      return false;
-    return this._minPage > 1;
-  }
-
-  get hasNext() {
-    if (this.isStatic || this.isDiscounted || this.isRecommended) return false;
-    return this.page * this.limit < this.count;
-  }
-
-  get isLoading() {
-    return this._isLoading;
-  }
-
-  get filterQueryParams() {
-    const queryParams: Record<string, any> = {};
-
-    this.filters?.forEach((f) => {
-      if (f.keyList.length) queryParams[f.key] = f.keyList;
-    });
-
-    if (this._searchKeyword) queryParams.s = this._searchKeyword;
-    if (this._infiniteScrollPage) queryParams.page = this._infiniteScrollPage;
-    if (this._pageType !== IkasThemeJsonPageType.CATEGORY) {
-      const selectedCategories = this.filterCategories?.filter(
-        (fc) => fc.isSelected
-      );
-      const hasSelectedCategory = !!selectedCategories?.length;
-
-      if (hasSelectedCategory) {
-        queryParams.c = selectedCategories?.map((sc) => sc.slug);
-      } else if (this._filterCategoryId) {
-        const slug = this.filterCategories?.find(
-          (fc) => fc.id === this._filterCategoryId
-        )?.slug;
-
-        if (slug) queryParams.c = slug;
-      }
-    }
-
-    return querystring.stringify(queryParams, { arrayFormat: "comma" });
-  }
-
-  get filterCategories() {
-    return this._filterCategories?.filter((fc) => fc.resultCount !== 0);
-  }
-
-  get hasAppliedfilter() {
-    return (
-      !!this._searchKeyword || this.filters?.some((f) => !!f.valueList.length)
-    );
-  }
-
-  get isFeaturedSortEnabled() {
-    return (
-      this.pageSpecificData?.orderType ===
-        IkasCategoryProductsOrderType.MANUALLY &&
-      [IkasProductListType.ALL, IkasProductListType.CATEGORY].includes(
-        this._type
-      )
-    );
-  }
-
-  private setPageSpecificSort() {
-    if (
-      this.pageSpecificData?.orderType &&
-      [IkasProductListType.ALL, IkasProductListType.CATEGORY].includes(
-        this._type
-      )
-    ) {
-      switch (this.pageSpecificData.orderType) {
-        case IkasCategoryProductsOrderType.HIGHEST_DISCOUNT_RATIO:
-          this._sort = IkasProductListSortType.DECRASING_DISCOUNT;
-          break;
-
-        case IkasCategoryProductsOrderType.LOWEST_DISCOUNT_RATIO:
-          this._sort = IkasProductListSortType.INCREASING_DISCOUNT;
-          break;
-
-        case IkasCategoryProductsOrderType.HIGHEST_PRICE:
-          this._sort = IkasProductListSortType.DECREASING_PRICE;
-          break;
-
-        case IkasCategoryProductsOrderType.LOWEST_PRICE:
-          this._sort = IkasProductListSortType.INCREASING_PRICE;
-          break;
-
-        case IkasCategoryProductsOrderType.NEWEST:
-          this._sort = IkasProductListSortType.LAST_ADDED;
-          break;
-
-        case IkasCategoryProductsOrderType.OLDEST:
-          this._sort = IkasProductListSortType.FIRST_ADDED;
-          break;
-
-        case IkasCategoryProductsOrderType.MANUALLY:
-          this._sort = IkasProductListSortType.FEATURED;
-          break;
-
-        default:
-          break;
-      }
-    }
-  }
-
-  private getSortParams(): SearchInputOrderByInput | undefined {
-    let direction: SortByDirectionEnum | undefined = SortByDirectionEnum.DESC;
-    let type: SortByTypeEnum = SortByTypeEnum.CREATED_AT;
-
-    switch (this._sort) {
-      // case IkasProductListSortType.A_Z:
-      //   direction = SortByDirectionEnum.ASC;
-      //   type = SortByTypeEnum.NAME;
-      //   break;
-
-      // case IkasProductListSortType.Z_A:
-      //   direction = SortByDirectionEnum.DESC;
-      //   type = SortByTypeEnum.NAME;
-      //   break;
-
-      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 (!this.isSearch) {
-          direction = SortByDirectionEnum.ASC;
-          type = SortByTypeEnum.MANUAL_SORT;
-        } else {
-          return;
-        }
-        break;
-
-      default:
-        break;
-    }
-
-    return {
-      direction,
-      type,
-    };
-  }
-
-  private async searchProducts(
-    page: number,
-    limit: number,
-    productIdList?: string[]
-  ) {
-    const filterList: IkasProductFilterValue[] = [];
-    const facetList: IkasProductFacetInput[] = [];
-
-    this.filters?.forEach((filter) => {
-      if (filter.valueList.length) {
-        filterList.push(
-          new IkasProductFilterValue({
-            id: filter.id,
-            type: filter.type,
-            displayType: filter.displayType,
-            valueList: filter.valueList,
-          })
-        );
-      }
-
-      if (filter.isFacetFilter) {
-        facetList.push({
-          id: filter.id,
-          type: filter.type,
-          displayType: filter.displayType,
-        });
-      }
-    });
-
-    const selectedCategoryIds = this._filterCategories
-      ?.filter((fc) => fc.isSelected)
-      .map((fc) => fc.id);
-
-    const sortParams = this.getSortParams();
-
-    if (this.isRelatedProducts) {
-      if (this._relatedProductData) {
-        return await ProductStore.getRelatedProducts({
-          priceListId: IkasStorefrontConfig.getPriceListId(),
-          salesChannelId: IkasStorefrontConfig.getSalesChannelId(),
-          productId: this._relatedProductData.productId,
-          brandIds: this._relatedProductData.brandIds,
-          categoryIds: this._relatedProductData.categoryIds,
-        });
-      }
-    }
-
-    return await ProductStore.searchProducts({
-      input: {
-        page,
-        perPage: limit,
-        productIdList: this.isStatic
-          ? this._productListPropValue.productIds?.map((p) => p.productId)
-          : productIdList,
-        filterList: filterList as any,
-        facetList: facetList as any,
-        brandId:
-          this._pageType === IkasThemeJsonPageType.BRAND &&
-          this._type !== IkasProductListType.SEARCH
-            ? this._filterBrandId
-            : undefined,
-        categoryIdList:
-          selectedCategoryIds && selectedCategoryIds.length
-            ? selectedCategoryIds
-            : this._filterCategoryId
-            ? [this._filterCategoryId]
-            : undefined,
-        priceListId: IkasStorefrontConfig.getPriceListId(),
-        salesChannelId: IkasStorefrontConfig.getSalesChannelId(),
-        query: this._searchKeyword,
-        order:
-          this._type === IkasProductListType.SEARCH
-            ? null
-            : sortParams
-            ? [sortParams]
-            : null,
-        showStockOption:
-          (IkasStorefrontConfig.getStockPreference() as any) ||
-          IkasThemeJsonStockPreference.SHOW_ALL,
-      },
-    });
-  }
-
-  private async getFilters() {
-    const getFiltersResponse = await ProductStore.getProductFilterData({
-      categoryId: this._filterCategoryId ? this._filterCategoryId : undefined,
-    });
-
-    this.filters = getFiltersResponse?.data?.filters.map(
-      (f) => new IkasProductFilter(f, this)
-    );
-    this._filterCategories = getFiltersResponse?.data?.categories;
-
-    if (
-      this.pageType !== IkasThemeJsonPageType.CATEGORY &&
-      this._filterCategoryId
-    ) {
-      const filterCategory = this._filterCategories?.find(
-        (fc) => fc.id === this._filterCategoryId
-      );
-      if (filterCategory) filterCategory.isSelected = true;
-    }
-
-    if (this.filters)
-      this.filters.sort((f1, f2) => (f1.order > f2.order ? 1 : -1));
-  }
-
-  private applyQueryParamFilters(queryParams?: URLSearchParams) {
-    try {
-      queryParams?.forEach((value, key) => {
-        const filter = this.filters?.find((f) => f.key === key);
-        if (filter) {
-          filter.applyQueryParam(value);
-        }
-      });
-      const querySearch = queryParams?.get("s");
-      if (querySearch) this._searchKeyword = querySearch;
-
-      if (this._pageType !== IkasThemeJsonPageType.CATEGORY) {
-        const queryCategory = queryParams?.get("c");
-        const categorySlugs = queryCategory?.split(",");
-
-        if (categorySlugs && categorySlugs.length) {
-          this.filterCategories?.forEach((fc) => {
-            fc.isSelected = categorySlugs.some((slug) => slug === fc.slug);
-          });
-        }
-      }
-    } catch (err) {
-      console.log(err);
-    }
-  }
-
-  private applyFacets(facets: Facet[] | undefined | null) {
-    this.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 (filter.isCustomValueFilter) filterValue.resultCount = null;
-          else filterValue.resultCount = 0;
-        });
-      } else if (filter.isCustomValueFilter) {
-        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) {
-      this._filterCategories?.forEach((filterCategory) => {
-        const facetValue = categoryFacet.values.find(
-          (fv) => fv.id === filterCategory.id
-        );
-        if (facetValue) {
-          filterCategory.resultCount = facetValue.count;
-        } else {
-          filterCategory.resultCount = 0;
-        }
-      });
-    }
-  }
-
-  private applyFilters = async () => {
-    const resultsSet = await this.getInitial();
-
-    if (
-      ![
-        IkasThemeJsonPageType.CATEGORY,
-        IkasThemeJsonPageType.BRAND,
-        IkasThemeJsonPageType.SEARCH,
-      ].includes(this._pageType)
-    )
-      return;
-
-    // Change url params
-    if (
-      resultsSet &&
-      this.isBrowser() &&
-      !this.isSearch &&
-      !IkasStorefrontConfig.getIsEditor()
-    ) {
-      this.router?.replace(
-        `${location.pathname}${
-          this.filterQueryParams ? "?" + this.filterQueryParams : ""
-        }`,
-        undefined,
-        { shallow: true }
-      );
-    }
-  };
-
-  clearFilters() {
-    this.filters?.forEach((filter) => filter.clear());
-    this._searchKeyword = "";
-
-    if (this._pageType !== IkasThemeJsonPageType.CATEGORY) {
-      this._filterCategoryId = undefined;
-    }
-
-    this._filterCategories?.forEach((fc) => (fc.isSelected = false));
-
-    this.applyFilters();
-  }
-
-  private getInitial = async (
-    queryParams?: URLSearchParams,
-    isInfiteScrollReturn?: boolean
-  ) => {
-    this._isLoading = true;
-
-    const fetchRequestTime = Date.now();
-    this._fetchRequestTime = fetchRequestTime;
-
-    try {
-      let page: number | undefined = isInfiteScrollReturn ? this._page : 1;
-      let limit: number | undefined = this._limit;
-
-      if (this.isFilterable && !this.filters) {
-        await this.getFilters();
-      }
-      this.applyQueryParamFilters(queryParams);
-
-      if (this.isSearch && !this.hasAppliedfilter) {
-        this.data = [];
-        this._page = 1;
-        this._minPage = 1;
-        this._count = 0;
-        this._initialized = true;
-        return true;
-      }
-
-      let productIdList: string[] | undefined;
-
-      if (this.isStatic) {
-        page = undefined;
-        limit = 200;
-      } else if (this.isDiscounted) {
-        page = 1;
-        limit = 10;
-      } else if (this.isRecommended) {
-        page = 1;
-        limit = 10;
-      } else if (this.isLastViewed) {
-        if (this.isBrowser()) {
-          await this.waitForCustomerStoreInit();
-          //@ts-ignore
-          //prettier-ignore
-          const lastViewedProducts = await IkasBaseStore.getInstance().customerStore.getLastViewedProducts();
-
-          if (lastViewedProducts && lastViewedProducts.length) {
-            productIdList = lastViewedProducts.map((p) => p.productId);
-          }
-        } else {
-          return;
-        }
-      }
-
-      const response = await this.searchProducts(
-        page || 1,
-        limit || 10,
-        productIdList
-      );
-      if (!response || this._fetchRequestTime !== fetchRequestTime) return;
-
-      let data: IkasProduct[] = [];
-
-      if (this.isStatic || this.isLastViewed) {
-        const idList = this.isStatic
-          ? this._productListPropValue.productIds
-          : //@ts-ignore
-            IkasBaseStore.getInstance().customerStore._lastViewedProducts;
-
-        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)
-                return new IkasProduct({
-                  ...product,
-                  selectedVariantValues: variant!.variantValues,
-                });
-            })
-            .filter((p) => !!p) as IkasProduct[]) || [];
-      } else {
-        data =
-          response.data?.data?.map((product) => {
-            const selectedVariant = product.variants.find((v) => v.isActive);
-            const productDetail = new IkasProduct({
-              ...product,
-              selectedVariantValues: (selectedVariant || product.variants[0])
-                .variantValues,
-            });
-
-            return productDetail;
-          }) || [];
-      }
-
-      this.applyFacets(response.data?.facets);
-
-      this.data = data;
-      this._count = response.data?.count || 0;
-      this._initialized = true;
-      this._page = page || 1;
-      this._minPage = this.page;
-
-      if (!isInfiteScrollReturn) this._infiniteScrollPage = null;
-      this.handleListingEvent();
-
-      return true;
-    } catch (err) {
-      console.log(err);
-    } finally {
-      if (fetchRequestTime === this._fetchRequestTime) this._isLoading = false;
-    }
-  };
-
-  getPrev = async () => {
-    if (
-      this.isStatic ||
-      this.isDiscounted ||
-      this.isRecommended ||
-      this.isLastViewed ||
-      this._isLoading ||
-      !this.hasPrev
-    )
-      return;
-
-    this._isLoading = true;
-
-    try {
-      const minPage = this._minPage! - 1;
-
-      const response = await this.searchProducts(minPage, this.limit);
-      if (!response) return;
-
-      const data = response.data?.data?.map((product) => {
-        const selectedVariant = product.variants.find((v) => v.isActive);
-        const productDetail = new IkasProduct({
-          ...product,
-          selectedVariantValues: (selectedVariant || product.variants[0])
-            .variantValues,
-        });
-
-        return productDetail;
-      });
-
-      this.data = data?.concat(this.data) || this.data;
-      this._count = response.data?.count || this._count;
-      this._minPage = minPage;
-    } catch (err) {
-      console.log(err);
-    } finally {
-      this._isLoading = false;
-    }
-  };
-
-  getNext = async () => {
-    if (
-      this.isStatic ||
-      this.isDiscounted ||
-      this.isRecommended ||
-      this.isLastViewed ||
-      this._isLoading ||
-      !this.hasNext
-    )
-      return;
-
-    this._isLoading = true;
-
-    try {
-      const response = await this.searchProducts(this.page + 1, this.limit);
-      if (!response) return;
-
-      const data = response.data?.data?.map((product) => {
-        const selectedVariant = product.variants.find((v) => v.isActive);
-        const productDetail = new IkasProduct({
-          ...product,
-          selectedVariantValues: (selectedVariant || product.variants[0])
-            .variantValues,
-        });
-
-        return productDetail;
-      });
-
-      this.data = this.data.concat(data || []);
-      this._count = response.data?.count || this._count;
-      this._page = this.page + 1;
-    } catch (err) {
-      console.log(err);
-    } finally {
-      this._isLoading = false;
-    }
-  };
-
-  getPage = async (page: number) => {
-    if (
-      this._isLoading ||
-      this.isStatic ||
-      this.isDiscounted ||
-      this.isRecommended ||
-      this.isLastViewed
-    )
-      return;
-    this._isLoading = true;
-
-    try {
-      const response = await this.searchProducts(page, this.limit);
-      if (!response) return;
-
-      const data = response.data?.data?.map((product) => {
-        const selectedVariant = product.variants.find((v) => v.isActive);
-        const productDetail = new IkasProduct({
-          ...product,
-          selectedVariantValues: (selectedVariant || product.variants[0])
-            .variantValues,
-        });
-
-        return productDetail;
-      });
-
-      this.data = data || [];
-      this._count = response.data?.count || 0;
-      this._page = page;
-      this._minPage = page;
-    } catch (err) {
-      console.log(err);
-    } finally {
-      this._isLoading = false;
-    }
-  };
-
-  async setSortType(sortType: IkasProductListSortType) {
-    this._sort = sortType;
-    await this.getInitial();
-  }
-
-  async onFilterCategoryClick(
-    filterCategory: IkasFilterCategory,
-    disableRoute = false
-  ) {
-    if (disableRoute) {
-      this._filterCategories?.forEach((fc) => {
-        if (fc.id === filterCategory.id) {
-          fc.isSelected = !fc.isSelected;
-        }
-      });
-      await this.applyFilters();
-    } else if (!IkasStorefrontConfig.getIsEditor()) {
-      IkasBaseStore.getInstance().router?.push(
-        filterCategory.href +
-          (this.filterQueryParams ? "?" + this.filterQueryParams : "")
-      );
-    }
-  }
-
-  toJSON() {
-    return {
-      data: this.data,
-      type: this._type,
-      pageType: this._pageType,
-      sort: this._sort,
-      limit: this._limit,
-      page: this._page,
-      count: this._count,
-      searchKeyword: this._searchKeyword,
-      initialized: this._initialized,
-      minPage: this._minPage,
-      filterBrandId: this._filterBrandId,
-      filterCategoryId: this._filterCategoryId,
-      filterCategories: this._filterCategories,
-      filters: this.filters,
-      recommendFor: this._recommendFor,
-      productListPropValue: this._productListPropValue,
-      pageSpecificData: this.pageSpecificData,
-    };
-  }
-
-  setVisibleInfiniteScrollPage = (page: number) => {
-    if (this._infiniteScrollPage === page) return;
-
-    this._infiniteScrollPage = page;
-
-    if (!IkasStorefrontConfig.getIsEditor()) {
-      this.router?.replace(
-        `${location.pathname}${
-          this.filterQueryParams ? "?" + this.filterQueryParams : ""
-        }`,
-        undefined,
-        { shallow: true }
-      );
-    }
-  };
-
-  private restoreInfiniteScrollPage() {
-    const queryParams = this.getQueryParams();
-    const pageStr = queryParams?.get("page");
-
-    if (pageStr) {
-      const page = parseInt(pageStr);
-      if (!isNaN(page)) {
-        this._page = page;
-        this._infiniteScrollPage = page;
-      }
-    }
-  }
-
-  private getQueryParams() {
-    if (!this.isBrowser()) return;
-    return new URLSearchParams(location.search);
-  }
-
-  private isBrowser() {
-    return typeof window !== "undefined";
-  }
-
-  private waitForCustomerStoreInit() {
-    return new Promise((resolve) => {
-      const interval = setInterval(() => {
-        if (IkasBaseStore.getInstance().customerStore.initialized) {
-          clearInterval(interval);
-          resolve(null);
-        }
-      }, 1000);
-    });
-  }
-
-  private handleListingEvent() {
-    if (this.searchKeyword && this.data.length) {
-      Analytics.viewSearchResults(this._searchKeyword, this.data);
-    } else if (this.data.length && this._type === IkasProductListType.ALL) {
-      Analytics.viewListing(this.data);
-    }
-  }
-
-  private searchDebouncer = _debounce(() => {
-    this.applyFilters();
-  }, 500);
-
-  private searchAnalyticsDebouncer = _debounce(() => {
-    Analytics.search(this._searchKeyword);
-  }, 1000);
-}
-
-export type IkasProductListParams = {
-  data?: IkasProduct[];
-  type?: IkasProductListType;
-  pageType: IkasThemeJsonPageType;
-  sort?: IkasProductListSortType;
-  limit?: number;
-  page?: number;
-  count?: number;
-  searchKeyword?: string;
-  initialized?: boolean;
-  minPage?: number;
-  filterBrandId?: string;
-  filterCategoryId?: string;
-  filters?: IkasProductFilter[];
-  filterCategories?: IkasFilterCategory[];
-  recommendFor?: string;
-  productListPropValue: IkasProductListPropValue;
-  pageSpecificData?: IkasCategory | IkasBrand | null;
-  relatedProductData?: IkasRelatedProductProps | null;
-};
-
-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",
-}
-
-type Facet = {
-  id: string;
-  values: FacetValue[];
-};
-
-type FacetValue = {
-  id: string;
-  count: number;
-};