"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.withStore = withStore;
Object.defineProperty(exports, "connectToData", {
  enumerable: true,
  get: function get() {
    return _stateTree.connectToData;
  }
});
exports.default = void 0;

var _react = _interopRequireDefault(require("react"));

var _mobxReact = require("xmobx/mobx-react");

var _stateTree = require("../state-tree");

var _exotic = require("../exotic");

var _deps = require("./deps");

var _jsxFileName = "observable-container/connectToData.js";

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }

function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; var ownKeys = Object.keys(source); if (typeof Object.getOwnPropertySymbols === 'function') { ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function (sym) { return Object.getOwnPropertyDescriptor(source, sym).enumerable; })); } ownKeys.forEach(function (key) { _defineProperty(target, key, source[key]); }); } return target; }

function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }

/**
 * ===============================================
 * reusable utils, this would always be in modules
 * @see modules/state-tree
 * @see modules/view-container
 * ===============================================
 */
const IS_BROWSER = typeof window === 'object';
/**
 * @alias AddStoreToPropsDecorator
 * @tutorial https://reactjs.org/docs/higher-order-components.html
 * @type {Function.Decorator}
 *
 * @param {ObservableContainer} container
 * @param {React.Component} TargetViewComponent
 * @return {React.Component} obserable/subscribed component connected to ^ store
 */

