@mframework/layer-commerce 0.0.3

package/app/utils/Form/Form.ts

@@ -0,0 +1,46 @@
+/**
+ * M Framework - Flexible backend agnostic framework.
+ *
+ * Copyright © Meeovi, LTD. All rights reserved.
+ * See LICENSE for license details.
+ *
+ * @license OSL-3.0 (Open Software License ("OSL") v. 3.0)
+ * @package mframework/mframework
+ * @link https://github.com/meeovi/mframework
+ */
+
+import { FormFields } from 'Component/Form/Form.type';
+import { ValidationDOMOutput } from '../../utils/Validator/Validator.type';
+
+/**
+ * Returns name: value pair object for form output.
+ * @param fields (Array)
+ * @param validation ({})
+ * @namespace ../../utils/Form/scrollToError
+ */
+export const scrollToError = (fields: FormFields | null, validation: ValidationDOMOutput | boolean = {}): void => {
+    if (typeof validation === 'boolean' || !Array.isArray(fields) || fields.length === 0) {
+        return;
+    }
+
+    const { errorFields = [] } = validation;
+
+    if (errorFields.length === 0) {
+        return;
+    }
+
+    const { name } = (errorFields as Array<Array<{ name: string }>>)[0][0];
+    const errorItem = fields.find(({ name: itemName }) => itemName === name);
+
+    if (!errorItem) {
+        return;
+    }
+
+    const { field } = errorItem as { field: HTMLElement };
+
+    if (field) {
+        field.scrollIntoView({ behavior: 'smooth', block: 'center' });
+    }
+};
+
+export default scrollToError;

package/app/utils/Form/Form.type.ts

@@ -0,0 +1,60 @@
+/**
+ * M Framework - Flexible backend agnostic framework.
+ *
+ * Copyright © Meeovi, LTD. All rights reserved.
+ * See LICENSE for license details.
+ *
+ * @license OSL-3.0 (Open Software License ("OSL") v. 3.0)
+ * @package mframework/mframework-theme
+ * @link https://github.com/meeovi/mframework
+ */
+
+import { FieldDateType } from 'Component/FieldDate/FieldDate.config';
+
+export interface YearRangeAttribute {
+    minYear: number;
+    maxYear: number;
+}
+
+export interface DateRangeAttribute {
+    minDate: Date;
+    maxDate: Date;
+}
+
+export interface DateMap {
+    d: string;
+    m: string;
+    y: string;
+}
+
+export interface DatesData {
+    type: FieldDateType;
+    year?: string;
+    month?: string;
+    day?: string;
+    hours?: string;
+    minutes?: string;
+    ampm?: string;
+    name: string;
+}
+
+export interface DateObject {
+    name: string;
+    type: FieldDateType;
+    value: string;
+}
+
+export interface FieldData<T = FieldValue> {
+    field?: HTMLInputElement;
+    name: string;
+    type: string;
+    value: T;
+}
+
+export type GetFieldsData<AsObject extends boolean = false> = AsObject extends true
+    ? Record<string, DateObject | FieldData>
+    : Array<DateObject | FieldData>;
+
+export type FieldValue<
+    T = unknown, isUnknownValue = true,
+> = isUnknownValue extends true ? string | number | boolean | undefined | Date : T;

package/app/utils/Form/Transform.ts

@@ -0,0 +1,33 @@
+/**
+ * M Framework - Flexible backend agnostic framework.
+ *
+ * Copyright © Meeovi, LTD. All rights reserved.
+ * See LICENSE for license details.
+ *
+ * @license OSL-3.0 (Open Software License ("OSL") v. 3.0)
+ * @package mframework/mframework
+ * @link https://github.com/meeovi/mframework
+ */
+
+import { FieldData, FieldValue } from './Form.type';
+
+/**
+ * Returns name: value pair object for form output.
+ * @param fields (Array|Object)
+ * @returns {{}}
+ * @namespace ../../utils/Form/Transform/transformToNameValuePair
+ */
+export const transformToNameValuePair = <T>(
+    fields: Record<string, FieldData> | FieldData[],
+): T => {
+    const filteredFields: Record<string, FieldValue> = {};
+    const arrayFormat = !Array.isArray(fields) ? Object.values(fields) : fields;
+
+    arrayFormat.forEach(({ value, name }) => {
+        filteredFields[name] = value;
+    });
+
+    return filteredFields as unknown as T;
+};
+
+export default transformToNameValuePair;

