rmux/dist/index.esm.js

/*!
 * rmux.js v0.0.1-alpha.16
 * (c) 2018-2019 空鱼
 * Released under the MIT License.
 */
import { Provider as Provider$1 } from 'react-remux';
import React from 'react';
import { invariant, isPlainObject } from 'mux-lib';
import { createBrowserHistory, connectRouter, routerMiddleware, RouterProvider } from 'rmux-router';
import { FetchProvider, RootFetchProvider } from 'rmux-fetch';

class ErrorBoundary extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      hasError: false
    };
  }

  componentDidCatch(error, errorInfo) {
    // tslint:disable
    console.error("loading error:   ", error, errorInfo); // tslint:enable

    this.setState({
      hasError: true
    });
  }

  render() {
    const {
      errorFallback = null,
      children
    } = this.props;
    const {
      hasError
    } = this.state;
    return hasError ? errorFallback : children;
  }

}

const BlockProvider = props => {
  const {
    model,
    plugins = {},
    children,
    namespace,
    prefix,
    fetchOption,
    errorInterceptor,
    requestInterceptor,
    responseInterceptor,
    config
  } = props;
  invariant(namespace !== undefined, `[rmux] namespace except get string,but get ${typeof namespace}`);
  const injectModel = { ...model,
    namespace: model.namespace === undefined ? namespace : model.namespace
  };
  return React.createElement(Provider$1, {
    model: injectModel,
    plugins: plugins,
    config: config
  }, React.createElement(FetchProvider, {
    namespace: namespace,
    prefix: prefix,
    fetchOption: fetchOption,
    errorInterceptor: errorInterceptor,
    requestInterceptor: requestInterceptor,
    responseInterceptor: responseInterceptor
  }, children));
};
const Provider = props => {
  const {
    model,
    plugins = {},
    children,
    loading,
    prefix,
    fetchOption,
    errorInterceptor,
    requestInterceptor,
    responseInterceptor,
    config,
    asyncLoader,
    errorFallback
  } = props;
  const {
    extraReducers = [],
    middlewares = []
  } = plugins;
  const history = props.history || createBrowserHistory();
  /**
   * 项目初始化的时候 全局的 model fetch 配置项都可以为空
   * 只做 router 的初始化
   */

  if (isPlainObject(model)) {
    const injectPlugins = { ...plugins,
      extraReducers: [{
        router: connectRouter(history)
      }, ...extraReducers],
      middlewares: [routerMiddleware(history), ...middlewares]
    };
    return React.createElement(ErrorBoundary, {
      errorFallback: errorFallback
    }, React.createElement(Provider$1, {
      model: model,
      plugins: injectPlugins,
      config: config
    }, React.createElement(RootFetchProvider, {
      prefix: prefix,
      fetchOption: fetchOption,
      errorInterceptor: errorInterceptor,
      requestInterceptor: requestInterceptor,
      responseInterceptor: responseInterceptor
    }, React.createElement(RouterProvider, {
      history: history,
      loading: loading,
      asyncLoader: asyncLoader
    }, children))));
  }

  return React.createElement(ErrorBoundary, {
    errorFallback: errorFallback
  }, React.createElement(RootFetchProvider, {
    prefix: prefix,
    fetchOption: fetchOption,
    errorInterceptor: errorInterceptor,
    requestInterceptor: requestInterceptor,
    responseInterceptor: responseInterceptor
  }, React.createElement(RouterProvider, {
    history: history,
    loading: loading,
    asyncLoader: asyncLoader
  }, children)));
};

export { BlockProvider, Provider };