@shopify/app-bridge/client/Client.js

"use strict";
var __assign = (this && this.__assign) || function () {
    __assign = Object.assign || function(t) {
        for (var s, i = 1, n = arguments.length; i < n; i++) {
            s = arguments[i];
            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
                t[p] = s[p];
        }
        return t;
    };
    return __assign.apply(this, arguments);
};
var __importDefault = (this && this.__importDefault) || function (mod) {
    return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
var helper_1 = require("../actions/helper");
var Error_1 = require("../actions/Error");
var Print_1 = require("../actions/Print");
var MessageTransport_1 = require("../MessageTransport");
var collection_1 = require("../util/collection");
var shared_1 = require("../util/shared");
var env_1 = require("../util/env");
var print_1 = require("./print");
var redirect_1 = require("./redirect");
var types_1 = require("./types");
var Hooks_1 = __importDefault(require("./Hooks"));
exports.WINDOW_UNDEFINED_MESSAGE = 'window is not defined. Running an app outside a browser is not supported';
function redirectHandler(hostFrame, config) {
    var apiKey = config.apiKey, shopOrigin = config.shopOrigin, _a = config.forceRedirect, forceRedirect = _a === void 0 ? !env_1.isDevelopmentClient : _a;
    var location = redirect_1.getLocation();
    if (env_1.isFrameless ||
        !location ||
        !apiKey ||
        !shopOrigin ||
        !forceRedirect ||
        !redirect_1.shouldRedirect(hostFrame)) {
        return;
    }
    var url = "https://" + shopOrigin + "/admin/apps/" + apiKey + location.pathname + (location.search ||
        '');
    redirect_1.redirect(url);
}
function appSetUp(app) {
    app.subscribe(Print_1.ActionType.APP, print_1.handleAppPrint);
}
/**
 * Extracts the query parameters from the current URL.
 * @deprecated This function has been deprecated.
 * @public
 */
function getUrlParams() {
    var params = {};
    var location = redirect_1.getLocation();
    if (!location) {
        return params;
    }
    var hashes = location.search.slice(location.search.indexOf('?') + 1).split('&');
    return hashes.reduce(function (acc, hash) {
        var _a;
        var _b = hash.split('='), key = _b[0], val = _b[1];
        return __assign({}, acc, (_a = {}, _a[decodeURIComponent(key)] = decodeURIComponent(val), _a));
    }, params);
}
exports.getUrlParams = getUrlParams;
/**
 * Extracts the `shop` query parameter from the current URL.
 * @deprecated This function has been deprecated, see {@link https://help.shopify.com/api/embedded-apps/shop-origin}
 * @public
 */
function getShopOrigin() {
    var params = getUrlParams();
    return params.shop;
}
exports.getShopOrigin = getShopOrigin;
/**
 * @internal
 */
exports.createClientApp = function (transport, middlewares) {
    if (middlewares === void 0) { middlewares = []; }
    var getStateListeners = [];
    var listeners = [];
    var actionListeners = {};
    var invokeCallbacks = function (type, payload) {
        var hasCallback = false;
        if (actionListeners.hasOwnProperty(type)) {
            for (var _i = 0, _a = actionListeners[type]; _i < _a.length; _i++) {
                var listener = _a[_i];
                var id = listener.id, callback = listener.callback;
                var matchId = payload && payload.id === id;
                if (matchId || !id) {
                    callback(payload);
                    hasCallback = true;
                }
            }
        }
        if (hasCallback) {
            return;
        }
        // Throw an error if there are no subscriptions to this error
        var errorType = helper_1.findMatchInEnum(Error_1.ActionType, type);
        if (errorType) {
            Error_1.throwError(errorType, payload);
        }
    };
    var handler = function (event) {
        var action = event.data;
        switch (action.type) {
            case 'getState':
                var resolvers = getStateListeners.splice(0);
                resolvers.forEach(function (resolver) { return resolver(action.payload); });
                break;
            case 'dispatch':
                var payload_1 = action.payload;
                invokeCallbacks(payload_1.type, payload_1.payload);
                listeners.forEach(function (listener) { return listener.callback(payload_1); });
                break;
            default:
            // Silently swallow unknown actions
        }
    };
    transport.subscribe(handler);
    return function (config) {
        if (!config.shopOrigin) {
            throw Error_1.fromAction('shopOrigin must be provided', Error_1.AppActionType.INVALID_CONFIG);
        }
        var protocol = /^https?:\/\//;
        if (protocol.test(config.shopOrigin)) {
            var message = "shopOrigin should not include protocol, please use: " + config.shopOrigin.replace(protocol, '');
            throw Error_1.fromAction(message, Error_1.AppActionType.INVALID_CONFIG);
        }
        if (!config.apiKey) {
            throw Error_1.fromAction('apiKey must be provided', Error_1.AppActionType.INVALID_CONFIG);
        }
        var dispatcher = createDispatcher(transport, config);
        // It is possible to initialize an app multiple times
        // Therefore we need to clear subscriptions to be safe
        dispatcher(types_1.MessageType.Unsubscribe);
        function dispatch(action) {
            dispatcher(types_1.MessageType.Dispatch, action);
            return action;
        }
        redirectHandler(transport.hostFrame, config);
        var hooks = new Hooks_1.default();
        var app = {
            localOrigin: transport.localOrigin,
            hooks: hooks,
            dispatch: function (action) {
                if (!app.hooks) {
                    return dispatch(action);
                }
                return app.hooks.run(types_1.LifecycleHook.DispatchAction, dispatch, app, action);
            },
            featuresAvailable: function (features) {
                return app.getState('features').then(function (state) {
                    if (features) {
                        Object.keys(state).forEach(function (feature) {
                            if (!features.includes(feature)) {
                                delete state[feature];
                            }
                        });
                    }
                    return state;
                });
            },
            getState: function (query) {
                return new Promise(function (resolve) {
                    getStateListeners.push(resolve);
                    dispatcher(types_1.MessageType.GetState);
                }).then(function (state) {
                    if (query) {
                        return query.split('.').reduce(function (value, key) {
                            if (typeof state !== 'object' || Array.isArray(state)) {
                                return undefined;
                            }
                            value = state[key];
                            state = value;
                            return value;
                        }, undefined);
                    }
                    return state;
                });
            },
            subscribe: function () {
                if (arguments.length < 2) {
                    return collection_1.addAndRemoveFromCollection(listeners, { callback: arguments[0] });
                }
                var type = arguments[0];
                var callback = arguments[1];
                var id = arguments[2];
                var actionCallback = { callback: callback, id: id };
                var payload = { type: type, id: id };
                if (!actionListeners.hasOwnProperty(type)) {
                    actionListeners[type] = [];
                }
                dispatcher(types_1.MessageType.Subscribe, payload);
                return collection_1.addAndRemoveFromCollection(actionListeners[type], actionCallback, function () {
                    return dispatcher(types_1.MessageType.Unsubscribe, payload);
                });
            },
            error: function (listener, id) {
                var _this = this;
                var unsubscribeCb = [];
                helper_1.forEachInEnum(Error_1.ActionType, function (eventNameSpace) {
                    // tslint:disable-next-line:no-invalid-this
                    unsubscribeCb.push(_this.subscribe(eventNameSpace, listener, id));
                });
                return function () {
                    unsubscribeCb.forEach(function (unsubscribe) { return unsubscribe(); });
                };
            },
        };
        for (var _i = 0, middlewares_1 = middlewares; _i < middlewares_1.length; _i++) {
            var middleware = middlewares_1[_i];
            middleware(hooks, app);
        }
        appSetUp(app);
        return app;
    };
};
/**
 * @public
 */
function createAppWrapper(frame, localOrigin, middleware) {
    if (middleware === void 0) { middleware = []; }
    if (!frame) {
        throw Error_1.fromAction(exports.WINDOW_UNDEFINED_MESSAGE, Error_1.AppActionType.WINDOW_UNDEFINED);
    }
    var location = redirect_1.getLocation();
    var origin = localOrigin || (location && location.origin);
    if (!origin) {
        throw Error_1.fromAction('local origin cannot be blank', Error_1.AppActionType.MISSING_LOCAL_ORIGIN);
    }
    var transport = MessageTransport_1.fromWindow(frame, origin);
    var appCreator = exports.createClientApp(transport, middleware);
    return appCreator;
}
exports.createAppWrapper = createAppWrapper;
/**
 * Creates your application instance.
 * @param config - Both `apiKey` and `shopOrigin` are required.
 * @remarks
 * You will need to store `shopOrigin` during the authentication process and then retrieve it for the code to work properly. To learn more about this process, see {@link https://help.shopify.com/api/embedded-apps/shop-origin | Getting and storing the shop origin}.
 * @public
 */
function createApp(config) {
    var currentWindow = redirect_1.getWindow();
    if (!currentWindow) {
        return shared_1.serverAppBridge;
    }
    return createAppWrapper(currentWindow.top)(config);
}
exports.createApp = createApp;
function createDispatcher(transport, config) {
    return function (type, payload) {
        transport.dispatch({
            payload: payload,
            source: config,
            type: type,
        });
    };
}
/**
 * {@inheritdocs createApp}
 * @public
 */
exports.default = createApp;