function withStore(container, TargetViewComponent) {
  var _dec, _class;

  /**
   * @curried 1
   * @desc return function if only 1 arg is passed in
   *
   * @param {React.Component} Target
   * @return {withStore}
   */
  if (arguments.length === 1) {
    return function curriedConnectToData(Target) {
      return withStore(container, Target);
    };
  }

  const remapInject = contextStores => {
    return _objectSpread({
      store: contextStores.store
    }, contextStores);
  };
  /**
   * make our component observe every change to the store
   * the "subscribe" in pub-sub
   * @type {React.Component}
   * @see https://mobx.js.org/refguide/observer-component.html
   */


  const ObservableView = (0, _mobxReact.observer)(TargetViewComponent); // const ViewComponentSubscribedToStore = obserable(TargetViewComponent)

  const ViewComponentSubscribedToStore = (0, _mobxReact.inject)(remapInject)(ObservableView);
  /**
   * @func @observer
   * @type {Function.Decorator}
   * @see http://bit.ly/typescript-decorators
   * @see http://bit.ly/babel-decorators-transpiled
   * @tutorial https://medium.com/google-developers/exploring-es7-decorators-76ecb65fb841
   * @tutorial https://mobx.js.org/refguide/observable.html
   * @see https://github.com/mobxjs/mobx/blob/master/src/core/observable.ts
   * @see https://github.com/mobxjs/mobx/blob/master/src/api/observabledecorator.ts
   *
   * we want to make sure this wrapper is updated every time the props change
   * so that it will more easily pass the data
   * down to the TargetViewComponent that it's wrapping
   */

  /**
   * @todo add dynamic injector from param here
   *
   * @alias HigherOrderComponentSubscribedToStore
   * @class HigherOrderComponentWrapper
   * @tutorial https://medium.com/@learnreact/container-components-c0e67432e005
   */
  // @inject('store')

  let ViewInsideContainer = (_dec = (0, _mobxReact.inject)(remapInject), _dec(_class = (0, _mobxReact.observer)(_class = class ViewInsideContainer extends _react.default.Component {
    // For server-side rendering (see getDataFromTree.ts)
    // @todo - could synchronize the state observably to container, if needed
    // state = {}
    // eslint-disable-next-line
    async fetchData() {
      // let state
      // throw new Error('_SERVER_SIDE_RENDERING_DO_NOT_USE_ME_OR_ELSE_DOT_DOT_DOT')
      // container.dynamicState.queryResponse
      if ((0, _exotic.isFunction)(container.fetchInitialOnServer)) {
        const response = await container.fetchInitialOnServer(); // _DO_NOT_USE_ME_OR_ELSE_DOT_DOT_DOT

        console.dev('_SERVER_SIDE_RENDERING'); // @todo - this has errors in updating and re-updating
        // this.setState(response)

        return response;
      } else {
        // _SERVER_SIDE_RENDERING_DO_NOT_USE_ME_OR_ELSE_DOT_DOT_DOT
        console.warn('_NO_FETCHINITIALONSERVER');
        console.dev(container.named || container.name || container, TargetViewComponent.displayName || TargetViewComponent);
        console.dev('\n\n\n'); // state = {}
      } // console.dev({ state })


      return Promise.resolve({
        isEmpty: true,
        name: container.name
      });
    } // eslint-disable-next-line


    async asyncBootstrap() {
      return this.fetchData();
    }
    /**
     * @description !!! CALLED ON [SERVER + WEB]
     *
     * @tutorial https://reactjs.org/docs/state-and-lifecycle.html
     * @see http://busypeoples.github.io/post/react-component-lifecycle/
     * @param {React.Props} nextProps
     * @listens componentWillReceiveProps
     * @fires fetchInitialOnServer if route changes
     */


    componentWillMount() {
      /**
       * @todo because withJobs rehydrates here
       *
       * @todo @fixme something with header uses this, and it FOUC it - fix that & remove this
       */
      if (this.props.jobResult && typeof window === 'object' && (0, _exotic.isFunction)(container.rehydrateInitialOnWeb)) {
        container.rehydrateInitialOnWeb(this.props.jobResult || this.props); //   if (isFunction(container.handleMount)) {
        //     container.handleMount(this.props.jobResult, this)
        //   }
      }

      if ((0, _exotic.isFunction)(container.handleMount)) {
        // console.dev('componentWillMountcomponentWillMountcomponentWillMountcomponentWillMountcomponentWillMount')
        container.handleMount(this.props, this);
      } else {
        console.dev('_____NO_WILL_MOUNT_____');
      } // isServer


      if (IS_BROWSER === false) {} // @see didMount
      // container.fetchInitialOnServer(this)
      // container.rehydrateInitialOnWeb(this)
      // container.handleDidMount(this.props, this)
      // console.dev('All The Things', this.props, this)

    }
    /**
     * @description !!! THIS IS ONLY ON [BROWSER/CLIENT]
     * ^ happens before rendering
     *
     * @tutorial https://github.com/ctrlplusb/react-jobs
     * @see wantsServerSideRenderDataOnly
     * @see container.fetchInitialOnServer
     * @listens componentWillMount
     * @alias onInitialCreate
     * @fires fetchInitialOnServer
     * @fires handleMount
     */


    componentDidMount() {
      // @todo
      const props = this.props.jobResult; // @note with props && we only call rehydrate when we are in fact rehydrating
      // props &&

      if ((0, _exotic.isFunction)(container.rehydrateInitialOnWeb) === true) {
        // @todoooooooo
        // const props = this.props.jobResult
        // return container.rehydrateInitialOnWeb(props || this.props, this)
        return container.rehydrateInitialOnWeb(props, this);
      } else {
        // console.dev('componentDidMountcomponentDidMountcomponentDidMountcomponentDidMountcomponentDidMountcomponentDidMountcomponentDidMount')
        return undefined;
      } // if (isFunction(container.handleDidMount) === true) {
      //   // @todoooooooo
      //   container.handleDidMount(this.props, this)
      // }

    } // /**
    //  * @see handleProps
    //  * @see componentWillReceiveProps
    //  */
    // handleUpdate(props) {
    //   //
    // }

    /**
     * @todo getDerivedStateFromProps
     * @api https://github.com/reactjs/rfcs/blob/master/text/0006-static-lifecycle-methods.md#basic-example
     * @see https://twitter.com/dan_abramov/status/953612246634188800?lang=en
     */
    // static getDerivedStateFromProps(nextProps, prevState) {
    //   // Called after a component is instantiated or before it receives new props.
    //   // Return an object to update state in response to prop changes.
    //   // Return null to indicate no change to state.
    // }

    /**
     * @deprecated
     */


    componentWillReceiveProps(nextProps) {
      /**
       * @description this is to check whether the hydrated data has changed based on the route
       * @todo I will inline react-jobs to remove external dependency api
       */
      container.handleUpdate(nextProps);

      if ((0, _exotic.isObj)(nextProps.jobResult) && nextProps.jobResult.identifier !== this.props.jobResult.identifier) {
        this.componentWillMount();
      }

      if ((0, _exotic.isObj)(nextProps.match) && // nextProps.location.key !== this.props.location.key
      nextProps.match.params !== this.props.match.params) {
        console.dev({
          previousLocation: this.props.location,
          currentLocation: nextProps.location
        });
        this.componentWillMount();
      }
    }
    /**
     * @event componentWillMount
     * | is executed before rendering,
     * | on both the server and the client side.
     *
     * @event componentDidMount
     * | is executed after the first render only on the client side.
     * | This is where AJAX requests and DOM or state updates should occur.
     * | This method is also used for integration
     * | with other JavaScript frameworks and any functions
     * | with delayed execution such as setTimeout or setInterval.
     * | We are using it to update the state
     * | so we can trigger the other lifecycle methods.
     *
     * @event componentWillReceiveProps
     * | is invoked as soon as the props are updated before another render is called.
     * | We triggered it from setNewNumber when we updated the state.
     *
     * @event shouldComponentUpdate
     * | should return true or false value.
     * | This will determine if the component will be updated or not.
     * | This is set to true by default.
     * | If you are sure that the component doesn't need to render
     * | after state or props are updated, you can return false value.
     * | (this is what PureComponent auto helps with)
     *
     * @event componentWillUpdate
     * | is called just before rendering.
     *
     * @event componentDidUpdate
     * | is called just after rendering.
     *
     * @event componentWillUnmount
     * | is called after the component is unmounted from the dom.
     * | We are unmounting our component in main.js
     *
     * @listens render
     * @fires handleProps
     * @return {React.ClassicComponent}
     */


    render() {
      const props = container.isContainer || container.handleProps ? container._handleProps(this.props, this) : (0, _deps.tapProps)(this.props);
      /**
       * @tutorial https://reactjs.org/docs/react-without-jsx.html
       * @example http://bit.ly/babel-react-create-component
       *
       * this is the same as
       * @extends React.createComponent(ViewComponentSubscribedToStore, props)
       */

      return _react.default.createElement(ViewComponentSubscribedToStore, _extends({}, props, {
        __source: {
          fileName: _jsxFileName,
          lineNumber: 315
        },
        __self: this
      }));
    }

  }) || _class) || _class);
  (0, _deps.decorateComponentStatics)(ViewInsideContainer, TargetViewComponent, container); // displayName=💉

  /**
   * @description if we have ssr, use it, otherwise, done
   * && container.fetchInitialOnServer.length !== 5
   */

  if ((0, _exotic.isFunction)(container.fetchInitialOnServer)) {
    // console.warn('__________@michael_____________')

    /**
     * @see ./oneServerSideRender
     */
    const withServerSideRendering = (0, _deps.oneServerSideRender)(container.fetchInitialOnServer);
    return withServerSideRendering(ViewInsideContainer);
  } else {
    return ViewInsideContainer;
  }
}

var _default = _stateTree.connectToData;
exports.default = _default;