package/app/utils/FormPortalCollector/index.ts

@@ -0,0 +1,45 @@
+/**
+ * M Framework - Flexible backend agnostic framework.
+ *
+ * Copyright © Meeovi, LTD. All rights reserved.
+ * See LICENSE for license details.
+ *
+ * @license OSL-3.0 (Open Software License ("OSL") v. 3.0)
+ * @package mframework/mframework
+ * @link https://github.com/meeovi/mframework
+ */
+
+/** @namespace ../../utils/FormPortalCollector/Index */
+export class FormPortalCollector <
+    T extends string,
+    U extends () => void,
+    S extends string,
+> {
+    portalsObservers: Record<string, Record<string, U>> = {};
+
+    subscribe(id: T, f: U, name: S): void {
+        if (this.portalsObservers[id]) {
+            this.portalsObservers[id][name] = f;
+
+            return;
+        }
+
+        this.portalsObservers[id] = { [name]: f };
+    }
+
+    unsubscribe(id: T, name: S): void {
+        if (!this.portalsObservers[id]) {
+            return;
+        }
+        // eslint-disable-next-line fp/no-delete
+        delete this.portalsObservers[id][name];
+    }
+
+    collect(id: S): void[] {
+        const portals = this.portalsObservers[id] || {};
+
+        return Object.values(portals).map((portal) => portal());
+    }
+}
+
+export default FormPortalCollector;

package/app/utils/History/History.type.ts

@@ -0,0 +1,31 @@
+/**
+ * M Framework - Flexible backend agnostic framework.
+ *
+ * Copyright © Meeovi, LTD. All rights reserved.
+ * See LICENSE for license details.
+ *
+ * @license OSL-3.0 (Open Software License ("OSL") v. 3.0)
+ * @package mframework/mframework-theme
+ * @link https://github.com/meeovi/mframework
+ */
+
+import { CategoryDisplayMode } from '../../routes/CategoryPage/CategoryPage.config';
+import { IndexedProduct } from '../../utils/Product/Product.type';
+
+export interface HistoryState {
+    popupOpen?: boolean;
+    page?: number | Partial<IndexedProduct> | undefined;
+    product?: Partial<IndexedProduct>;
+    isForgotPassword?: boolean;
+    isFromLocked?: boolean;
+    editPassword?: boolean;
+    category?: number | boolean;
+    isFromEmailChange?: boolean;
+    prevCategoryId?: number;
+    stack?: string[];
+    firstName?: string;
+    lastName?: string;
+    email?: string;
+    overlayOpen?: boolean;
+    displayMode?: CategoryDisplayMode;
+}

package/app/utils/History/index.ts

@@ -0,0 +1,17 @@
+/**
+ * M Framework - Flexible backend agnostic framework.
+ *
+ * Copyright © Meeovi, LTD. All rights reserved.
+ * See LICENSE for license details.
+ *
+ * @license OSL-3.0 (Open Software License ("OSL") v. 3.0)
+ * @package mframework/mframework
+ * @link https://github.com/meeovi/mframework
+ */
+
+import { createBrowserHistory } from 'history';
+
+import { HistoryState } from './History.type';
+
+export const history = createBrowserHistory();
+export default history;

package/app/utils/Manipulations/Array.ts

@@ -0,0 +1,18 @@
+/* eslint-disable import/prefer-default-export */
+/**
+ * M Framework - Flexible backend agnostic framework.
+ *
+ * Copyright © Meeovi, LTD. All rights reserved.
+ * See LICENSE for license details.
+ *
+ * @license OSL-3.0 (Open Software License ("OSL") v. 3.0)
+ * @package mframework/mframework
+ * @link https://github.com/meeovi/mframework
+ */
+
+/** @namespace ../../utils/Manipulations/Array/range */
+export const range = (start: number, end: number): Array<number> => {
+    const length = end - start + 1;
+
+    return Array.from({ length }, (_, i) => start + i);
+};

