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

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ikas/storefront",
-  "version": "4.0.0-alpha.28",
+  "version": "4.0.0-alpha.3",
   "description": "Storefront functionality for ikas storefront themes.",
   "author": "Umut Ozan Yıldırım",
   "license": "ISC",
@@ -24,18 +24,18 @@
     "libphonenumber-js": "^1.10.6"
   },
   "devDependencies": {
-    "@ikas/storefront-api": "^4.0.0-alpha.28",
-    "@ikas/storefront-config": "^4.0.0-alpha.28",
-    "@ikas/storefront-model-functions": "^4.0.0-alpha.28",
-    "@ikas/storefront-models": "^4.0.0-alpha.28",
-    "@ikas/storefront-providers": "^4.0.0-alpha.28",
+    "@ikas/storefront-api": "^4.0.0-alpha.3",
+    "@ikas/storefront-config": "^4.0.0-alpha.3",
+    "@ikas/storefront-model-functions": "^4.0.0-alpha.3",
+    "@ikas/storefront-models": "^4.0.0-alpha.3",
+    "@ikas/storefront-providers": "^4.0.0-alpha.3",
     "@rollup/plugin-commonjs": "^22.0.0",
     "@rollup/plugin-json": "^4.1.0",
     "@rollup/plugin-node-resolve": "^13.3.0",
     "@types/react-phone-number-input": "^3.0.10",
     "mobx": "^6.1.3",
     "mobx-react-lite": "^3.1.5",
-    "next": "12.2.0",
+    "next": "canary",
     "prettier": "^2.2.1",
     "react": "17.0.2",
     "react-dom": "17.0.2",
@@ -52,14 +52,14 @@
     "html-react-parser": "^1.4.0"
   },
   "peerDependencies": {
-    "@ikas/storefront-api": "^4.0.0-alpha.28",
-    "@ikas/storefront-config": "^4.0.0-alpha.28",
-    "@ikas/storefront-model-functions": "^4.0.0-alpha.28",
-    "@ikas/storefront-models": "^4.0.0-alpha.28",
-    "@ikas/storefront-providers": "^4.0.0-alpha.28",
+    "@ikas/storefront-api": "^4.0.0-alpha.3",
+    "@ikas/storefront-config": "^4.0.0-alpha.3",
+    "@ikas/storefront-model-functions": "^4.0.0-alpha.3",
+    "@ikas/storefront-models": "^4.0.0-alpha.3",
+    "@ikas/storefront-providers": "^4.0.0-alpha.3",
     "mobx": "^6.1.3",
     "mobx-react-lite": "^3.1.5",
-    "next": "12.2.0",
+    "next": "canary",
     "react": "17.0.2",
     "react-dom": "17.0.2",
     "lodash": "^4.17.20",

package/src/analytics/analytics.ts

@@ -54,7 +54,6 @@ export class Analytics {
       const customerInfo = await Analytics.getCustomerInfo();
 
       GoogleTagManager.pageView(url);
-      GoogleUniversal.pageView(window.location.pathname);
       IkasAnalytics.pageView(pageType);
 
       tryForEach(Analytics.subscribers, (s) => {
@@ -195,7 +194,7 @@ export class Analytics {
     try {
       localStorage.removeItem(LS_BEGIN_CHECKOUT_KEY);
 
-      FacebookPixel.purchase(checkout, transaction.id || "");
+      FacebookPixel.purchase(checkout, checkout.orderNumber || "");
       GoogleTagManager.purchase(checkout, checkout.orderNumber || "");
       IkasAnalytics.orderSuccess(checkout);
       GoogleAnalytics.purchase(checkout, checkout.orderNumber || "");

package/src/analytics/googleUniversal.ts

@@ -8,23 +8,12 @@ export class GoogleUniversal {
     makeAutoObservable(this);
   }
 
-  static pageView(url: string) {
-    try {
-      if (!isServer && (window as any).ga) {
-        (window as any).ga("set", "page", url);
-        (window as any).ga("send", "pageview");
-      }
-      return;
-    } catch (err) {
-      console.error(err);
-    }
-  }
-
   static productView(productDetail: IkasProduct) {
     try {
       if (!isServer && (window as any).ga) {
         (window as any).ga("ec:addProduct", productToGUItem(productDetail));
         (window as any).ga("ec:setAction", "detail");
+        (window as any).ga("send", "pageview");
       }
       return;
     } catch (err) {
@@ -90,6 +79,7 @@ export class GoogleUniversal {
           shipping: "" + checkout.shippingTotal,
           coupon: checkout.couponCode,
         });
+        (window as any).ga("send", "pageview");
       }
       return;
     } catch (err) {

package/src/analytics/head/index.tsx

@@ -79,7 +79,8 @@ export const AnalyticsHead: React.FC<HeadProps> = observer(({ blockHTML }) => {
             dangerouslySetInnerHTML={{
               __html: `window.ga=window.ga||function(){(ga.q=ga.q||[]).push(arguments)};ga.l=+new Date;
               ga('create', '${universalAnalyticsId}', 'auto');
-              ga('require', 'ec');`,
+              ga('require', 'ec');
+              ga('send', 'pageview');`,
             }}
           />
           <script

package/src/analytics/ikas.ts

@@ -181,10 +181,6 @@ export default class IkasAnalytics {
       } else {
         await this.createSessionId();
       }
-
-      IkasStorefrontConfig.init({
-        sessionId: this.sessionId || "",
-      });
     } catch (err) {
       console.error(err);
     }
@@ -200,10 +196,6 @@ export default class IkasAnalytics {
         this.visitorId = Date.now() + "";
         localStorage.setItem(this.VISITOR_ID_KEY, this.visitorId);
       }
-
-      IkasStorefrontConfig.init({
-        visitorId: this.visitorId,
-      });
     } catch (err) {
       console.error(err);
     }

package/src/components/checkout/components/address-form/index.tsx

@@ -315,7 +315,7 @@ const CityInput: React.FC<FormItemProps> = observer(({ vm }) => {
   return (
     <FormItem
       type={FormItemType.TEXT}
-      autocomplete="address-level2"
+      autocomplete="address-level3"
       label={t("checkout-page:city")}
       value={vm.city?.name || ""}
       onChange={vm.onCityInputChange}

package/src/components/checkout/components/form-item/index.tsx

@@ -7,7 +7,6 @@ import styles from "./style.module.scss";
 
 import { useTranslation } from "../../../../utils";
 import ReactTooltip from "react-tooltip";
-import { PhoneNumberInput } from "../phone-number-input";
 
 export const FormItem: React.FC<Props> = observer((props) => {
   const { t } = useTranslation();
@@ -109,14 +108,17 @@ export const FormItem: React.FC<Props> = observer((props) => {
             />
           )}
           {vm.type === FormItemType.TEL && (
-            <PhoneNumberInput
-              key={props.currentCountryCode || "1"}
-              disabled={vm.disabled}
-              defaultCountry={props.currentCountryCode}
-              placeholder={t("checkout-page:enterPhoneNumber")}
-              value={vm.value ? vm.value : ""}
-              onChange={vm.onPhoneChange}
-            />
+            <div></div>
+            // <PhoneInput
+            //   key={props.currentCountryCode || "1"}
+            //   disabled={vm.disabled}
+            //   defaultCountry={props.currentCountryCode}
+            //   placeholder={t("checkout-page:enterPhoneNumber")}
+            //   value={vm.value ? vm.value : ""}
+            //   onChange={vm.onPhoneChange}
+            //   international={true}
+            //   addInternationalOption={false}
+            // />
           )}
           {vm.type === FormItemType.TEXT_AREA && <TextArea vm={vm} />}
           {vm.type === FormItemType.SELECT && (

package/src/components/checkout/components/phone-number-input/get-countries.ts

@@ -1,50 +1,18 @@
-import { IkasStorefrontConfig } from "@ikas/storefront-config";
 import { CountryCode, getCountries as categories } from "libphonenumber-js";
 import compareStrings from "./compare-strings";
 
-export type CountryType = {
+import en from "./locale/en";
+
+type CountryType = {
   value: CountryCode;
   label: string | undefined;
 };
 
-const getUrl = () => {
-  const languages = [
-    "de",
-    "el",
-    "en",
-    "es",
-    "fi",
-    "fr",
-    "it",
-    "nb",
-    "pl",
-    "pt-BR",
-    "pt",
-    "ru",
-    "sv",
-    "tr",
-    "ua",
-    "vi",
-  ];
-
-  let locale = IkasStorefrontConfig.getCurrentLocale();
-
-  if (!languages.some((language) => language === locale)) {
-    locale = "en";
-  }
-
-  return `https://cdn.myikas.com/sf/static/locale/country/${locale}.json`;
-};
-
-const getCountries = async (): Promise<CountryType[]> => {
-  const url = getUrl();
-  const response = await fetch(url);
-  const lang = await response.json();
-
+const getCountries = (): CountryType[] => {
   return categories()
     .map((country) => ({
       value: country,
-      label: lang[country],
+      label: en[country],
     }))
     .sort((a, b) => compareStrings(a.label, b.label));
 };

package/src/components/checkout/components/phone-number-input/index.tsx

@@ -6,7 +6,8 @@ import parsePhoneNumber, {
   getCountryCallingCode,
   parseIncompletePhoneNumber,
 } from "libphonenumber-js";
-import getCountries, { CountryType } from "./get-countries";
+
+import getCountries from "./get-countries";
 
 import styles from "./style.module.scss";
 
@@ -18,20 +19,17 @@ type Props = {
   onChange: (value: string) => void;
 };
 
-const DEFAULT_COUNTRY = "TR";
+const countries = getCountries();
 
 export const PhoneNumberInput: React.FC<Props> = observer(
   ({ defaultCountry, disabled = false, placeholder, value, onChange }) => {
-    const [countries, setCountries] = React.useState<CountryType[]>([]);
     const [activeCountry, setActiveCountry] = React.useState(
-      (defaultCountry as CountryCode) || DEFAULT_COUNTRY
+      defaultCountry as CountryCode
     );
     const [formatedValue, setFormatedValue] = React.useState("");
 
     React.useEffect(() => {
-      fetchCountries();
-
-      let countryCode = activeCountry;
+      let countryCode = (defaultCountry as CountryCode) || "TR";
 
       if (value) {
         const parsedPhoneNumber = parsePhoneNumber(value);
@@ -48,11 +46,6 @@ export const PhoneNumberInput: React.FC<Props> = observer(
       setActiveCountry(countryCode);
     }, []);
 
-    const fetchCountries = async () => {
-      const categories = await getCountries();
-      setCountries(categories);
-    };
-
     const onValueChange = (event: React.ChangeEvent<HTMLInputElement>) => {
       const phoneNumber = formatPhoneNumber(event.target.value);
       setFormatedValue(phoneNumber);
@@ -83,7 +76,9 @@ export const PhoneNumberInput: React.FC<Props> = observer(
     };
 
     const getImageSrc = () => {
-      return `https://cdn.myikas.com/sf/assets/flags/3x2/${activeCountry}.svg`;
+      return `https://cdn.myikas.com/sf/assets/flags/3x2/${
+        activeCountry || "TR"
+      }.svg`;
     };
 
     return (
@@ -93,14 +88,14 @@ export const PhoneNumberInput: React.FC<Props> = observer(
             <div className={styles.Flag}>
               <img
                 className={styles.FlagImage}
-                alt={activeCountry}
+                alt={activeCountry || ""}
                 src={getImageSrc()}
               ></img>
               <div className={styles.Arrow}></div>
             </div>
             <select
               className={styles.Select}
-              value={activeCountry}
+              value={activeCountry || ""}
               onChange={onCountryChange}
               disabled={disabled}
             >

package/src/components/checkout/components/phone-number-input/locale/en.ts

@@ -0,0 +1,257 @@
+export default {
+	"AB": "Abkhazia",
+	"AC": "Ascension Island",
+	"AD": "Andorra",
+	"AE": "United Arab Emirates",
+	"AF": "Afghanistan",
+	"AG": "Antigua and Barbuda",
+	"AI": "Anguilla",
+	"AL": "Albania",
+	"AM": "Armenia",
+	"AO": "Angola",
+	"AQ": "Antarctica",
+	"AR": "Argentina",
+	"AS": "American Samoa",
+	"AT": "Austria",
+	"AU": "Australia",
+	"AW": "Aruba",
+	"AX": "Åland Islands",
+	"AZ": "Azerbaijan",
+	"BA": "Bosnia and Herzegovina",
+	"BB": "Barbados",
+	"BD": "Bangladesh",
+	"BE": "Belgium",
+	"BF": "Burkina Faso",
+	"BG": "Bulgaria",
+	"BH": "Bahrain",
+	"BI": "Burundi",
+	"BJ": "Benin",
+	"BL": "Saint Barthélemy",
+	"BM": "Bermuda",
+	"BN": "Brunei Darussalam",
+	"BO": "Bolivia",
+	"BQ": "Bonaire, Sint Eustatius and Saba",
+	"BR": "Brazil",
+	"BS": "Bahamas",
+	"BT": "Bhutan",
+	"BV": "Bouvet Island",
+	"BW": "Botswana",
+	"BY": "Belarus",
+	"BZ": "Belize",
+	"CA": "Canada",
+	"CC": "Cocos (Keeling) Islands",
+	"CD": "Congo, Democratic Republic of the",
+	"CF": "Central African Republic",
+	"CG": "Congo",
+	"CH": "Switzerland",
+	"CI": "Cote d'Ivoire",
+	"CK": "Cook Islands",
+	"CL": "Chile",
+	"CM": "Cameroon",
+	"CN": "China",
+	"CO": "Colombia",
+	"CR": "Costa Rica",
+	"CU": "Cuba",
+	"CV": "Cape Verde",
+	"CW": "Curaçao",
+	"CX": "Christmas Island",
+	"CY": "Cyprus",
+	"CZ": "Czech Republic",
+	"DE": "Germany",
+	"DJ": "Djibouti",
+	"DK": "Denmark",
+	"DM": "Dominica",
+	"DO": "Dominican Republic",
+	"DZ": "Algeria",
+	"EC": "Ecuador",
+	"EE": "Estonia",
+	"EG": "Egypt",
+	"EH": "Western Sahara",
+	"ER": "Eritrea",
+	"ES": "Spain",
+	"ET": "Ethiopia",
+	"FI": "Finland",
+	"FJ": "Fiji",
+	"FK": "Falkland Islands",
+	"FM": "Federated States of Micronesia",
+	"FO": "Faroe Islands",
+	"FR": "France",
+	"GA": "Gabon",
+	"GB": "United Kingdom",
+	"GD": "Grenada",
+	"GE": "Georgia",
+	"GF": "French Guiana",
+	"GG": "Guernsey",
+	"GH": "Ghana",
+	"GI": "Gibraltar",
+	"GL": "Greenland",
+	"GM": "Gambia",
+	"GN": "Guinea",
+	"GP": "Guadeloupe",
+	"GQ": "Equatorial Guinea",
+	"GR": "Greece",
+	"GS": "South Georgia and the South Sandwich Islands",
+	"GT": "Guatemala",
+	"GU": "Guam",
+	"GW": "Guinea-Bissau",
+	"GY": "Guyana",
+	"HK": "Hong Kong",
+	"HM": "Heard Island and McDonald Islands",
+	"HN": "Honduras",
+	"HR": "Croatia",
+	"HT": "Haiti",
+	"HU": "Hungary",
+	"ID": "Indonesia",
+	"IE": "Ireland",
+	"IL": "Israel",
+	"IM": "Isle of Man",
+	"IN": "India",
+	"IO": "British Indian Ocean Territory",
+	"IQ": "Iraq",
+	"IR": "Iran",
+	"IS": "Iceland",
+	"IT": "Italy",
+	"JE": "Jersey",
+	"JM": "Jamaica",
+	"JO": "Jordan",
+	"JP": "Japan",
+	"KE": "Kenya",
+	"KG": "Kyrgyzstan",
+	"KH": "Cambodia",
+	"KI": "Kiribati",
+	"KM": "Comoros",
+	"KN": "Saint Kitts and Nevis",
+	"KP": "North Korea",
+	"KR": "South Korea",
+	"KW": "Kuwait",
+	"KY": "Cayman Islands",
+	"KZ": "Kazakhstan",
+	"LA": "Laos",
+	"LB": "Lebanon",
+	"LC": "Saint Lucia",
+	"LI": "Liechtenstein",
+	"LK": "Sri Lanka",
+	"LR": "Liberia",
+	"LS": "Lesotho",
+	"LT": "Lithuania",
+	"LU": "Luxembourg",
+	"LV": "Latvia",
+	"LY": "Libya",
+	"MA": "Morocco",
+	"MC": "Monaco",
+	"MD": "Moldova",
+	"ME": "Montenegro",
+	"MF": "Saint Martin (French Part)",
+	"MG": "Madagascar",
+	"MH": "Marshall Islands",
+	"MK": "North Macedonia",
+	"ML": "Mali",
+	"MM": "Burma",
+	"MN": "Mongolia",
+	"MO": "Macao",
+	"MP": "Northern Mariana Islands",
+	"MQ": "Martinique",
+	"MR": "Mauritania",
+	"MS": "Montserrat",
+	"MT": "Malta",
+	"MU": "Mauritius",
+	"MV": "Maldives",
+	"MW": "Malawi",
+	"MX": "Mexico",
+	"MY": "Malaysia",
+	"MZ": "Mozambique",
+	"NA": "Namibia",
+	"NC": "New Caledonia",
+	"NE": "Niger",
+	"NF": "Norfolk Island",
+	"NG": "Nigeria",
+	"NI": "Nicaragua",
+	"NL": "Netherlands",
+	"NO": "Norway",
+	"NP": "Nepal",
+	"NR": "Nauru",
+	"NU": "Niue",
+	"NZ": "New Zealand",
+	"OM": "Oman",
+	"OS": "South Ossetia",
+	"PA": "Panama",
+	"PE": "Peru",
+	"PF": "French Polynesia",
+	"PG": "Papua New Guinea",
+	"PH": "Philippines",
+	"PK": "Pakistan",
+	"PL": "Poland",
+	"PM": "Saint Pierre and Miquelon",
+	"PN": "Pitcairn",
+	"PR": "Puerto Rico",
+	"PS": "Palestine",
+	"PT": "Portugal",
+	"PW": "Palau",
+	"PY": "Paraguay",
+	"QA": "Qatar",
+	"RE": "Reunion",
+	"RO": "Romania",
+	"RS": "Serbia",
+	"RU": "Russia",
+	"RW": "Rwanda",
+	"SA": "Saudi Arabia",
+	"SB": "Solomon Islands",
+	"SC": "Seychelles",
+	"SD": "Sudan",
+	"SE": "Sweden",
+	"SG": "Singapore",
+	"SH": "Saint Helena",
+	"SI": "Slovenia",
+	"SJ": "Svalbard and Jan Mayen",
+	"SK": "Slovakia",
+	"SL": "Sierra Leone",
+	"SM": "San Marino",
+	"SN": "Senegal",
+	"SO": "Somalia",
+	"SR": "Suriname",
+	"SS": "South Sudan",
+	"ST": "Sao Tome and Principe",
+	"SV": "El Salvador",
+	"SX": "Sint Maarten",
+	"SY": "Syria",
+	"SZ": "Swaziland",
+	"TA": "Tristan da Cunha",
+	"TC": "Turks and Caicos Islands",
+	"TD": "Chad",
+	"TF": "French Southern Territories",
+	"TG": "Togo",
+	"TH": "Thailand",
+	"TJ": "Tajikistan",
+	"TK": "Tokelau",
+	"TL": "Timor-Leste",
+	"TM": "Turkmenistan",
+	"TN": "Tunisia",
+	"TO": "Tonga",
+	"TR": "Turkey",
+	"TT": "Trinidad and Tobago",
+	"TV": "Tuvalu",
+	"TW": "Taiwan",
+	"TZ": "Tanzania",
+	"UA": "Ukraine",
+	"UG": "Uganda",
+	"UM": "United States Minor Outlying Islands",
+	"US": "United States",
+	"UY": "Uruguay",
+	"UZ": "Uzbekistan",
+	"VA": "Holy See (Vatican City State)",
+	"VC": "Saint Vincent and the Grenadines",
+	"VE": "Venezuela",
+	"VG": "Virgin Islands, British",
+	"VI": "Virgin Islands, U.S.",
+	"VN": "Vietnam",
+	"VU": "Vanuatu",
+	"WF": "Wallis and Futuna",
+	"WS": "Samoa",
+	"XK": "Kosovo",
+	"YE": "Yemen",
+	"YT": "Mayotte",
+	"ZA": "South Africa",
+	"ZM": "Zambia",
+	"ZW": "Zimbabwe",
+	"ZZ": "International"
+}

package/src/components/checkout/model.ts

@@ -53,6 +53,10 @@ import {
   RetrieveInstallmentInfoQueryParams,
   SaveCartInput,
 } from "@ikas/storefront-api";
+import { OrderAddressCountryInputData } from "@ikas/storefront-api/build/__api/models/OrderAddressCountryInput";
+import { OrderAddressCityInputData } from "@ikas/storefront-api/build/__api/models/OrderAddressCityInput";
+import { OrderAddressStateInputData } from "@ikas/storefront-api/build/__api/models/OrderAddressStateInput";
+import { OrderAddressDistrictInputData } from "@ikas/storefront-api/build/__api/models/OrderAddressDistrictInput";
 
 const NUMBER_ONLY_REGEX = /^\d+$/;
 const MAX_CARD_NUMBER_LENGTH = 16;
@@ -440,10 +444,7 @@ export default class CheckoutViewModel {
       input = await this.inStockDeliveryInputData(input);
     }
 
-    if (
-      this.step === CheckoutStep.INFO ||
-      this.step === CheckoutStep.SHIPPING
-    ) {
+    if (this.step === CheckoutStep.INFO) {
       input.billingAddress = null;
     }
 
@@ -479,11 +480,13 @@ export default class CheckoutViewModel {
       inStoreLocation.address
     ) {
       inputData.shippingAddress.country = inStoreLocation.address
-        .country as any;
-      inputData.shippingAddress.city = inStoreLocation.address.city as any;
-      inputData.shippingAddress.state = inStoreLocation.address.state as any;
+        .country as OrderAddressCountryInputData;
+      inputData.shippingAddress.city = inStoreLocation.address
+        .city as OrderAddressCityInputData;
+      inputData.shippingAddress.state = inStoreLocation.address
+        .state as OrderAddressStateInputData;
       inputData.shippingAddress.district = inStoreLocation.address
-        .district as any;
+        .district as OrderAddressDistrictInputData;
       inputData.shippingAddress.postalCode = inStoreLocation.address.postalCode;
       inputData.shippingAddress.addressLine1 =
         inStoreLocation.address.address || "";

package/src/components/checkout/modelMasterPass.ts

@@ -6,7 +6,7 @@ import { useTranslation } from "../../utils/i18n";
 import { IkasBaseStore } from "../../store";
 import { IkasCheckout, IkasPaymentGateway } from "../../models";
 import { MasterPassOperationTypeEnum } from "@ikas/storefront-api";
-import { getMasterPassRequestToken } from "@ikas/storefront-api";
+import { getMasterpassRequestToken } from "@ikas/storefront-api";
 import { IkasStorefrontConfig } from "@ikas/storefront-config";
 
 const isServer = typeof localStorage === "undefined";
@@ -437,7 +437,7 @@ export default class MasterPassModel {
     operationType: MasterPassOperationTypeEnum;
     phoneNumber: string;
   }) => {
-    const response = await getMasterPassRequestToken({
+    const response = await getMasterpassRequestToken({
       cartId,
       paymentGatewayId,
       operationType,

package/src/components/page/head.tsx

@@ -251,18 +251,6 @@ function createStoreSchema(merchantSettings: IkasMerchantSettings) {
     logo: logo,
     image: logo,
     url: "https://" + IkasStorefrontConfig.getDomain(),
-    telephone: merchantSettings?.phone,
-    address: {
-      "@type": "PostalAddress",
-      streetAddress: merchantSettings.address?.addressLine1,
-      addressLocality: merchantSettings.address?.city?.name,
-      ...(merchantSettings.address &&
-        merchantSettings.address.state && {
-          addressRegion: merchantSettings.address.state.code,
-        }),
-      postalCode: merchantSettings.address?.postalCode,
-      addressCountry: merchantSettings.address?.country?.code,
-    },
   };
 }
 

package/src/components/page/index.tsx

@@ -19,7 +19,6 @@ import { ThemeComponent } from "./ThemeComponent";
 import { IkasBaseStore } from "../../store";
 import { initIkasEvents } from "../../analytics/events";
 import { IkasPageDataInit } from "../../page-data-init";
-import { setAPIClientConfig } from "@ikas/storefront-api";
 
 export type IkasPageProps = {
   propValues: IkasPageComponentPropValue[];
@@ -56,16 +55,15 @@ export const IkasPage: React.FC<IkasPageProps> = observer(
     productReviewSummary,
   }) => {
     const router = useRouter();
+    const store = IkasBaseStore.getInstance();
+    store.router = router;
 
     IkasStorefrontConfig.init({
       ...configJson,
       currentPageComponents: components,
     });
     IkasBaseStore.getInstance().router = router;
-    setAPIClientConfig();
 
-    const store = IkasBaseStore.getInstance();
-    store.router = router;
     store.currentPageType = pageType;
 
     const [isBrowser, setIsBrowser] = React.useState(false);

package/src/components/page-editor/model.ts

@@ -23,7 +23,6 @@ import HtmlMetaDataStore from "../../store/html-meta-data";
 import BlogStore from "../../store/blog";
 import RaffleStore from "../../store/raffle";
 import ProductStore from "../../store/product";
-import { setAPIClientConfig } from "@ikas/storefront-api";
 
 const PACKAGE_VERSION = "2.0.20";
 // import { version as PACKAGE_VERSION } from "../../../package.json";
@@ -566,12 +565,7 @@ export default class IkasPageEditorViewModel {
         translations: this.translations || {},
         isEditor: true,
         apiKey: data.apiKey,
-        apiUrl: data.apiUrl,
-        adminApiUrl: data.adminApiUrl,
-        cdnUrl: data.cdnUrl,
       });
-
-      setAPIClientConfig();
     }
 
     // (window as any).editorApiKey = data.apiKey;
@@ -624,6 +618,8 @@ export default class IkasPageEditorViewModel {
     await this.pageDataProvider.setLinkSlugs();
 
     if (pageComponentPropValues) {
+      pageComponentPropValues.propValues[propName] = propValue;
+
       if (prop.type === IkasThemeJsonComponentPropType.CUSTOM) {
         IkasPageDataInit.initCustomDataPropValue(
           prop,
@@ -654,12 +650,6 @@ export default class IkasPageEditorViewModel {
           propValue,
           pageComponentPropValues
         );
-      } else if (prop.type === IkasThemeJsonComponentPropType.PRODUCT_LIST) {
-        IkasPageDataInit.initProductListPropValue(
-          prop,
-          propValue,
-          pageComponentPropValues
-        );
       } else if (prop.type === IkasThemeJsonComponentPropType.CATEGORY) {
         IkasPageDataInit.initCategoryPropValue(
           prop,
@@ -699,8 +689,6 @@ export default class IkasPageEditorViewModel {
           propValue,
           pageComponentPropValues
         );
-      } else {
-        pageComponentPropValues.propValues[propName] = propValue;
       }
     }
   };

package/src/models/data/merchant-settings/index.ts

@@ -1,18 +1,15 @@
 import {
   IkasMerchantSettingsCurrencyFormat,
   IkasMerchantSettings as IMerchantSettings,
-  IkasMerchantAddress,
 } from "@ikas/storefront-models";
 import { makeAutoObservable } from "mobx";
 import { IkasImage } from "../image";
 
 export class IkasMerchantSettings implements IMerchantSettings {
   currencyFormats: IkasMerchantSettingsCurrencyFormat[] | null;
-  address: IkasMerchantAddress | null;
   logoId: string | null;
   merchantId: string;
   merchantName: string;
-  phone: string | null;
 
   // Extra
   logo?: IkasImage | null;
@@ -22,9 +19,6 @@ export class IkasMerchantSettings implements IMerchantSettings {
     this.logoId = data.logoId;
     this.merchantId = data.merchantId;
     this.merchantName = data.merchantName;
-    this.phone = data.phone || null;
-    this.address = data.address || null;
-
     this.logo = data.logo ? new IkasImage(data.logo) : null;
 
     makeAutoObservable(this);

package/src/models/data/product/variant-type/index.ts

@@ -3,12 +3,10 @@ import { IkasProductVariantType as IProductVariantType } from "@ikas/storefront-
 import { makeAutoObservable } from "mobx";
 
 export class IkasProductVariantType implements IProductVariantType {
-  order: number;
   variantType: IkasVariantType;
   variantValueIds: string[];
 
   constructor(data: Partial<IkasProductVariantType>) {
-    this.order = data.order || 0;
     this.variantType = data.variantType
       ? new IkasVariantType(data.variantType)
       : new IkasVariantType();

package/src/models/data/storefront/index.ts

@@ -20,7 +20,6 @@ export class IkasStorefront implements IStorefront {
   analytics4Id: string | null;
   universalAnalyticsId: string | null;
   tiktokPixelId: string | null;
-  token: string | null;
 
   localizations: IkasStorefrontLocalization[];
   routings: IkasStorefrontRouting[];
@@ -41,7 +40,6 @@ export class IkasStorefront implements IStorefront {
     this.analytics4Id = data.analytics4Id || null;
     this.universalAnalyticsId = data.universalAnalyticsId || null;
     this.tiktokPixelId = data.tiktokPixelId || null;
-    this.token = data.token || null;
 
     // Sub Models
     this.localizations = data.localizations

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

@@ -221,6 +221,12 @@ export class IkasProductList {
 
   get filterQueryParams() {
     const queryParams: Record<string, any> = {};
+    const _getQueryParams = this.getQueryParams();
+    if (_getQueryParams) {
+      _getQueryParams.forEach((value, key) => {
+        queryParams[key] = value;
+      });
+    }
 
     this.filters?.forEach((f) => {
       if (f.keyList.length) queryParams[f.key] = f.keyList;

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

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

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

@@ -183,16 +183,6 @@ 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 "";
@@ -203,8 +193,10 @@ export class PhoneRule<T> extends ValidationRule<T> {
   async run(): Promise<boolean> {
     if (!this.value) return true;
 
-    const result = this.value.match(/^[\+\d](\d+\s)*\d+$/g);
-    return !!result;
+    const result = this.value.match(/\d/g);
+    return (
+      (!!result && result.length <= 11) || !!/^\+(\d{12})$/gm.test(this.value)
+    );
   }
 }
 
@@ -254,8 +246,15 @@ 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, setAPIClientConfig } from "@ikas/storefront-api";
+import { getCartById } from "@ikas/storefront-api";
 import { IkasStorefrontConfig } from "@ikas/storefront-config";
 import { IkasBaseStore } from "..";
 import { IkasCheckout, IkasCheckoutSettings } from "../models/data";
@@ -35,7 +35,6 @@ 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>; // local only
+  configJson: Record<string, any>;
   components?: Record<string, any>;
 };
 
@@ -19,12 +19,9 @@ 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 response;
+      return true;
     } catch (err) {
       console.log(err);
       return false;
@@ -145,7 +145,7 @@ export class IkasCartStore {
           Analytics.addToCart(item, quantity - oldQuantity, eventId, this.cart);
         }
       }
-      return response;
+      return true;
     } catch (err) {
       console.log(err);
       return false;