@ikas/storefront 4.0.0-alpha.78 → 4.0.0-alpha.8

package/src/store/customer/index.ts

@@ -0,0 +1,658 @@
+import { makeAutoObservable } from "mobx";
+import _uniqBy from "lodash/uniqBy";
+
+import CustomerStoreAPI from "./api";
+import { IkasCustomerEmailSubscriptionStatus } from "../../models/data/customer";
+import {
+  IkasContactForm,
+  IkasCustomer,
+  IkasCustomerAttributeValue,
+  IkasFavoriteProduct,
+  IkasLastViewedProduct,
+  IkasOrderRefundSettings,
+  IkasOrderTransaction,
+  IkasProduct,
+  IkasOrder,
+  IkasOrderRefundOrderLineInput,
+} from "../../models/data";
+
+import RaffleStore from "../raffle";
+import { Config } from "@ikas/fe-api-client";
+import ProductStore from "../product";
+import { Analytics } from "../../analytics";
+import { IkasStorefrontConfig } from "@ikas/storefront-config";
+import { SaveMyCustomerInput } from "@ikas/storefront-api";
+import { populateRaffleProducts } from "@ikas/storefront-providers";
+import { IkasBaseStore } from "../base";
+
+const isServer = typeof localStorage === "undefined";
+const LS_TOKEN_KEY = "customerToken";
+const LS_TOKEN_EXPIRY = "customerTokenExpiry";
+const LS_CUSTOMER_SUB_KEY = "customerEmailSubscription";
+const LS_LAST_VIEWED_PRODUCTS_KEY = "lastViewedProducts";
+const LS_CUSTOMER_CONSENT = "customerConsent";
+
+export class IkasCustomerStore {
+  customer?: IkasCustomer | null = null;
+  token?: string | null = null;
+  tokenExpiry?: number | null = null;
+  private baseStore?: IkasBaseStore | null = null;
+  private _initialized = false;
+  private _visitorSubscribedEmail = false;
+  private _lastViewedProducts: IkasLastViewedProduct[] = [];
+  private _customerConsentGranted = false;
+  private _refundSettings?: IkasOrderRefundSettings | null = null;
+
+  constructor(baseStore?: IkasBaseStore) {
+    this.baseStore = baseStore;
+
+    makeAutoObservable(this);
+  }
+
+  get initialized() {
+    return this._initialized;
+  }
+
+  get canCreateEmailSubscription() {
+    if (this.customer?.isSubscribed || isServer || this._visitorSubscribedEmail)
+      return false;
+
+    const alreadySubbed = window.localStorage.getItem(LS_CUSTOMER_SUB_KEY);
+    return !alreadySubbed;
+  }
+
+  get customerConsentGranted() {
+    return this._customerConsentGranted;
+  }
+
+  private toAnalyticsCustomer = (customer: IkasCustomer) => {
+    return {
+      ...(customer as any),
+      consentGranted: this._customerConsentGranted,
+    };
+  };
+
+  async socialLogin(provider: "facebook" | "google") {
+    if (typeof window === "undefined") return;
+
+    const redirect =
+      new URLSearchParams(window.location.search).get("redirect") || "";
+    const url = `${process.env.NEXT_PUBLIC_BASE_URL}/ms/${provider}/login/authenticate?redirect=${redirect}`;
+    const result = await fetch(url, {
+      headers: {
+        "x-api-key": IkasStorefrontConfig.getApiKey() || "",
+        "x-sfid": IkasStorefrontConfig.getStorefrontId() || "",
+        "x-sfrid": IkasStorefrontConfig.getStorefrontRoutingId() || "",
+      },
+    });
+    const resultJson = await result.json();
+
+    window.location.href = resultJson.redirectUrl;
+  }
+
+  async socialLoginToken(token: string) {
+    const response = await CustomerStoreAPI.socialLogin({
+      code: token,
+    });
+    if (!response?.isSuccess || !response.data?.customer) return false;
+
+    this.setToken(response.data.token, response.data.tokenExpiry);
+    this.setCustomer(response.data.customer);
+    if (this.customer) Analytics.customerLogin();
+
+    return true;
+  }
+
+  async refundOrder(order: IkasOrder) {
+    try {
+      const refundOrderLineItems: IkasOrderRefundOrderLineInput[] = [];
+      order.orderLineItems.map((item) => {
+        if (item.refundQuantity !== null) {
+          refundOrderLineItems?.push({
+            orderLineItemId: item.id,
+            quantity: item.refundQuantity ? item.refundQuantity : 0,
+          });
+        }
+      });
+
+      const result = await CustomerStoreAPI.createOrderRefundRequest({
+        input: {
+          orderId: order.id,
+          orderLineItems: refundOrderLineItems,
+        },
+      });
+
+      if (result.isSuccess && result.data) {
+        // Set the new order object to this
+        Object.entries(result.data).forEach(([key, value]) => {
+          (this as any)[key] = value;
+        });
+        return true;
+      }
+    } catch (err) {}
+
+    return false;
+  }
+
+  login = async (email: string, password: string) => {
+    const response = await CustomerStoreAPI.login({
+      email,
+      password,
+    });
+
+    if (response && response.isSuccess && response.data) {
+      const data = response.data;
+
+      this.setToken(data.token, data.tokenExpiry);
+
+      if (data.customer) this.setCustomer(data.customer);
+      if (this.customer) Analytics.customerLogin();
+
+      // Set cart's customer
+      const cart = this.baseStore?.cartStore.cart;
+      if (cart) {
+        await this.baseStore!.cartStore.changeItemQuantity(
+          cart.orderLineItems[0],
+          cart.orderLineItems[0].quantity
+        );
+      }
+
+      this.saveLocalLastViewedProducts();
+
+      return true;
+    }
+
+    return false;
+  };
+
+  logout = () => {
+    this.clearLocalData();
+    this.baseStore?.cartStore.removeCart();
+    Analytics.customerLogout();
+  };
+
+  register = async (
+    firstName: string,
+    lastName: string,
+    email: string,
+    password: string,
+    isMarketingAccepted?: boolean,
+    attributes?: IkasCustomerAttributeValue[]
+  ) => {
+    const response = await CustomerStoreAPI.register({
+      email,
+      password,
+      firstName,
+      lastName,
+      isAcceptMarketing: isMarketingAccepted,
+      attributes,
+    });
+
+    if (response && response.isSuccess && response.data?.customer) {
+      this.setToken(response.data.token, response.data.tokenExpiry);
+      this.setCustomer(response.data.customer);
+      this.saveLocalLastViewedProducts();
+
+      Analytics.completeRegistration(this.toAnalyticsCustomer(this.customer!));
+
+      return true;
+    }
+
+    return false;
+  };
+
+  saveContactForm = async (input: IkasContactForm) => {
+    Analytics.contactForm(input);
+    const response = await CustomerStoreAPI.sendContactFormToMerchant(input);
+    return response.isSuccess;
+  };
+
+  checkEmail = async (email: string) => {
+    const response = await CustomerStoreAPI.checkEmail({
+      email,
+    });
+    return response.isSuccess;
+  };
+
+  forgotPassword = async (email: string) => {
+    const response = await CustomerStoreAPI.forgotPassword({
+      email,
+    });
+    return response.isSuccess;
+  };
+
+  recoverPassword = async (
+    password: string,
+    passwordAgain: string,
+    token: string
+  ) => {
+    const response = await CustomerStoreAPI.recoverPassword({
+      password,
+      passwordAgain,
+      token,
+    });
+    return response.isSuccess;
+  };
+
+  saveCustomer = async (customer: IkasCustomer) => {
+    const response = await CustomerStoreAPI.saveCustomer({
+      input: new SaveMyCustomerInput(customer as SaveMyCustomerInput),
+    });
+
+    if (response.isSuccess && response.data) {
+      this.setCustomer(response.data);
+      return true;
+    }
+
+    return false;
+  };
+
+  getOrders = async () => {
+    const response = await CustomerStoreAPI.getOrders({});
+    return response.data || [];
+  };
+
+  getOrder = async (id: string) => {
+    const response = await CustomerStoreAPI.getOrders({
+      orderId: id,
+    });
+
+    if (!response.isSuccess || !response.data?.length) return null;
+
+    const order = response.data[0];
+
+    await this.getOrderRefundSettings();
+
+    order.refundSettings = this._refundSettings;
+
+    return order;
+  };
+
+  getOrderTransactions = async (
+    params: {
+      checkoutId?: string;
+      id?: string;
+      orderId?: string;
+    } = {}
+  ): Promise<IkasOrderTransaction[]> => {
+    const response = await CustomerStoreAPI.listOrderTransactions({
+      checkoutId: { eq: params.checkoutId },
+      id: { eq: params.checkoutId },
+      orderId: { eq: params.orderId },
+    });
+    return response.data || [];
+  };
+
+  getFavoriteProductsIds = async (): Promise<IkasFavoriteProduct[]> => {
+    const favoriteProductsResult =
+      await CustomerStoreAPI.listFavoriteProducts();
+    return favoriteProductsResult.data || [];
+  };
+
+  getFavoriteProducts = async (): Promise<IkasProduct[]> => {
+    const favoriteProductsResponse =
+      await CustomerStoreAPI.listFavoriteProducts();
+    if (
+      favoriteProductsResponse.isSuccess ||
+      !favoriteProductsResponse.data?.length
+    )
+      return [];
+
+    const productsResponse = await ProductStore.searchProducts({
+      input: {
+        productIdList: favoriteProductsResponse.data.map((fP) => fP.productId),
+        priceListId: IkasStorefrontConfig.getPriceListId(),
+        salesChannelId: IkasStorefrontConfig.getSalesChannelId(),
+      },
+    });
+    return productsResponse?.data?.data || [];
+  };
+
+  addProductToFavorites = async (productId: string) => {
+    const customerId = this.customer?.id;
+    if (!customerId) throw Error("Unauthorized");
+
+    const response = await CustomerStoreAPI.saveFavoriteProduct({
+      isFavorite: true,
+      productId,
+    });
+    Analytics.addToWishlist(productId);
+
+    return response.data || false;
+  };
+
+  removeProductFromFavorites = async (productId: string) => {
+    const customerId = this.customer?.id;
+    if (!customerId) throw Error("Unauthorized");
+
+    const response = await CustomerStoreAPI.saveFavoriteProduct({
+      isFavorite: false,
+      productId,
+    });
+    Analytics.addToWishlist(productId);
+
+    return response.data || false;
+  };
+
+  isProductFavorite = async (productId: string) => {
+    const customerId = this.customer?.id;
+    if (!customerId) throw Error("Unauthorized");
+
+    const response = await CustomerStoreAPI.isFavoriteProduct({ productId });
+    return response.data || false;
+  };
+
+  createEmailSubscription = async (email: string) => {
+    const response = await CustomerStoreAPI.createCustomerEmailSubscription({
+      input: {
+        email,
+      },
+    });
+
+    if (response.isSuccess) {
+      window.localStorage.setItem(LS_CUSTOMER_SUB_KEY, "true");
+      if (this.customer)
+        this.customer.subscriptionStatus ===
+          IkasCustomerEmailSubscriptionStatus.SUBSCRIBED;
+      else this._visitorSubscribedEmail = true;
+
+      Analytics.createEmailSubscripition(email);
+    }
+
+    return response.isSuccess;
+  };
+
+  sendReview = async (input: IkasCustomerReviewForm) => {
+    const customerReviewSettings =
+      IkasStorefrontConfig.getCustomerReviewSettings();
+    const salesChannelId = IkasStorefrontConfig.getSalesChannelId();
+
+    if (!customerReviewSettings) return;
+
+    const customerId = this.customer?.id;
+
+    if (!customerId && customerReviewSettings.customerLoginRequired)
+      throw Error("Unauthorized");
+
+    const response = await CustomerStoreAPI.createCustomerReview({
+      input: {
+        ...input,
+        customerId: customerReviewSettings.customerLoginRequired
+          ? customerId
+          : undefined,
+        salesChannelId: salesChannelId || "",
+      },
+    });
+
+    return response.data;
+  };
+
+  onCustomerConsentGrant = () => {
+    this.saveCustomerConsent();
+  };
+
+  waitUntilInitialized = () => {
+    return new Promise((resolve) => {
+      const interval = setInterval(() => {
+        if (this.initialized) {
+          clearInterval(interval);
+          resolve(null);
+        }
+      }, 100);
+    });
+  };
+
+  getRaffles = async () => {
+    const rafflesResponse = await RaffleStore.getRafflesByCustomerId({
+      winnerFilter: false,
+    });
+    const wonRafflesResponse = await RaffleStore.getRafflesByCustomerId({
+      winnerFilter: true,
+    });
+
+    const raffles = rafflesResponse.data;
+    const wonRaffles = wonRafflesResponse.data;
+
+    raffles?.forEach((raffle) => {
+      if (wonRaffles?.find((wonRaffle) => wonRaffle.id === raffle.id))
+        raffle.isCustomerWinner = true;
+    });
+
+    if (raffles) await populateRaffleProducts(raffles);
+    return raffles || [];
+  };
+
+  getCustomerAttributes = async () => {
+    const attributesResponse = await CustomerStoreAPI.listCustomerAttribute();
+
+    if (this.customer) {
+      this.customer.attributes?.forEach((attributeValue) => {
+        attributeValue.customerAttribute =
+          attributesResponse.data?.find(
+            (a) => a.id === attributeValue.customerAttributeId
+          ) || null;
+
+        if (attributeValue.customerAttributeOptionId) {
+          attributeValue.customerAttributeOption =
+            attributeValue.customerAttribute?.options?.find(
+              (o) => o.id === attributeValue.customerAttributeOptionId
+            ) || null;
+        }
+      });
+    }
+
+    return attributesResponse.data || [];
+  };
+
+  getOrderByEmail = async (email: string, orderNumber: string) => {
+    const response = await CustomerStoreAPI.getOrderByEmail({
+      email,
+      orderNumber,
+    });
+
+    return response.data || null;
+  };
+
+  private async init() {
+    this.loadToken();
+    this.loadLastViewedProducts();
+    this.loadCustomerConsent();
+    await this.refreshToken();
+    await this.getCustomer();
+    this._initialized = true;
+
+    if (this.customer) Analytics.customerVisit();
+  }
+
+  private getOrderRefundSettings = async () => {
+    if (!this._refundSettings) {
+      const response = await CustomerStoreAPI.listOrderRefundSettings({});
+      if (response.isSuccess && response.data?.length) {
+        this._refundSettings = response.data[0];
+      }
+    }
+  };
+
+  private routeChangeInit() {
+    if (!this.customer) {
+      this.loadToken();
+      this.getCustomer();
+    }
+  }
+
+  private async getCustomer() {
+    if (isServer || !this.token) return;
+    const response = await CustomerStoreAPI.getCustomer();
+    if (response.data) this.setCustomer(response.data);
+  }
+
+  private async refreshToken() {
+    if (!this.token) return;
+    const response = await CustomerStoreAPI.refreshToken({
+      token: this.token,
+    });
+
+    if (response.isSuccess && response.data)
+      this.setToken(response.data.token, response.data.tokenExpiry);
+    else {
+      this.token = null;
+      this.tokenExpiry = null;
+      this.clearLocalData();
+    }
+  }
+
+  private setCustomer(customer: IkasCustomer) {
+    this.customer = new IkasCustomer(customer);
+  }
+
+  private async getLastViewedProducts() {
+    if (this.customer) {
+      const response = await CustomerStoreAPI.getLastViewedProducts({
+        customerId: this.customer.id,
+      });
+      this._lastViewedProducts = response.data || [];
+    } else {
+      this.loadLastViewedProducts();
+    }
+
+    return this._lastViewedProducts;
+  }
+
+  private saveLastViewedProducts() {
+    if (isServer) return;
+    window.localStorage.setItem(
+      LS_LAST_VIEWED_PRODUCTS_KEY,
+      JSON.stringify(this._lastViewedProducts)
+    );
+  }
+
+  private loadLastViewedProducts() {
+    if (isServer) return;
+    try {
+      const lvpStr = window.localStorage.getItem(LS_LAST_VIEWED_PRODUCTS_KEY);
+      if (lvpStr) {
+        this._lastViewedProducts = JSON.parse(lvpStr);
+        this._lastViewedProducts = this._lastViewedProducts.reverse();
+        this._lastViewedProducts = _uniqBy(
+          this._lastViewedProducts,
+          "variantId"
+        );
+      }
+    } catch (err) {}
+  }
+
+  private removeLastViewedProducts() {
+    if (isServer) return;
+    window.localStorage.removeItem(LS_LAST_VIEWED_PRODUCTS_KEY);
+  }
+
+  private async onProductView(productId: string, variantId: string) {
+    if (this.customer) {
+      const existingItem = this._lastViewedProducts.find(
+        (lvp) => lvp.productId === productId
+      );
+      if (existingItem) {
+        return;
+      }
+
+      const isSuccess = await CustomerStoreAPI.saveLastViewedProducts({
+        input: {
+          customerId: this.customer.id,
+          products: [
+            {
+              productId,
+              variantId,
+            },
+          ],
+        },
+      });
+
+      if (isSuccess) this._lastViewedProducts.push({ productId, variantId });
+    } else {
+      this._lastViewedProducts.push({ productId, variantId });
+      this._lastViewedProducts = this._lastViewedProducts.slice(0, 20);
+      this._lastViewedProducts = _uniqBy(this._lastViewedProducts, "variantId");
+      this.saveLastViewedProducts();
+    }
+  }
+
+  private async saveLocalLastViewedProducts() {
+    if (isServer) return;
+    try {
+      this.loadLastViewedProducts();
+      if (this._lastViewedProducts.length) {
+        const isSuccess = await CustomerStoreAPI.saveLastViewedProducts({
+          input: {
+            customerId: this.customer!.id,
+            products: this._lastViewedProducts,
+          },
+        });
+
+        if (isSuccess) {
+          this.removeLastViewedProducts();
+        }
+      }
+    } catch (err) {}
+  }
+
+  private saveCustomerConsent() {
+    if (isServer) return;
+    this._customerConsentGranted = true;
+    window.localStorage.setItem(LS_CUSTOMER_CONSENT, "true");
+  }
+
+  private loadCustomerConsent() {
+    if (isServer) return;
+    this._customerConsentGranted =
+      !!window.localStorage.getItem(LS_CUSTOMER_CONSENT);
+  }
+
+  private removeCustomerConsent() {
+    if (isServer) return;
+    window.localStorage.removeItem(LS_CUSTOMER_CONSENT);
+  }
+
+  private setToken(token: string, tokenExpiry: number) {
+    if (isServer) return;
+
+    this.token = token;
+    this.tokenExpiry = tokenExpiry;
+
+    localStorage.setItem(LS_TOKEN_KEY, token);
+    localStorage.setItem(LS_TOKEN_EXPIRY, tokenExpiry + "");
+
+    Config.TOKEN = token;
+  }
+
+  private loadToken() {
+    if (isServer) return;
+
+    const token = localStorage.getItem(LS_TOKEN_KEY);
+    const tokenExpiry = localStorage.getItem(LS_TOKEN_EXPIRY);
+
+    if (token && tokenExpiry) {
+      this.setToken(token, parseInt(tokenExpiry));
+    }
+  }
+
+  private clearLocalTokenData() {
+    localStorage.removeItem(LS_TOKEN_KEY);
+    localStorage.removeItem(LS_TOKEN_EXPIRY);
+    this.token = undefined;
+    this.tokenExpiry = undefined;
+  }
+
+  private clearLocalData() {
+    this.clearLocalTokenData();
+
+    this.customer = undefined;
+    Config.TOKEN = "";
+  }
+}
+
+export type IkasCustomerReviewForm = {
+  comment?: string;
+  productId: string;
+  star: number;
+  title?: string;
+};

package/src/store/html-meta-data/index.ts

@@ -0,0 +1,16 @@
+import { APIResponse } from "@ikas/fe-api-client";
+import {
+  listHTMLMetaData,
+  ListHTMLMetaDataQueryParams,
+} from "@ikas/storefront-api";
+import { IkasHTMLMetaData } from "../../models/data";
+
+export default class HtmlMetaDataStore {
+  static async listHTMLMetaData(params: ListHTMLMetaDataQueryParams) {
+    const response = await listHTMLMetaData(params);
+    return new APIResponse(
+      response.data?.map((d) => new IkasHTMLMetaData(d)),
+      response.graphQLErrors
+    );
+  }
+}

package/src/store/index.ts

@@ -0,0 +1 @@
+export { IkasBaseStore } from "./base";