@e-group/redux-modules/esm/immutable/snackbars/withReduxSnackbar.js

eGroup team react-redux modules that share across projects.

import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
import _extends from "@babel/runtime/helpers/esm/extends";
import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";

function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }

function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }

import React, { forwardRef, useEffect } from 'react';
import { connect } from 'react-redux';
import { initializeSnackbar as _initializeSnackbar, closeSnackbar as _closeSnackbar } from '../../snackbars/actions';
import { getSnackbarStates } from './selectors';

/**
 * Please read this article for more info.
 * https://medium.com/@martin_hotell/react-refs-with-typescript-a32d56c4d315
 * @param name
 */
const withReduxSnackbar = name => WrappedComponent => {
  const WithReduxSnackbar = props => {
    const forwardedRef = props.forwardedRef,
          initializeSnackbar = props.initializeSnackbar,
          closeSnackbar = props.closeSnackbar,
          other = _objectWithoutProperties(props, ["forwardedRef", "initializeSnackbar", "closeSnackbar"]);

    useEffect(() => {
      initializeSnackbar(name);
    }, []);
    return /*#__PURE__*/React.createElement(WrappedComponent, _extends({
      ref: forwardedRef
    }, other));
  };
  /**
   * Connect before forwardRef
   * https://github.com/reduxjs/react-redux/issues/914
   */


  const mapStateToProps = (state, ownProps) => _objectSpread({}, getSnackbarStates(state, ownProps, name).toJS());

  const mapDispatchToProps = (dispatch, ownProps) => ({
    initializeSnackbar: name => dispatch(_initializeSnackbar(name)),
    closeSnackbar: name => dispatch(_closeSnackbar(name)),
    handleClose: () => {
      if (ownProps.handleClose) {
        ownProps.handleClose();
      } else {
        dispatch(_closeSnackbar(name));
      }
    }
  });

  const ConnectedComponent = connect(mapStateToProps, mapDispatchToProps)(WithReduxSnackbar);
  /**
   * Forwarding refs in higher-order components
   * https://reactjs.org/docs/forwarding-refs.html#forwarding-refs-in-higher-order-components
   */

  function RefForwardingFactory(props, ref) {
    return /*#__PURE__*/React.createElement(ConnectedComponent, _extends({}, props, {
      forwardedRef: ref
    }));
  } // Give this component a more helpful display name in DevTools.


  const componentName = WrappedComponent.displayName || WrappedComponent.name;
  RefForwardingFactory.displayName = "withReduxSnackbar(".concat(componentName, ")");
  return /*#__PURE__*/forwardRef(RefForwardingFactory);
};

export default withReduxSnackbar;