package/app/utils/Manipulations/Date.ts

@@ -0,0 +1,36 @@
+/**
+ * M Framework - Flexible backend agnostic framework.
+ *
+ * Copyright © Meeovi, LTD. All rights reserved.
+ * See LICENSE for license details.
+ *
+ * @license OSL-3.0 (Open Software License ("OSL") v. 3.0)
+ * @package mframework/mframework
+ * @link https://github.com/meeovi/mframework
+ */
+
+import { getDateValue } from '../../utils/Form/Extract';
+
+export const MILLISECONDS_PER_MINUTE = 60000;
+
+/** @namespace ../../utils/Manipulations/Date/convertStringToDate */
+export const convertStringToDate = (stringDate: string, options?: Intl.DateTimeFormatOptions): string => {
+    const defaultOptions: Intl.DateTimeFormatOptions = {
+        year: 'numeric',
+        month: 'long',
+        day: 'numeric',
+    };
+    const date = new Date(stringDate.replace(/\s/, 'T'));
+    const language = navigator.languages ? navigator.languages[0] : navigator.language;
+
+    return date.toLocaleDateString(language, options || defaultOptions);
+};
+
+/** @namespace ../../utils/Manipulations/Date/getTimeInCurrentTimezone */
+export const getTimeInCurrentTimezone = (timestamp: string): number | string | Date => {
+    const currentDate = new Date();
+    const timezone = currentDate.getTimezoneOffset() * MILLISECONDS_PER_MINUTE;
+    const timeInCurrentTimezone = new Date(timestamp.replace(/-/g, '/')).getTime() - new Date(timezone).getTime();
+
+    return getDateValue(timeInCurrentTimezone);
+};

package/app/utils/Manipulations/index.ts

@@ -0,0 +1,14 @@
+/* eslint-disable import/prefer-default-export */
+/**
+ * M Framework - Flexible backend agnostic framework.
+ *
+ * Copyright © Meeovi, LTD. All rights reserved.
+ * See LICENSE for license details.
+ *
+ * @license OSL-3.0 (Open Software License ("OSL") v. 3.0)
+ * @package mframework/mframework
+ * @link https://github.com/meeovi/mframework
+ */
+
+export { range } from './Array';
+export * from './Date';

package/app/utils/Media/Media.ts

@@ -0,0 +1,27 @@
+/**
+ * M Framework - Flexible backend agnostic framework.
+ *
+ * Copyright © Meeovi, LTD. All rights reserved.
+ * See LICENSE for license details.
+ *
+ * @license OSL-3.0 (Open Software License ("OSL") v. 3.0)
+ * @package mframework/mframework
+ * @link https://github.com/meeovi/mframework
+ */
+import { getStoreState } from '../../utils/Store';
+
+export const WYSIWYG_MEDIA = 'wysiwyg/';
+export const CATEGORY_MEDIA = 'catalog/category/';
+export const PRODUCT_MEDIA = 'catalog/product';
+export const LOGO_MEDIA = 'logo/';
+
+export default (src: string, subPath = '', isMediaPath = true): string => {
+    // If isMediaPath is passed return local media path
+
+    const { ConfigReducer: { secure_base_media_url, base_url } = {} } = getStoreState();
+    const baseUrl = isMediaPath
+        ? secure_base_media_url || '/media/'
+        : base_url;
+
+    return `${ baseUrl }${ subPath }${ src }`;
+};

package/app/utils/Media/index.ts

@@ -0,0 +1,13 @@
+/**
+ * M Framework - Flexible backend agnostic framework.
+ *
+ * Copyright © Meeovi, LTD. All rights reserved.
+ * See LICENSE for license details.
+ *
+ * @license OSL-3.0 (Open Software License ("OSL") v. 3.0)
+ * @package mframework/mframework
+ * @link https://github.com/meeovi/mframework
+ */
+export {
+    default, WYSIWYG_MEDIA, PRODUCT_MEDIA, CATEGORY_MEDIA,
+} from './Media';

package/app/utils/Menu/Menu.ts

