client/entity-editor/edition-section/edition-section.js

"use strict";

require("core-js/modules/es.string.iterator.js");
require("core-js/modules/es.weak-map.js");
require("core-js/modules/web.dom-collections.iterator.js");
require("core-js/modules/es.object.get-own-property-descriptor.js");
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
var _typeof = require("@babel/runtime/helpers/typeof");
Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;
require("core-js/modules/es.array.map.js");
require("core-js/modules/es.function.name.js");
require("core-js/modules/es.object.values.js");
require("core-js/modules/es.array.filter.js");
require("core-js/modules/es.object.to-string.js");
require("core-js/modules/es.parse-int.js");
require("core-js/modules/es.array.includes.js");
require("core-js/modules/es.array.iterator.js");
require("core-js/modules/es.object.from-entries.js");
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
var _isNil2 = _interopRequireDefault(require("lodash/isNil"));
var React = _interopRequireWildcard(require("react"));
var _actions = require("./actions");
var _reactBootstrap = require("react-bootstrap");
var _utils = require("../../helpers/utils");
var _freeSolidSvgIcons = require("@fortawesome/free-solid-svg-icons");
var _edition = require("../validators/edition");
var _authorCreditSection = _interopRequireDefault(require("../author-credit-editor/author-credit-section"));
var _newDateField = _interopRequireDefault(require("../common/new-date-field"));
var _entitySearchFieldOption = _interopRequireDefault(require("../common/entity-search-field-option"));
var _reactFontawesome = require("@fortawesome/react-fontawesome");
var _languageField = _interopRequireDefault(require("../common/language-field"));
var _linkedEntity = _interopRequireDefault(require("../common/linked-entity"));
var _numericField = _interopRequireDefault(require("../common/numeric-field"));
var _searchEntityCreateSelect = _interopRequireDefault(require("../../unified-form/common/search-entity-create-select"));
var _reactSelect = _interopRequireDefault(require("react-select"));
var _action = require("../../unified-form/detail-tab/action");
var _reactRedux = require("react-redux");
var _entity = require("../../helpers/entity");
var _makeImmutable = _interopRequireDefault(require("../common/make-immutable"));
var _excluded = ["depthValue", "editionFormats", "editionStatuses", "formatValue", "heightValue", "languageOptions", "languageValues", "onLanguagesChange", "onDepthChange", "onFormatChange", "onHeightChange", "onReleaseDateChange", "onPagesChange", "onToggleShowEditionGroupSection", "onEditionGroupChange", "onPublisherChange", "onStatusChange", "onWeightChange", "onWidthChange", "pagesValue", "physicalEnable", "editionGroupRequired", "editionGroupValue", "editionGroupVisible", "matchingNameEditionGroups", "isUnifiedForm", "publisherValue", "releaseDateValue", "statusValue", "weightValue", "widthValue"];
/*
 * Copyright (C) 2016  Ben Ockmore
 *
 * This program is free software; you can redistribute it and/or modify
 * it under the terms of the GNU General Public License as published by
 * the Free Software Foundation; either version 2 of the License, or
 * (at your option) any later version.
 *
 * This program is distributed in the hope that it will be useful,
 * but WITHOUT ANY WARRANTY; without even the implied warranty of
 * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
 * GNU General Public License for more details.
 *
 * You should have received a copy of the GNU General Public License along
 * with this program; if not, write to the Free Software Foundation, Inc.,
 * 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301 USA.
 */
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
var ImmutableLanguageField = (0, _makeImmutable.default)(_languageField.default);
/**
 * Container component. The EditionSection component contains input fields
 * specific to the edition entity. The intention is that this component is
 * rendered as a modular section within the entity editor.
 *
 * @param {Object} props - The properties passed to the component.
 * @param {Array} props.editionFormats - The list of possible formats for a
 *                edition.
 * @param {Array} props.editionStatuses - The list of possible statuses for a
 *                edition.
 * @param {number} props.formatValue - The ID of the format currently selected
 *        for the edition.
 * @param {number} props.statusValue - The ID of the status currently selected
 *        for the edition.
 * @param {Function} props.onFormatChange - A function to be called when
 *        a different edition format is selected.
 * @param {Function} props.onStatusChange - A function to be called when
 *        a different edition status is selected.
 * @returns {ReactElement} React element containing the rendered EditionSection.
 */
