all files / src/ connect.js

93.48% Statements 129/138
75.47% Branches 40/53
95.83% Functions 23/24
94.74% Lines 126/133
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 151 152 153 154 155 156 157 158 159 160 161 162 163 164 165 166 167 168 169 170 171 172 173 174 175 176 177 178 179 180 181 182 183 184 185 186 187 188 189 190 191 192 193 194 195 196 197 198 199 200 201 202 203 204 205 206 207 208 209 210 211 212 213 214 215 216 217 218 219 220 221  23× 23× 23×         14× 14×         23×   23×   23× 23× 23× 23× 23× 23× 23× 23× 23× 23× 23× 23× 23× 23× 23×       23× 23× 23× 23×   23× 23× 23× 23×   23×           23× 17×   23×   23× 23× 23× 23×       23× 10×     10× 10× 10× 10× 10×                     10× 10×       23×           23× 10× 10× 13× 13×           13× 13×   10×     10×       23× 23×       23× 10×     10× 10× 10×       23× 10× 10× 10× 10×                 10×         23× 40× 40× 40× 40× 40×       40× 14×   40× 40×           40× 40×   23× 23× 23×       23×   23× 23×        
"use strict";
var __extends = (this && this.__extends) || function (d, b) {
    for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p];
    function __() { this.constructor = d; }
    d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
};
var react_1 = require('react');
var isObject = require('lodash.isobject');
var isEqual = require('lodash.isequal');
var invariant = require('invariant');
var assign = require('object-assign');
var react_redux_1 = require('react-redux');
var apollo_client_1 = require('apollo-client');
;
;
;
var defaultMapQueriesToProps = function (opts) { return ({}); };
var defaultMapMutationsToProps = function (opts) { return ({}); };
var defaultQueryData = {
    loading: true,
    error: null,
    result: null,
};
var defaultMutationData = assign({}, defaultQueryData);
function getDisplayName(WrappedComponent) {
    return WrappedComponent.displayName || WrappedComponent.name || 'Component';
}
var nextVersion = 0;
function connect(opts) {
    if (!opts) {
        opts = {};
    }
    var mapQueriesToProps = opts.mapQueriesToProps, mapMutationsToProps = opts.mapMutationsToProps;
    delete opts.mapQueriesToProps;
    delete opts.mapMutationsToProps;
    mapQueriesToProps = mapQueriesToProps ? mapQueriesToProps : defaultMapQueriesToProps;
    mapMutationsToProps = mapMutationsToProps ? mapMutationsToProps : defaultMapMutationsToProps;
    var version = nextVersion++;
    return function wrapWithApolloComponent(WrappedComponent) {
        var apolloConnectDisplayName = "Apollo(Connect(" + getDisplayName(WrappedComponent) + "))";
        var ApolloConnect = (function (_super) {
            __extends(ApolloConnect, _super);
            function ApolloConnect(props, context) {
                _super.call(this, props, context);
                this.version = version;
                this.store = props.store || context.store;
                this.client = props.client || context.client;
                invariant(!!this.client, "Could not find \"client\" in either the context or " +
                    ("props of \"" + apolloConnectDisplayName + "\". ") +
                    "Either wrap the root component in a <Provider>, " +
                    ("or explicitly pass \"client\" as a prop to \"" + apolloConnectDisplayName + "\"."));
                var storeState = this.store.getState();
                this.state = assign({}, storeState);
                this.data = {};
                this.mutations = {};
            }
            ApolloConnect.prototype.componentWillMount = function () {
                var _a = this, props = _a.props, state = _a.state;
                this.subscribeToAllQueries(props, state);
                this.createAllMutationHandles(props, state);
            };
            ApolloConnect.prototype.componentWillReceiveProps = function (nextProps, nextState) {
                if (!isEqual(this.props, nextProps) || !isEqual(this.state, nextState)) {
                    this.unsubcribeAllQueries();
                    this.subscribeToAllQueries(nextProps, nextState);
                }
            };
            ApolloConnect.prototype.shouldComponentUpdate = function () {
                return this.haveOwnPropsChanged || this.hasQueryDataChanged || this.hasMutationDataChanged;
            };
            ApolloConnect.prototype.componentWillUnmount = function () {
                this.unsubcribeAllQueries();
            };
            ApolloConnect.prototype.subscribeToAllQueries = function (props, state) {
                var _a = this.client, watchQuery = _a.watchQuery, reduxRootKey = _a.reduxRootKey;
                var store = this.store;
                var queryHandles = mapQueriesToProps({
                    state: state,
                    ownProps: props,
                });
                if (isObject(queryHandles) && Object.keys(queryHandles).length) {
                    this.queryHandles = queryHandles;
                    for (var key in queryHandles) {
                        Iif (!queryHandles.hasOwnProperty(key)) {
                            continue;
                        }
                        var _b = queryHandles[key], query = _b.query, variables = _b.variables;
                        var handle = watchQuery({ query: query, variables: variables });
                        var queryData = defaultQueryData;
                        try {
                            var result = apollo_client_1.readQueryFromStore({
                                store: store.getState()[reduxRootKey].data,
                                query: query,
                                variables: variables,
                            });
                            queryData = {
                                error: null,
                                loading: false,
                                result: result,
                            };
                        }
                        catch (e) { }
                        this.data[key] = queryData;
                        this.handleQueryData(handle, key);
                    }
                }
            };
            ApolloConnect.prototype.unsubcribeAllQueries = function () {
                Eif (this.queryHandles) {
                    for (var key in this.queryHandles) {
                        Iif (!this.queryHandles.hasOwnProperty(key)) {
                            continue;
                        }
                        this.queryHandles[key].unsubscribe();
                    }
                }
            };
            ApolloConnect.prototype.handleQueryData = function (handle, key) {
                var _this = this;
                var forceRender = function (_a) {
                    var error = _a.error, data = _a.data;
                    _this.data[key] = {
                        loading: false,
                        result: data || null,
                        error: error,
                        refetch: _this.data[key].refetch,
                    };
                    _this.hasQueryDataChanged = true;
                    _this.setState(_this.store.getState());
                };
                this.queryHandles[key] = handle.subscribe({
                    next: forceRender,
                    error: function (error) { forceRender({ error: error }); },
                });
                this.data[key] = assign(this.data[key], {
                    refetch: this.queryHandles[key].refetch,
                });
            };
            ApolloConnect.prototype.createAllMutationHandles = function (props, state) {
                var mutations = mapMutationsToProps({
                    state: state,
                    ownProps: props,
                });
                if (isObject(mutations) && Object.keys(mutations).length) {
                    for (var key in mutations) {
                        Iif (!mutations.hasOwnProperty(key)) {
                            continue;
                        }
                        var handle = this.createMutationHandle(key, mutations[key]);
                        this.data[key] = defaultMutationData;
                        this.mutations[key] = handle;
                    }
                }
            };
            ApolloConnect.prototype.createMutationHandle = function (key, method) {
                var _this = this;
                var mutate = this.client.mutate;
                var store = this.store;
                var forceRender = function (_a) {
                    var errors = _a.errors, data = _a.data;
                    _this.data[key] = {
                        loading: false,
                        result: data,
                        error: errors,
                    };
                    _this.hasMutationDataChanged = true;
                    _this.setState(store.getState());
                    return {
                        errors: errors,
                        data: data,
                    };
                };
                return function () {
                    var args = [];
                    for (var _i = 0; _i < arguments.length; _i++) {
                        args[_i - 0] = arguments[_i];
                    }
                    var _a = method.apply(_this.client, args), mutation = _a.mutation, variables = _a.variables;
                    return mutate({ mutation: mutation, variables: variables })
                        .then(forceRender)
                        .catch(function (error) { return forceRender({ errors: error }); });
                };
            };
            ApolloConnect.prototype.render = function () {
                var _a = this, haveOwnPropsChanged = _a.haveOwnPropsChanged, hasQueryDataChanged = _a.hasQueryDataChanged, hasMutationDataChanged = _a.hasMutationDataChanged, renderedElement = _a.renderedElement, mutations = _a.mutations, props = _a.props, data = _a.data;
                this.haveOwnPropsChanged = false;
                this.hasQueryDataChanged = false;
                this.hasMutationDataChanged = false;
                var clientProps = {
                    mutate: this.client.mutate,
                    query: this.client.query,
                };
                if (Object.keys(mutations).length) {
                    clientProps.mutations = mutations;
                }
                var mergedPropsAndData = assign({}, props, data, clientProps);
                Iif (!haveOwnPropsChanged &&
                    !hasQueryDataChanged &&
                    !hasMutationDataChanged &&
                    renderedElement) {
                    return renderedElement;
                }
                this.renderedElement = react_1.createElement(WrappedComponent, mergedPropsAndData);
                return this.renderedElement;
            };
            ApolloConnect.displayName = apolloConnectDisplayName;
            ApolloConnect.WrappedComponent = WrappedComponent;
            ApolloConnect.contextTypes = {
                store: react_1.PropTypes.object.isRequired,
                client: react_1.PropTypes.object.isRequired,
            };
            return ApolloConnect;
        }(react_1.Component));
        var mapStateToProps = opts.mapStateToProps, mapDispatchToProps = opts.mapDispatchToProps, mergeProps = opts.mergeProps, options = opts.options;
        return react_redux_1.connect(mapStateToProps, mapDispatchToProps, mergeProps, options)(ApolloConnect);
    };
}
Object.defineProperty(exports, "__esModule", { value: true });
exports.default = connect;
;
//# sourceMappingURL=connect.js.map