@@ -0,0 +1,116 @@
+/**
+ * M Framework - Flexible backend agnostic framework.
+ *
+ * Copyright © Meeovi, LTD. All rights reserved.
+ * See LICENSE for license details.
+ *
+ * @license OSL-3.0 (Open Software License ("OSL") v. 3.0)
+ * @package mframework/mframework
+ * @link https://github.com/meeovi/mframework
+ */
+
+import { MenuItem } from '../../normalizers/Menu.type';
+import { getUrlPathname } from '../../utils/Url';
+
+import { FormattedMenuItem, MenuLocation } from './Menu.type';
+
+/**
+ * Given an array of menu items, returns a copy of the array, sorted by their parent ID, then by their sort order (position)
+ *
+ * @param unsortedItems an array of items to be sorted
+ * @returns {array} the sorted array
+ * @namespace ../../utils/Menu/getSortedItems
+ */
+export const getSortedItems = <T extends MenuItem | FormattedMenuItem>(
+    unsortedItems: T[],
+): T[] => Array.from(unsortedItems).sort((
+        { parent_id: PID, position: P },
+        { parent_id: prevPID, position: prevP },
+    ) => (PID - prevPID) || (P - prevP));
+
+/** @namespace ../../utils/Menu */
+export class Menu {
+    menu: Record<string, FormattedMenuItem> = {};
+
+    menuPositionReference: Record<string, number[]> = {};
+
+    getMenuUrl(
+        { url, category_id, display_mode }: Pick<
+        MenuItem,
+        'url'
+        | 'category_id'
+        | 'display_mode'>,
+    ): MenuLocation | string {
+        return {
+            pathname: getUrlPathname(url),
+            search: '',
+            state: {
+                category: category_id,
+                displayMode: display_mode,
+            },
+        };
+    }
+
+    getMenuData({
+        url,
+        category_id,
+        display_mode,
+        ...item
+    }: MenuItem): FormattedMenuItem {
+        return {
+            ...item,
+            url: this.getMenuUrl({ url, category_id, display_mode }),
+            children: {},
+        };
+    }
+
+    setToValue(obj: Record<string, FormattedMenuItem>, path: string, value: FormattedMenuItem): void {
+        // eslint-disable-next-line fp/no-let
+        let i;
+
+        const pathArray = path.split('.');
+
+        // eslint-disable-next-line fp/no-let, @typescript-eslint/no-explicit-any
+        let tmpObj: Record<string, any> = obj;
+
+        // eslint-disable-next-line fp/no-loops
+        for (i = 0; i < pathArray.length - 1; i++) {
+            tmpObj = tmpObj[pathArray[i]];
+        }
+
+        tmpObj[pathArray[i]] = value;
+    }
+
+    createItem(data: MenuItem): void {
+        const { parent_id, item_id } = data;
+
+        if (parent_id === 0) {
+            this.menuPositionReference[item_id] = [];
+            this.menu[item_id] = this.getMenuData(data);
+        } else if (this.menuPositionReference[parent_id] !== undefined) {
+            this.menuPositionReference[item_id] = [
+                ...this.menuPositionReference[parent_id],
+                parent_id,
+            ];
+
+            this.setToValue(
+                this.menu,
+                `${this.menuPositionReference[item_id].join('.children.')}.children.${item_id}`,
+                this.getMenuData(data),
+            );
+        }
+    }
+
+    reduce(unsortedItems: MenuItem[]): Record<string, FormattedMenuItem> {
+        this.menu = {};
+        this.menuPositionReference = {};
+
+        getSortedItems(unsortedItems).forEach((realMenuItem) => {
+            this.createItem(realMenuItem);
+        });
+
+        return this.menu;
+    }
+}
+
+export default new Menu();

package/app/utils/Menu/Menu.type.ts