function EditionSection(_ref) {
  var _this = this;
  var depthValue = _ref.depthValue,
    editionFormats = _ref.editionFormats,
    editionStatuses = _ref.editionStatuses,
    formatValue = _ref.formatValue,
    heightValue = _ref.heightValue,
    languageOptions = _ref.languageOptions,
    languageValues = _ref.languageValues,
    onLanguagesChange = _ref.onLanguagesChange,
    onDepthChange = _ref.onDepthChange,
    onFormatChange = _ref.onFormatChange,
    onHeightChange = _ref.onHeightChange,
    onReleaseDateChange = _ref.onReleaseDateChange,
    onPagesChange = _ref.onPagesChange,
    onToggleShowEditionGroupSection = _ref.onToggleShowEditionGroupSection,
    onEditionGroupChange = _ref.onEditionGroupChange,
    onPublisherChange = _ref.onPublisherChange,
    onStatusChange = _ref.onStatusChange,
    onWeightChange = _ref.onWeightChange,
    onWidthChange = _ref.onWidthChange,
    pagesValue = _ref.pagesValue,
    physicalEnable = _ref.physicalEnable,
    editionGroupRequired = _ref.editionGroupRequired,
    editionGroupValue = _ref.editionGroupValue,
    editionGroupVisible = _ref.editionGroupVisible,
    matchingNameEditionGroups = _ref.matchingNameEditionGroups,
    isUnifiedForm = _ref.isUnifiedForm,
    publishers = _ref.publisherValue,
    releaseDateValue = _ref.releaseDateValue,
    statusValue = _ref.statusValue,
    weightValue = _ref.weightValue,
    widthValue = _ref.widthValue,
    rest = (0, _objectWithoutProperties2.default)(_ref, _excluded);
  var languageOptionsForDisplay = languageOptions.map(function (language) {
    return {
      frequency: language.frequency,
      label: language.name,
      value: language.id
    };
  });
  var publisherValue = publishers !== null && publishers !== void 0 ? publishers : {};
  publisherValue = Object.values((0, _utils.convertMapToObject)(publisherValue));
  var editionFormatsForDisplay = editionFormats.map(function (format) {
    return {
      label: format.label,
      value: format.id
    };
  });
  var formatOption = editionFormatsForDisplay.filter(function (el) {
    return el.value === formatValue;
  });
  var editionStatusesForDisplay = editionStatuses.map(function (status) {
    return {
      label: status.label,
      value: status.id
    };
  });
  var statusOption = editionStatusesForDisplay.filter(function (el) {
    return el.value === statusValue;
  });
  var _validateEditionSecti = (0, _edition.validateEditionSectionReleaseDate)(releaseDateValue),
    isValidReleaseDate = _validateEditionSecti.isValid,
    dateErrorMessage = _validateEditionSecti.errorMessage;
  var hasmatchingNameEditionGroups = Boolean(matchingNameEditionGroups === null || matchingNameEditionGroups === void 0 ? void 0 : matchingNameEditionGroups.length);
  var showAutoCreateEditionGroupMessage = !editionGroupValue && !editionGroupVisible && !editionGroupRequired;
  var showMatchingEditionGroups = Boolean(hasmatchingNameEditionGroups && !editionGroupValue);
  var EntitySearchField = isUnifiedForm ? _searchEntityCreateSelect.default : _entitySearchFieldOption.default;
  var getEditionGroupSearchSelect = function getEditionGroupSearchSelect() {
    return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(_reactBootstrap.Col, {
      className: "margin-bottom-2",
      lg: {
        offset: isUnifiedForm || showMatchingEditionGroups ? 0 : 3,
        span: 6
      }
    }, /*#__PURE__*/React.createElement(EntitySearchField, (0, _extends2.default)({
      error: !(0, _edition.validateEditionSectionEditionGroup)(editionGroupValue, true),
      help: "Group with other Editions of the same book",
      instanceId: "edition-group",
      isUnifiedForm: isUnifiedForm,
      label: "Edition Group",
      languageOptions: languageOptions,
      tooltipText: /*#__PURE__*/React.createElement(React.Fragment, null, "Group together different Editions of the same book.", /*#__PURE__*/React.createElement("br", null), "For example paperback, hardcover and e-book editions."),
      type: "editionGroup",
      value: editionGroupValue,
      onChange: onEditionGroupChange
    }, rest)), /*#__PURE__*/React.createElement(_reactBootstrap.Button, {
      block: true,
      className: "wrap",
      variant: "primary"
      // eslint-disable-next-line react/jsx-no-bind
      ,
      onClick: onToggleShowEditionGroupSection.bind(_this, false)
    }, /*#__PURE__*/React.createElement(_reactFontawesome.FontAwesomeIcon, {
      icon: _freeSolidSvgIcons.faClone
    }), "\xA0Automatically create an Edition Group")));
  };
  var formatTooltip = /*#__PURE__*/React.createElement(_reactBootstrap.Tooltip, null, "The type of printing and binding of the edition, or digital equivalent");
  var statusTooltip = /*#__PURE__*/React.createElement(_reactBootstrap.Tooltip, null, "Has the work been published, or is it in a draft stage?");
  var headingTag = !isUnifiedForm && /*#__PURE__*/React.createElement("h2", null, "What else do you know about the Edition?");
  var colSpan = {
    offset: 3,
    span: 6
  };
  var shortColSpan = {
    offset: 3,
    span: 3
  };
  if (isUnifiedForm) {
    colSpan.offset = 0;
    shortColSpan.offset = 0;
  }
  return /*#__PURE__*/React.createElement("div", null, headingTag, !isUnifiedForm && /*#__PURE__*/React.createElement(_authorCreditSection.default, {
    type: "edition"
  }), /*#__PURE__*/React.createElement("p", {
    className: "text-muted"
  }, "Edition Group is required \u2014 this cannot be blank. You can search for and choose an existing Edition Group, or choose to automatically create one instead."), /*#__PURE__*/React.createElement(_reactBootstrap.Row, {
    className: "margin-bottom-3"
  }, showAutoCreateEditionGroupMessage ? /*#__PURE__*/React.createElement(_reactBootstrap.Col, {
    lg: {
      offset: isUnifiedForm || showMatchingEditionGroups ? 0 : 3,
      span: 6
    }
  }, /*#__PURE__*/React.createElement(_reactBootstrap.Alert, {
    variant: "success"
  }, /*#__PURE__*/React.createElement("p", null, "A new Edition Group with the same name will be created automatically."), /*#__PURE__*/React.createElement("br", null), /*#__PURE__*/React.createElement(_reactBootstrap.Button, {
    block: true,
    className: "wrap",
    variant: "success"
    // eslint-disable-next-line react/jsx-no-bind
    ,
    onClick: onToggleShowEditionGroupSection.bind(this, true)
  }, /*#__PURE__*/React.createElement(_reactFontawesome.FontAwesomeIcon, {
    icon: _freeSolidSvgIcons.faSearch
  }), "\xA0Search for an existing Edition Group"))) : getEditionGroupSearchSelect(), showMatchingEditionGroups && /*#__PURE__*/React.createElement(_reactBootstrap.Col, {
    lg: 6
  }, /*#__PURE__*/React.createElement(_reactBootstrap.Alert, {
    variant: "warning"
  }, matchingNameEditionGroups.length > 1 ? 'Edition Groups with the same name as this Edition already exist' : 'An existing Edition Group with the same name as this Edition already exists', /*#__PURE__*/React.createElement("br", null), "Please review the Edition Groups below and select the one that corresponds to your Edition.", /*#__PURE__*/React.createElement("br", null), /*#__PURE__*/React.createElement("small", null, "If no Edition Group is selected, a new one will be created automatically.", /*#__PURE__*/React.createElement("br", null), "Click on the ", /*#__PURE__*/React.createElement(_reactFontawesome.FontAwesomeIcon, {
    icon: _freeSolidSvgIcons.faExternalLinkAlt
  }), " icon open in a new tab, and click an item to select."), /*#__PURE__*/React.createElement(_reactBootstrap.ListGroup, {
    className: "margin-top-1"
  }, matchingNameEditionGroups.map(function (eg) {
    return /*#__PURE__*/React.createElement(_reactBootstrap.ListGroup.Item, {
      key: eg.bbid
    }, /*#__PURE__*/React.createElement(_linkedEntity.default, {
      data: (0, _entity.entityToOption)(eg),
      onSelect: onEditionGroupChange
    }));
  }))))), /*#__PURE__*/React.createElement("p", {
    className: "text-muted"
  }, "Below fields are optional \u2014 leave something blank if you don\u2019t know it"), /*#__PURE__*/React.createElement(_reactBootstrap.Row, null, !isUnifiedForm && /*#__PURE__*/React.createElement(_reactBootstrap.Col, {
    lg: colSpan
  }, /*#__PURE__*/React.createElement(_entitySearchFieldOption.default, {
    isMulti: true,
    instanceId: "publisher",
    label: "Publisher",
    type: "publisher",
    value: publisherValue,
    onChange: onPublisherChange
  }))), /*#__PURE__*/React.createElement(_reactBootstrap.Row, null, /*#__PURE__*/React.createElement(_reactBootstrap.Col, {
    lg: colSpan
  }, /*#__PURE__*/React.createElement(_newDateField.default, {
    show: true,
    defaultValue: releaseDateValue,
    empty: (0, _utils.isNullDate)(releaseDateValue),
    error: !isValidReleaseDate,
    errorMessage: dateErrorMessage,
    label: "Release Date",
    placeholder: "YYYY-MM-DD"
    // eslint-disable-next-line max-len
    ,
    tooltipText: "The date this specific edition was published (not the first publication date of the work). If unsure, leave empty.",
    onChangeDate: onReleaseDateChange
  }))), /*#__PURE__*/React.createElement(_reactBootstrap.Row, null, /*#__PURE__*/React.createElement(_reactBootstrap.Col, {
    lg: colSpan
  }, /*#__PURE__*/React.createElement(ImmutableLanguageField, {
    empty: true,
    isMulti: true,
    instanceId: "language",
    options: languageOptionsForDisplay,
    tooltipText: "Main language used for the content of the edition",
    value: languageValues,
    onChange: onLanguagesChange
  }))), /*#__PURE__*/React.createElement(_reactBootstrap.Row, null, /*#__PURE__*/React.createElement(_reactBootstrap.Col, {
    lg: shortColSpan
  }, /*#__PURE__*/React.createElement(_reactBootstrap.Form.Group, null, /*#__PURE__*/React.createElement(_reactBootstrap.Form.Label, null, "Format", /*#__PURE__*/React.createElement(_reactBootstrap.OverlayTrigger, {
    delay: 50,
    overlay: formatTooltip
  }, /*#__PURE__*/React.createElement(_reactFontawesome.FontAwesomeIcon, {
    className: "margin-left-0-5",
    icon: _freeSolidSvgIcons.faQuestionCircle
  }))), /*#__PURE__*/React.createElement(_reactSelect.default, {
    classNamePrefix: "react-select",
    instanceId: "editionFormat",
    isClearable: "true",
    isSearchable: false,
    options: editionFormatsForDisplay,
    value: formatOption,
    onChange: onFormatChange
  }))), /*#__PURE__*/React.createElement(_reactBootstrap.Col, {
    lg: 3
  }, /*#__PURE__*/React.createElement(_reactBootstrap.Form.Group, null, /*#__PURE__*/React.createElement(_reactBootstrap.Form.Label, null, "Status", /*#__PURE__*/React.createElement(_reactBootstrap.OverlayTrigger, {
    delay: 50,
    overlay: statusTooltip
  }, /*#__PURE__*/React.createElement(_reactFontawesome.FontAwesomeIcon, {
    className: "margin-left-0-5",
    icon: _freeSolidSvgIcons.faQuestionCircle
  }))), /*#__PURE__*/React.createElement(_reactSelect.default, {
    isClearable: true,
    classNamePrefix: "react-select",
    instanceId: "editionStatus",
    isSearchable: false,
    options: editionStatusesForDisplay,
    value: statusOption,
    onChange: onStatusChange
  })))), /*#__PURE__*/React.createElement(_reactBootstrap.Row, null, /*#__PURE__*/React.createElement(_reactBootstrap.Col, {
    lg: shortColSpan
  }, /*#__PURE__*/React.createElement(_numericField.default, {
    addonAfter: "pages",
    defaultValue: pagesValue,
    empty: (0, _isNil2.default)(pagesValue),
    error: !(0, _edition.validateEditionSectionPages)(pagesValue),
    label: "Page Count",
    onChange: onPagesChange
  }))), /*#__PURE__*/React.createElement(_reactBootstrap.Row, null, /*#__PURE__*/React.createElement(_reactBootstrap.Col, {
    lg: shortColSpan
  }, /*#__PURE__*/React.createElement(_numericField.default, {
    addonAfter: "mm",
    defaultValue: widthValue,
    disabled: !physicalEnable,
    empty: (0, _isNil2.default)(widthValue),
    error: !(0, _edition.validateEditionSectionWidth)(widthValue),
    label: "Width",
    onChange: onWidthChange
  }), /*#__PURE__*/React.createElement(_numericField.default, {
    addonAfter: "mm",
    defaultValue: heightValue,
    disabled: !physicalEnable,
    empty: (0, _isNil2.default)(heightValue),
    error: !(0, _edition.validateEditionSectionHeight)(heightValue),
    label: "Height",
    onChange: onHeightChange
  })), /*#__PURE__*/React.createElement(_reactBootstrap.Col, {
    lg: 3
  }, /*#__PURE__*/React.createElement(_numericField.default, {
    addonAfter: "g",
    defaultValue: weightValue,
    disabled: !physicalEnable,
    empty: (0, _isNil2.default)(weightValue),
    error: !(0, _edition.validateEditionSectionWeight)(weightValue),
    label: "Weight",
    onChange: onWeightChange
  }), /*#__PURE__*/React.createElement(_numericField.default, {
    addonAfter: "mm",
    defaultValue: depthValue,
    disabled: !physicalEnable,
    empty: (0, _isNil2.default)(depthValue),
    error: !(0, _edition.validateEditionSectionDepth)(depthValue),
    label: "Depth",
    onChange: onDepthChange
  }))));
}
EditionSection.displayName = 'EditionSection';
function mapStateToProps(rootState) {
  var state = rootState.get('editionSection');
  return {
    depthValue: state.get('depth'),
    editionGroupRequired: state.get('editionGroupRequired'),
    editionGroupValue: state.get('editionGroup'),
    editionGroupVisible: state.get('editionGroupVisible'),
    formatValue: state.get('format'),
    heightValue: state.get('height'),
    languageValues: state.get('languages'),
    matchingNameEditionGroups: state.get('matchingNameEditionGroups'),
    pagesValue: state.get('pages'),
    physicalEnable: state.get('physicalEnable'),
    publisherValue: state.get('publisher'),
    releaseDateValue: state.get('releaseDate'),
    statusValue: state.get('status'),
    weightValue: state.get('weight'),
    widthValue: state.get('width')
  };
}
function mapDispatchToProps(dispatch) {
  return {
    onDepthChange: function onDepthChange(event) {
      return dispatch((0, _actions.debouncedUpdateDepth)(event.target.value ? parseInt(event.target.value, 10) : null));
    },
    onEditionGroupChange: function onEditionGroupChange(value, action) {
      // If the user selected a new edition group, we need to clear the old one
      if (['clear', 'pop-value', 'select-option'].includes(action.action)) {
        dispatch((0, _action.clearEditionGroups)());
      }
      dispatch((0, _actions.updateEditionGroup)(value));
    },
    onFormatChange: function onFormatChange(value) {
      dispatch((0, _actions.updateFormat)(value && value.value));
      if (value.value === 3) {
        dispatch((0, _actions.disablePhysical)());
      } else {
        dispatch((0, _actions.enablePhysical)());
      }
    },
    onHeightChange: function onHeightChange(event) {
      return dispatch((0, _actions.debouncedUpdateHeight)(event.target.value ? parseInt(event.target.value, 10) : null));
    },
    onLanguagesChange: function onLanguagesChange(values) {
      return dispatch((0, _actions.updateLanguages)(values));
    },
    onPagesChange: function onPagesChange(event) {
      return dispatch((0, _actions.debouncedUpdatePages)(event.target.value ? parseInt(event.target.value, 10) : null));
    },
    onPublisherChange: function onPublisherChange(value) {
      return dispatch((0, _actions.updatePublisher)(Object.fromEntries(value.map(function (pub, index) {
        return [index, pub];
      }))));
    },
    onReleaseDateChange: function onReleaseDateChange(releaseDate) {
      return dispatch((0, _actions.debouncedUpdateReleaseDate)(releaseDate));
    },
    onStatusChange: function onStatusChange(value) {
      return dispatch((0, _actions.updateStatus)(value && value.value));
    },
    onToggleShowEditionGroupSection: function onToggleShowEditionGroupSection(showEGSection) {
      if (showEGSection === false) {
        dispatch((0, _actions.updateEditionGroup)(null));
      }
      return dispatch((0, _actions.toggleShowEditionGroup)(showEGSection));
    },
    onWeightChange: function onWeightChange(event) {
      return dispatch((0, _actions.debouncedUpdateWeight)(event.target.value ? parseInt(event.target.value, 10) : null));
    },
    onWidthChange: function onWidthChange(event) {
      return dispatch((0, _actions.debouncedUpdateWidth)(event.target.value ? parseInt(event.target.value, 10) : null));
    }
  };
}
var _default = (0, _reactRedux.connect)(mapStateToProps, mapDispatchToProps)(EditionSection);
exports.default = _default;
//# sourceMappingURL=edition-section.js.map