@ikas/storefront 4.0.0-alpha.3 → 4.0.0-alpha.31

package/src/models/ui/validator/form/raffle-form.ts

@@ -1,5 +1,6 @@
 import { saveRaffleParticipant } from "@ikas/storefront-api";
 import { action, computed, makeObservable, observable } from "mobx";
+import { GraphQLError } from "graphql";
 
 import { Validator } from "..";
 import { IkasBaseStore } from "../../../../store";
@@ -237,7 +238,11 @@ export class RaffleForm {
   }
 
   async submit() {
-    const response = { isFormError: false, isSuccess: false };
+    const response: {
+      isFormError: boolean;
+      isSuccess: boolean;
+      errors?: readonly GraphQLError[];
+    } = { isFormError: false, isSuccess: false };
     const hasFormError = await this.validateAll();
     if (hasFormError) {
       response.isFormError = true;
@@ -246,7 +251,7 @@ export class RaffleForm {
 
     try {
       const selectedVariant = this.raffle.products[0].selectedVariant;
-      const isRaffleFormSuccess = await saveRaffleParticipant({
+      const saveRaffleParticipantResponse = await saveRaffleParticipant({
         input: {
           appliedProduct: {
             productId: selectedVariant.productId,
@@ -264,12 +269,20 @@ export class RaffleForm {
         },
       });
 
-      if (isRaffleFormSuccess) {
+      if (saveRaffleParticipantResponse?.graphQLErrors) {
+        response.errors = saveRaffleParticipantResponse.graphQLErrors;
+        response.isSuccess = false;
+      }
+
+      if (saveRaffleParticipantResponse.data) {
         response.isSuccess = true;
       }
 
       return response;
     } catch (error) {
+      if (error) {
+        response.errors = error;
+      }
       return response;
     }
   }

package/src/models/ui/validator/rules/index.ts

@@ -183,6 +183,16 @@ export class EmailRule<T> extends ValidationRule<T> {
   }
 }
 
+/**
+ * 1) start with plus(+) or digit
+ * 2) any digit or one char white space
+ * 3) end with digit
+ *
+ * For example:
+ * ✅ Valid +90535 555 5555
+ * ✅ valid 905355555555
+ * 🚫 Unvalid +90535 5  55 5555
+ */
 export class PhoneRule<T> extends ValidationRule<T> {
   get errorMessage() {
     if (!this.message) return "";
@@ -193,10 +203,8 @@ export class PhoneRule<T> extends ValidationRule<T> {
   async run(): Promise<boolean> {
     if (!this.value) return true;
 
-    const result = this.value.match(/\d/g);
-    return (
-      (!!result && result.length <= 11) || !!/^\+(\d{12})$/gm.test(this.value)
-    );
+    const result = this.value.match(/^[\+\d](\d+\s)*\d+$/g);
+    return !!result;
   }
 }
 
@@ -246,15 +254,8 @@ export class IdentityNumberRule<T> extends ValidationRule<T> {
       TCSum = 0;
 
     const incorrect = [
-      11111111110,
-      22222222220,
-      33333333330,
-      44444444440,
-      55555555550,
-      66666666660,
-      7777777770,
-      88888888880,
-      99999999990,
+      11111111110, 22222222220, 33333333330, 44444444440, 55555555550,
+      66666666660, 7777777770, 88888888880, 99999999990,
     ];
 
     if (tcknString.length !== 11) return false;

package/src/pages/checkout.tsx

@@ -9,7 +9,7 @@ import IkasCheckoutPage, {
 import { useRouter } from "next/router.js";
 import { FullscreenLoading } from "../components/checkout/components/fullscreen-loading";
 import { CheckoutStep } from "../components/checkout/model";
-import { getCartById } from "@ikas/storefront-api";
+import { getCartById, setAPIClientConfig } from "@ikas/storefront-api";
 import { IkasStorefrontConfig } from "@ikas/storefront-config";
 import { IkasBaseStore } from "..";
 import { IkasCheckout, IkasCheckoutSettings } from "../models/data";
@@ -35,6 +35,7 @@ const CheckoutPage: React.FC<Props> = ({
   const [checkout, setCheckout] = React.useState<IkasCheckout | undefined>();
 
   IkasStorefrontConfig.init(configJson);
+  setAPIClientConfig();
 
   React.useEffect(() => {
     setCustomizationProps(customizationProps);

package/src/pages/editor.tsx

@@ -8,7 +8,7 @@ const IkasPageEditor = dynamic(
 );
 
 type Props = {
-  configJson: Record<string, any>;
+  configJson?: Record<string, any>; // local only
   components?: Record<string, any>;
 };
 
@@ -19,9 +19,12 @@ export default class Page extends React.Component<Props> {
     if (configJson) {
       IkasStorefrontConfig.init({
         ...configJson,
-        currentPageComponents: components || {},
       });
     }
+
+    IkasStorefrontConfig.init({
+      currentPageComponents: components || {},
+    });
   }
 
   render() {

package/src/store/cart/index.ts

@@ -100,7 +100,7 @@ export class IkasCartStore {
 
       product.productOptionSet?.initOptionValues();
 
-      return true;
+      return response;
     } catch (err) {
       console.log(err);
       return false;
@@ -145,7 +145,7 @@ export class IkasCartStore {
           Analytics.addToCart(item, quantity - oldQuantity, eventId, this.cart);
         }
       }
-      return true;
+      return response;
     } catch (err) {
       console.log(err);
       return false;

package/src/store/customer/index.ts

@@ -24,6 +24,7 @@ import { IkasStorefrontConfig } from "@ikas/storefront-config";
 import { SaveMyCustomerInput } from "@ikas/storefront-api";
 import { populateRaffleProducts } from "@ikas/storefront-providers";
 import { IkasBaseStore } from "../base";
+import { IkasRaffle } from "@ikas/storefront-models";
 
 const isServer = typeof localStorage === "undefined";
 const LS_TOKEN_KEY = "customerToken";
@@ -403,22 +404,11 @@ export class IkasCustomerStore {
   };
 
   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);
+    const rafflesResponse = await RaffleStore.listRaffleParticipants();
+    let raffles: IkasRaffle[] = [];
+    if (!rafflesResponse.data?.length) return raffles;
+    raffles = rafflesResponse.data;
+    if (raffles.length) await populateRaffleProducts(raffles);
     return raffles || [];
   };
 

package/src/store/raffle/index.ts

@@ -1,11 +1,10 @@
 import { APIResponse } from "@ikas/fe-api-client";
 import {
-  getRafflesByCustomerId,
-  GetRafflesByCustomerIdQueryParams,
-  listRaffle,
+  listRaffleParticipants,
+  listStorefrontRaffle,
   listRaffleMetaData,
   ListRaffleMetadataQueryParams,
-  ListRaffleQueryParams,
+  ListStorefrontRaffleParams,
   saveRaffleParticipant,
   SaveRaffleParticipantQueryParams,
 } from "@ikas/storefront-api";
@@ -16,8 +15,8 @@ import {
 } from "../../models/data/raffle";
 
 export default class RaffleStore {
-  static async listRaffle(params: ListRaffleQueryParams) {
-    const response = await listRaffle(params);
+  static async listStorefrontRaffle(params: ListStorefrontRaffleParams) {
+    const response = await listStorefrontRaffle(params);
     return new APIResponse({
       ...response.data,
       data: response.data?.data?.map(
@@ -46,10 +45,8 @@ export default class RaffleStore {
     );
   }
 
-  static async getRafflesByCustomerId(
-    params: GetRafflesByCustomerIdQueryParams
-  ) {
-    const response = await getRafflesByCustomerId(params);
+  static async listRaffleParticipants() {
+    const response = await listRaffleParticipants();
     return new APIResponse(
       response.data?.map((d) => new IkasRaffle(d as unknown as IkasRaffle)),
       response.graphQLErrors

package/src/utils/currency.ts

@@ -13,14 +13,19 @@ const format = (p: number, n: number, x: number, s: string, c: string) => {
 /**
  *
  * @param price Price to format
- * @param currencyCode Code for the currency, USD, EUR, TRY, etc..
+ * @param currencyCode Currency code
+ * @param currencySymbol Symbol for the currency
  */
-export const formatMoney = (price: number, currencyCode: string) => {
+export const formatCurrency = (
+  price: number,
+  currencyCode: string,
+  currencySymbol: string | null
+) => {
   const formatSettings =
     IkasStorefrontConfig.getMerchantSettings()?.currencyFormats?.find(
       (s) => s.currencyCode === currencyCode
     );
-  const symbol = formatSettings?.symbol || getCurrencySymbol(currencyCode);
+  const symbol = formatSettings?.symbol || currencySymbol || "";
   const decimalSeparator = formatSettings?.decimalSeparator || ".";
   const thousandSeparator = formatSettings?.thousandSeparator || ",";
   const symbolPosition = formatSettings?.symbolPosition || "LEFT";
@@ -62,189 +67,10 @@ export const formatMoney = (price: number, currencyCode: string) => {
       IkasStorefrontConfig.getCurrentLocale(),
       {
         style: "currency",
-        currency: currencyCode || "TRY",
+        currency: currencySymbol || "TRY",
       }
     );
 
     return formatter.format(price);
   }
 };
-
-export function getCurrencySymbol(currencyCode: string) {
-  return CURRENCIES[currencyCode] || currencyCode;
-}
-
-const CURRENCIES: Record<string, string> = {
-  TRY: "₺",
-  USD: "$",
-  EUR: "€",
-  AZN: "₼",
-  AED: "د.إ.",
-  AFN: "؋",
-  ALL: "L",
-  AMD: "դր",
-  ANG: "ƒ",
-  AOA: "Kz",
-  ARS: "$",
-  AUD: "$",
-  AWG: "ƒ",
-  BAM: "КМ",
-  BBD: "$",
-  BDT: "৳",
-  BGN: "лв.",
-  BHD: "د.ب.",
-  BIF: "FBu",
-  BMD: "$",
-  BND: "$",
-  BOB: "Bs.",
-  BRL: "R$",
-  BSD: "$",
-  BTN: "Nu.",
-  BWP: "P",
-  BYN: "руб.",
-  BZD: "$",
-  CAD: "$",
-  CDF: "₣",
-  CHF: "₣",
-  CKD: "$",
-  CLP: "$",
-  CNY: "¥元",
-  COP: "$",
-  CRC: "₡",
-  CUC: "$",
-  CUP: "₱",
-  CVE: "$",
-  CZK: "Kč",
-  DJF: "ف.ج.",
-  DKK: "kr.",
-  DOP: "$",
-  DZD: "د.ج.",
-  EGP: "ج.م.",
-  EHP: "Ptas.",
-  ERN: "ناكفا",
-  ETB: "ብር",
-  FJD: "$",
-  FKP: "£",
-  FOK: "kr",
-  GBP: "£",
-  GEL: "₾",
-  GGP: "£",
-  GHS: "₵",
-  GIP: "£",
-  GMD: "D",
-  GNF: "FG",
-  GTQ: "$",
-  GYD: "$",
-  HKD: "$",
-  HNL: "L",
-  HRK: "kn",
-  HTG: "G",
-  HUF: "Ft",
-  IDR: "Rp",
-  ILS: "₪",
-  IMP: "£",
-  INR: "₹",
-  IQD: "د.ع.",
-  IRR: "﷼",
-  ISK: "kr",
-  JEP: "£",
-  JMD: "$",
-  JOD: "د.أ.",
-  JPY: "¥",
-  KES: "KSh",
-  KGS: "с",
-  KHR: "៛",
-  KID: "$",
-  KMF: "CF",
-  KPW: "₩",
-  KRW: "₩",
-  KWD: "د.ك.",
-  KYD: "$",
-  KZT: "₸",
-  LAK: "₭",
-  LBP: "ل.ل.",
-  LKR: "රු or ரூ",
-  LRD: "$",
-  LSL: "L",
-  LYD: "ل.د.",
-  MAD: "د.م.",
-  MDL: "L",
-  MGA: "Ar",
-  MKD: "ден",
-  MMK: "Ks",
-  MNT: "₮",
-  MOP: "MOP$",
-  MRU: "أ.م.",
-  MUR: "रु ",
-  MVR: ".ރ",
-  MWK: "MK",
-  MXN: "$",
-  MYR: "RM",
-  MZN: "MT",
-  NAD: "$",
-  NGN: "₦",
-  NIO: "C$",
-  NOK: "kr",
-  NPR: "रू",
-  NZD: "$",
-  OMR: "ر.ع.",
-  PAB: "B/.",
-  PEN: "S/.",
-  PGK: "K",
-  PHP: "₱",
-  PKR: "Rs",
-  PLN: "zł",
-  PND: "$",
-  PRB: "р.",
-  PYG: "₲",
-  QAR: "ر.ق.",
-  RON: "L",
-  RSD: "дин",
-  RUB: "₽",
-  RWF: "R₣",
-  SAR: "ر.س.",
-  SBD: "$",
-  SCR: "Rs",
-  SDG: "ج.س.",
-  SEK: "kr",
-  SGD: "$",
-  SHP: "£",
-  SLL: "Le",
-  SLS: "Sl",
-  SOS: "Ssh",
-  SRD: "$",
-  SSP: "SS£",
-  STN: "Db",
-  SVC: "₡",
-  SYP: "ل.س.",
-  SZL: "L",
-  THB: "฿",
-  TJS: "SM",
-  TMT: "T",
-  TND: "د.ت.",
-  TOP: "PT",
-  TTD: "$",
-  TVD: "$",
-  TWD: "圓",
-  TZS: "TSh",
-  UAH: "грн",
-  UGX: "Sh",
-  UYU: "$",
-  UZS: "сум",
-  VED: "Bs.",
-  VES: "Bs.F",
-  VND: "₫",
-  VUV: "VT",
-  WST: "ST",
-  XAF: "Fr.",
-  XCD: "$",
-  XOF: "₣",
-  XPF: "₣",
-  YER: "ر.ي.",
-  ZAR: "R",
-  ZMW: "ZK",
-  ZWB: "",
-  ZWL: "$",
-  Abkhazia: "",
-  Artsakh: "դր.",
-};