@@ -0,0 +1,37 @@
+/**
+ * M Framework - Flexible backend agnostic framework.
+ *
+ * Copyright © Meeovi, LTD. All rights reserved.
+ * See LICENSE for license details.
+ *
+ * @license OSL-3.0 (Open Software License ("OSL") v. 3.0)
+ * @package mframework/mframework-theme
+ * @link https://github.com/meeovi/mframework
+ */
+
+import { MenuItem } from '../../normalizers/Menu.type';
+import { CategoryDisplayMode } from '../../routes/CategoryPage/CategoryPage.config';
+import { Merge } from '../../types/Common.type';
+
+export interface MenuLocation {
+    pathname: string;
+    search: string;
+    state: {
+        category?: number;
+        page?: boolean;
+        displayMode?: CategoryDisplayMode;
+    };
+}
+
+export type FormattedMenuItem = Merge<
+Omit<MenuItem, 'cms_page_identifier' | 'url_type' | 'category_id' | 'display_mode'>,
+{
+    url: MenuLocation | string;
+    children: Record<string, FormattedMenuItem>;
+}>;
+
+export enum MenuItemType {
+    TYPE_CUSTOM_URL,
+    TYPE_CMS_PAGE,
+    TYPE_CATEGORY,
+}

package/app/utils/Menu/index.ts

@@ -0,0 +1,12 @@
+/**
+ * M Framework - Flexible backend agnostic framework.
+ *
+ * Copyright © Meeovi, LTD. All rights reserved.
+ * See LICENSE for license details.
+ *
+ * @license OSL-3.0 (Open Software License ("OSL") v. 3.0)
+ * @package mframework/mframework
+ * @link https://github.com/meeovi/mframework
+ */
+
+export { default, getSortedItems } from './Menu';

package/app/utils/Mobile/index.ts

@@ -0,0 +1,13 @@
+/**
+ * M Framework - Flexible backend agnostic framework.
+ *
+ * Copyright © Meeovi, LTD. All rights reserved.
+ * See LICENSE for license details.
+ *
+ * @license OSL-3.0 (Open Software License ("OSL") v. 3.0)
+ * @package mframework/mframework
+ * @link https://github.com/meeovi/mframework
+ */
+
+export { default } from './isMobile';
+export * from './isMobile';

package/app/utils/Mobile/isMobile.ts

@@ -0,0 +1,34 @@
+/**
+ * M Framework - Flexible backend agnostic framework.
+ *
+ * Copyright © Meeovi, LTD. All rights reserved.
+ * See LICENSE for license details.
+ *
+ * @license OSL-3.0 (Open Software License ("OSL") v. 3.0)
+ * @package mframework/mframework
+ * @link https://github.com/meeovi/mframework
+ */
+export const isUsingClientHints = 'userAgentData' in navigator;
+
+export const isMobile = {
+    android: (agent = navigator.userAgent): boolean => /android/i.test(agent),
+    blackBerry: (agent = navigator.userAgent): boolean => /blackberry/i.test(agent),
+    iOS: (agent = navigator.userAgent): boolean => /iphone|ipod|ipad/i.test(agent),
+    opera: (agent = navigator.userAgent): boolean => /opera mini/i.test(agent),
+    // see https://developer.chrome.com/docs/multidevice/user-agent/ for details
+    safari: (agent = navigator.userAgent): boolean => /safari/i.test(agent)
+        && !/chrome/i.test(agent)
+        && !/CriOS/i.test(agent)
+        && !/FxiOS/i.test(agent),
+    windows: (agent = navigator.userAgent): boolean => /iemobile/i.test(agent),
+    // iPad uses 810 so we need to handle that.
+    any: (): boolean => window.matchMedia('(max-width: 810px)').matches && window.matchMedia('screen').matches,
+    standaloneMode: (): boolean => window.matchMedia('(display-mode: standalone)').matches,
+};
+
+// https://medium.com/@galmeiri/get-ready-for-chrome-user-agent-string-phase-out-c6840da1c31e
+export const isMobileClientHints = {
+    getDeviceData: (): Promise<UADataValues> => navigator.userAgentData.getHighEntropyValues(['platform', 'model']),
+};
+
+export default isMobile;

package/app/utils/Orders/Orders.ts

@@ -0,0 +1,71 @@
+/* eslint-disable import/prefer-default-export */
+/**
+ * M Framework - Flexible backend agnostic framework.
+ *
+ * Copyright © Meeovi, LTD. All rights reserved.
+ * See LICENSE for license details.
+ *
+ * @license OSL-3.0 (Open Software License ("OSL") v. 3.0)
+ * @package mframework/mframework-theme
+ * @link https://github.com/meeovi/mframework
+ */
+
+import {
+    InvoiceItem, OrderItem, OrderItemProduct, RefundItem, ShipmentItemInterface,
+} from '../../normalizers/Order.type';
+import { decodeBase64 } from '../../utils/Base64';
+
+import { OrderItemQtyArray } from './Orders.type';
+
+/** @namespace ../../utils/Orders/getFormattedDate */
+export const getFormattedDate = (rawDate = ''): string => {
+    const date = new Date(rawDate.replace(/\s/, 'T'));
+    const RADIX = 10;
+
+    const addLeadingZero = (value: number) => (value < RADIX ? `0${value}` : value);
+
+    const day = addLeadingZero(date.getDate());
+    const month = addLeadingZero(date.getMonth() + 1);
+
+    return `${date.getFullYear()}-${month}-${day}`;
+};
+
+/** @namespace ../../utils/Orders/formatOrders */
+export const formatOrders = (orders: OrderItem[]): OrderItem[] => orders.reduceRight((acc: OrderItem[], order) => {
+    const { order_date, id: uid } = order;
+    const formattedDate = getFormattedDate(order_date);
+
+    return [
+        ...acc,
+        {
+            ...order,
+            id: decodeBase64(uid),
+            created_at: formattedDate,
+        },
+    ];
+}, []);
+
+/** @namespace ../../utils/Orders/getOrderItemQtyToArray */
+export const getOrderItemQtyToArray = (
+    product: OrderItemProduct
+    | ShipmentItemInterface
+    | InvoiceItem
+    | RefundItem,
+): OrderItemQtyArray => ({
+    quantity_ordered: 'quantity_ordered' in product ? product.quantity_ordered : 0,
+    quantity_canceled: 'quantity_canceled' in product ? product.quantity_canceled : 0,
+    quantity_invoiced: 'quantity_invoiced' in product ? product.quantity_invoiced : 0,
+    quantity_refunded: 'quantity_refunded' in product ? product.quantity_refunded : 0,
+    quantity_returned: 'quantity_returned' in product ? product.quantity_returned : 0,
+    quantity_shipped: 'quantity_shipped' in product ? product.quantity_shipped : 0,
+});
+
+/** @namespace ../../utils/Orders/getProductFromOrder */
+export const getProductFromOrder = (
+    allProducts: OrderItemProduct[],
+    requiredProductSku: string,
+): OrderItemProduct | undefined => allProducts.find(({ product_sku }) => product_sku === requiredProductSku);
+
+/** @namespace ../../utils/Orders/getOrderItemRowDiscount */
+export const getOrderItemRowDiscount = (discounts: Array<{ amount: { value?: string | number } }>): number => discounts
+    .reduce((currentValue, { amount: { value } }) => (Number(value) || 0) + currentValue, 0);

package/app/utils/Orders/Orders.type.ts

@@ -0,0 +1,19 @@
+/**
+ * M Framework - Flexible backend agnostic framework.
+ *
+ * Copyright © Meeovi, LTD. All rights reserved.
+ * See LICENSE for license details.
+ *
+ * @license OSL-3.0 (Open Software License ("OSL") v. 3.0)
+ * @package mframework/mframework-theme
+ * @link https://github.com/meeovi/mframework
+ */
+
+export interface OrderItemQtyArray {
+    quantity_ordered: number;
+    quantity_canceled: number;
+    quantity_invoiced: number;
+    quantity_refunded: number;
+    quantity_returned: number;
+    quantity_shipped: number;
+}

package/app/utils/Orders/index.ts

@@ -0,0 +1,13 @@
+/* eslint-disable import/prefer-default-export */
+/**
+ * M Framework - Flexible backend agnostic framework.
+ *
+ * Copyright © Meeovi, LTD. All rights reserved.
+ * See LICENSE for license details.
+ *
+ * @license OSL-3.0 (Open Software License ("OSL") v. 3.0)
+ * @package mframework/mframework
+ * @link https://github.com/meeovi/mframework
+ */
+
+export * from './Orders';