"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");

var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;

var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));

var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));

var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));

var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));

var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));

var _getPrototypeOf3 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));

var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));

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

var _propTypes = _interopRequireDefault(require("prop-types"));

var _immutable = _interopRequireDefault(require("immutable"));

var _reactImmutableProptypes = _interopRequireDefault(require("react-immutable-proptypes"));

var _differenceWith = _interopRequireDefault(require("lodash/differenceWith"));

var _intersectionWith = _interopRequireDefault(require("lodash/intersectionWith"));

var _isEqual = _interopRequireDefault(require("lodash/isEqual"));

var _isUndefined = _interopRequireDefault(require("lodash/isUndefined"));

var _keyBy = _interopRequireDefault(require("lodash/keyBy"));

var _Alert = _interopRequireDefault(require("@instructure/ui-alerts/lib/components/Alert"));

var _BreadcrumbLink = _interopRequireDefault(require("@instructure/ui-breadcrumb/lib/components/Breadcrumb/BreadcrumbLink"));

var _Button = _interopRequireDefault(require("@instructure/ui-buttons/lib/components/Button"));

var _Heading = _interopRequireDefault(require("@instructure/ui-elements/lib/components/Heading"));

var _IconDiscussion = _interopRequireDefault(require("@instructure/ui-icons/lib/Line/IconDiscussion"));

var _IconDiscussion2 = _interopRequireDefault(require("@instructure/ui-icons/lib/Solid/IconDiscussion"));

var _PresentationContent = _interopRequireDefault(require("@instructure/ui-a11y/lib/components/PresentationContent"));

var _ScreenReaderContent = _interopRequireDefault(require("@instructure/ui-a11y/lib/components/ScreenReaderContent"));

var _Text = _interopRequireDefault(require("@instructure/ui-elements/lib/components/Text"));

var _TextInput = _interopRequireDefault(require("@instructure/ui-forms/lib/components/TextInput"));

var _lib = _interopRequireDefault(require("@instructure/ui-themeable/lib"));

var _EntrySave = _interopRequireDefault(require("../../../common/components/resources/entry/EntrySave"));

var _ItemEdit = _interopRequireDefault(require("../../../common/components/resources/item/ItemEdit"));

var _ItemFeedbackModal = _interopRequireDefault(require("../../../building/components/resources/ItemFeedbackModal"));

var _ItemShow = _interopRequireDefault(require("../../../common/components/resources/item/ItemShow"));

var _Page = _interopRequireDefault(require("../../../common/components/layout/Page"));

var _Spinner = _interopRequireDefault(require("../../../common/components/shared/spinner/Spinner"));

var _StimulusEditInfo = _interopRequireDefault(require("../../../common/components/resources/stimulus/StimulusEditInfo"));

var _StimulusShowInfo = _interopRequireDefault(require("../../../common/components/resources/stimulus/StimulusShowInfo"));

var _TagSuggestSelect = _interopRequireDefault(require("../../../common/components/shared/TagSuggestSelect"));

var _WarningWrapper = _interopRequireDefault(require("../../../common/components/resources/WarningWrapper"));

var _formatMessage = _interopRequireDefault(require("@instructure/quiz-i18n/lib/format-message"));

var _items = require("../../../building/api/items");

var _stimuli = require("../../../building/api/stimuli");

var _warningHelpers = require("../../../common/util/warningHelpers");

var _NavWrapper = _interopRequireDefault(require("../NavWrapper"));

var _constants = require("@instructure/quiz-common/lib/constants");

var _theme = _interopRequireDefault(require("./theme"));

var _dec, _class, _class2, _temp;

var styles = {
  componentId: 'dhhIK',
  template: function template(theme) {
    return "\n\n.quiz-core__BankEntry--content {\n  padding: ".concat(theme.contentPaddingTopBottom || 'inherit', " ").concat(theme.contentPaddingLeftRight || 'inherit', ";\n  background-color: ").concat(theme.contentBackgroundColor || 'inherit', ";\n}\n\n.quiz-core__BankEntry--entryRow {\n  margin-bottom: ").concat(theme.entryRowMargin || 'inherit', ";\n}\n\n.quiz-core__BankEntry--headerRow {\n  display: flex;\n  flex-direction: row;\n  justify-content: space-between;\n  align-items: flex-start;\n  color: ").concat(theme.headerRowColor || 'inherit', ";\n  padding: ").concat(theme.headerRowPadding || 'inherit', ";\n}\n\n.quiz-core__BankEntry--leftHeader {\n  flex: 0 0 auto;\n  display: flex;\n  flex-direction: column;\n  align-items: flex-start;\n  margin-right: ").concat(theme.leftHeaderMargin || 'inherit', ";\n}\n\n.quiz-core__BankEntry--headerText {\n  font-size: ").concat(theme.headerTextFontSize || 'inherit', ";\n}\n\n.quiz-core__BankEntry--header {\n  background-color: ").concat(theme.headerBackgroundColor || 'inherit', ";\n  color: ").concat(theme.headerColor || 'inherit', ";\n  padding: ").concat(theme.headerPaddingTopBottom || 'inherit', " ").concat(theme.headerPaddingLeftRight || 'inherit', ";\n  display: flex;\n  justify-content: space-between;\n  vertical-align: middle;\n  align-items: center;\n}\n\n.quiz-core__BankEntry--rightHeader {\n  text-align: right;\n  padding-left: ").concat(theme.rightHeaderPaddingLeft || 'inherit', ";\n}\n\n[dir=\"ltr\"] .quiz-core__BankEntry--rightHeader {\n  text-align: right;\n}\n\n[dir=\"rtl\"] .quiz-core__BankEntry--rightHeader {\n  text-align: right;\n}\n\n.quiz-core__BankEntry--footer,\n.quiz-core__BankEntry--leftFooter,\n.quiz-core__BankEntry--rightFooter {\n  display: flex;\n  flex-direction: row;\n}\n\n.quiz-core__BankEntry--footer {\n  text-align: left;\n  padding-bottom: ").concat(theme.footerPaddingBottom || 'inherit', ";\n  padding-top: ").concat(theme.footerPaddingTop || 'inherit', ";\n}\n\n[dir=\"ltr\"] .quiz-core__BankEntry--footer {\n  text-align: left;\n}\n\n[dir=\"rtl\"] .quiz-core__BankEntry--footer {\n  text-align: left;\n}\n\n.quiz-core__BankEntry--rightFooter {\n  flex: 8 0 0;\n  justify-content: flex-end;\n  padding-left: ").concat(theme.rightFooterPaddingLeftRight || 'inherit', ";\n  padding-right: ").concat(theme.rightFooterPaddingLeftRight || 'inherit', ";\n}\n\n.quiz-core__BankEntry--entryEdit {\n  border-bottom: ").concat(theme.entryEditBorderWidth || 'inherit', " solid ").concat(theme.entryEditBorderColor || 'inherit', ";\n}\n");
  },
  'content': 'quiz-core__BankEntry--content',
  'entryRow': 'quiz-core__BankEntry--entryRow',
  'headerRow': 'quiz-core__BankEntry--headerRow',
  'leftHeader': 'quiz-core__BankEntry--leftHeader',
  'headerText': 'quiz-core__BankEntry--headerText',
  'header': 'quiz-core__BankEntry--header',
  'rightHeader': 'quiz-core__BankEntry--rightHeader',
  'footer': 'quiz-core__BankEntry--footer',
  'leftFooter': 'quiz-core__BankEntry--leftFooter',
  'rightFooter': 'quiz-core__BankEntry--rightFooter',
  'entryEdit': 'quiz-core__BankEntry--entryEdit'
};
var BankEntry = (_dec = (0, _lib.default)(_theme.default, styles), _dec(_class = (_temp = _class2 =
/*#__PURE__*/
function (_Component) {
  (0, _inherits2.default)(BankEntry, _Component);

  function BankEntry() {
    var _getPrototypeOf2;

    var _this;

    (0, _classCallCheck2.default)(this, BankEntry);

    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
      args[_key] = arguments[_key];
    }

    _this = (0, _possibleConstructorReturn2.default)(this, (_getPrototypeOf2 = (0, _getPrototypeOf3.default)(BankEntry)).call.apply(_getPrototypeOf2, [this].concat(args)));

    _this.navigateToBank = function () {
      _this.props.navigateToBank(_this.props.bankId);
    };

    _this.handleTitleChange = function (e) {
      _this.props.changeItemTitle(_this.props.entry.id, e.target.value);
    };

    _this.submitHandler =
    /*#__PURE__*/
    (0, _asyncToGenerator2.default)(
    /*#__PURE__*/
    _regenerator.default.mark(function _callee() {
      return _regenerator.default.wrap(function _callee$(_context) {
        while (1) {
          switch (_context.prev = _context.next) {
            case 0:
              if (!_this.props.entry.isTemporary()) {
                _context.next = 5;
                break;
              }

              _context.next = 3;
              return _this.temporarySubmit();

            case 3:
              _context.next = 7;
              break;

            case 5:
              _context.next = 7;
              return _this.normalSubmit();

            case 7:
              _this.navigateToBank();

            case 8:
            case "end":
              return _context.stop();
          }
        }
      }, _callee);
    }));

    _this.clearChanges = function () {
      if (!_this.props.entry) return;

      if (_this.props.entry.isTemporary()) {
        _this.props.clearTemporaryBankItem(_this.props.bankId);
      }

      _this.props.clearModifications('items', _this.props.entry.id);

      _this.props.setPendingDeletionTagAssociations(_this.props.bankEntry.entryType, _this.props.entry.id, []);

      _this.props.setPendingAdditionTagAssociations(_this.props.bankEntry.entryType, _this.props.entry.id, []);
    };

    _this.handlePointsChange = function (points) {
      _this.props.changeQuizEntryPoints(_this.props.entry.id, points);
    };

    _this.editProps = function (entry) {
      return {
        cancelHandler: _this.navigateToBank,
        clearChanges: _this.clearChanges,
        contextUuid: null,
        entry: entry,
        guid: "".concat(_this.props.bankEntry.id, "_bank_entry_edit"),
        handleQuizEntryPointsChange: _this.handlePointsChange,
        parentId: _this.props.bankId,
        parentType: _constants.PARENT_TYPE_BANK,
        stimulus: entry,
        submitHandler: _this.submitHandler
      };
    };

    _this.openFeedbackModal = function () {
      _this.props.setUi(_constants.ITEM_FEEDBACK_MODAL_ITEM, _this.props.entry.getWorkingInstance());

      _this.props.setUi(_constants.ITEM_FEEDBACK_MODAL_FEEDBACK, _this.props.entry.getWorkingInstance().feedback);

      _this.props.openModal(_constants.ITEM_FEEDBACK_MODAL, {
        modalTrigger: _this.addFeedbackButton
      });
    };

    _this.storeFeedbackButtonRef = function (button) {
      _this.addFeedbackButton = button;
    };

    _this.compareTagValues = function (left, right) {
      return left.tag_value === right.tag_value;
    };

    _this.tagToAssociation = function (_ref2) {
      var value = _ref2.value;
      return {
        tag_value: value
      };
    };

    _this.handleTagChange = function (tags) {
      var bankEntry = _this.props.bankEntry;

      var tagAssociations = _this.props.tagAssociations.toJS();

      var associations = tags.map(_this.tagToAssociation);
      var removed = (0, _differenceWith.default)(tagAssociations, associations, _this.compareTagValues);
      var created = (0, _differenceWith.default)(associations, tagAssociations, _this.compareTagValues); // If a tag that was removed is being re-added,
      // remove from both addAssociations and deletedTags

      var restored = (0, _intersectionWith.default)(created, removed, _this.compareTagValues);
      var addOperations = (0, _differenceWith.default)(created, restored, _isEqual.default);
      var deleteOperations = (0, _differenceWith.default)(removed, restored, _this.compareTagValues);

      var bankEntryId = _this.getBankEntryId(bankEntry);

      _this.props.setPendingDeletionTagAssociations(bankEntry.entryType, bankEntryId, deleteOperations);

      _this.props.setPendingAdditionTagAssociations(bankEntry.entryType, bankEntryId, addOperations);
    };

    return _this;
  }

  (0, _createClass2.default)(BankEntry, [{
    key: "componentDidMount",
    value: function componentDidMount() {
      if (!this.isTemporary()) {
        this.props.getBankEntry(this.props.bankId, this.props.bankEntryId);
      }

      this.props.getBank(this.props.bankId);
    }
  }, {
    key: "componentWillUnmount",
    value: function componentWillUnmount() {
      this.props.setShouldClone(false);
    }
  }, {
    key: "componentWillMount",
    value: function componentWillMount() {
      this.props.setShouldClone(false);
    }
  }, {
    key: "isTemporary",
    value: function isTemporary() {
      return this.props.entry && this.props.entry.isTemporary();
    }
  }, {
    key: "isItemEntry",
    value: function isItemEntry() {
      return this.props.bankEntry.entryType === 'Item';
    }
  }, {
    key: "entryLinkName",
    value: function entryLinkName() {
      if (this.isTemporary()) {
        return this.isItemEntry() ? "Nytt element" : "Nye stimulus";
      } else {
        return this.isItemEntry() ? "Redigere elementet" : "Rediger stimulus";
      }
    }
  }, {
    key: "renderNav",
    value: function renderNav() {
      return _react.default.createElement(_NavWrapper.default, {
        closeTray: this.props.closeTray,
        navigateToBanks: this.props.navigateToBanks,
        navigateToBuild: this.props.navigateToBuild
      }, _react.default.createElement(_BreadcrumbLink.default, {
        key: "bank",
        onClick: this.navigateToBank,
        autoFocus: true
      }, this.props.bank.title), _react.default.createElement(_BreadcrumbLink.default, {
        key: "bankEntry"
      }, this.entryLinkName()));
    }
  }, {
    key: "renderTitle",
    value: function renderTitle(entry) {
      if (this.isItemEntry()) {
        return _react.default.createElement(_TextInput.default, {
          label: _react.default.createElement(_ScreenReaderContent.default, null, "Rediger sp\xF8rsm\xE5lstittel"),
          type: "text",
          placeholder: "Sp\xF8rsm\xE5lstittel",
          onChange: this.handleTitleChange,
          value: entry.getWorkingInstance().title
        });
      }
    }
  }, {
    key: "renderHeader",
    value: function renderHeader(entry) {
      if (!entry) return;
      var props = this.editProps(entry);
      var identifier = this.isItemEntry() ? "Element " + entry.id : "Stimulus " + entry.id;
      var tempIdentifier = this.isItemEntry() ? "Nytt element" : "Nye stimulus";
      var itemIdentifier = this.isTemporary() ? tempIdentifier : identifier;
      var entryName = this.isItemEntry() ? entry.getInteractionType().name : "Stimulus";
      var separator = ' | ';
      return _react.default.createElement("div", {
        className: styles.header
      }, _react.default.createElement("div", {
        className: styles.leftHeader
      }, _react.default.createElement("div", {
        className: styles.headerText
      }, _react.default.createElement(_Heading.default, {
        level: "reset",
        as: "h2"
      }, entryName, _react.default.createElement(_PresentationContent.default, null, separator), itemIdentifier))), this.renderTitle(entry), _react.default.createElement("div", {
        className: styles.rightHeader
      }, _react.default.createElement(_EntrySave.default, props)));
    }
  }, {
    key: "hasPendingTagModifications",
    value: function hasPendingTagModifications() {
      return !this.props.pendingDeletionTags.isEmpty() || !this.props.pendingAdditionTags.isEmpty();
    }
  }, {
    key: "createTagsForClone",
    value: function createTagsForClone(newBankEntry, tags) {
      this.props.createTagAssociations(newBankEntry.id, newBankEntry.entry_type, newBankEntry.entry.id, tags.map(function (tag) {
        return tag.tag_value;
      })); // Pending tag associations were applied to the original bank entry, so clear those out

      this.props.setPendingAdditionTagAssociations(this.props.bankEntry.entryType, this.props.entry.id, []);
      this.props.setPendingDeletionTagAssociations(this.props.bankEntry.entryType, this.props.entry.id, []);
    }
  }, {
    key: "updateTagsForEntry",
    value: function () {
      var _updateTagsForEntry = (0, _asyncToGenerator2.default)(
      /*#__PURE__*/
      _regenerator.default.mark(function _callee2() {
        return _regenerator.default.wrap(function _callee2$(_context2) {
          while (1) {
            switch (_context2.prev = _context2.next) {
              case 0:
                if (this.props.shouldClone) {
                  _context2.next = 5;
                  break;
                }

                _context2.next = 3;
                return this.props.createTagAssociations(this.props.bankEntryId, this.props.bankEntry.entryType, this.getBankEntryId(this.props.bankEntry), this.props.pendingAdditionTags.map(function (tagToAdd) {
                  return tagToAdd.get('tag_value');
                }));

              case 3:
                _context2.next = 5;
                return this.props.deleteTagAssociations(this.props.bankEntryId, this.props.bankEntry.entryType, this.getBankEntryId(this.props.bankEntry), this.props.pendingDeletionTags.map(function (tagToDelete) {
                  return tagToDelete.get('id');
                }));

              case 5:
              case "end":
                return _context2.stop();
            }
          }
        }, _callee2, this);
      }));

      function updateTagsForEntry() {
        return _updateTagsForEntry.apply(this, arguments);
      }

      return updateTagsForEntry;
    }()
  }, {
    key: "normalSubmit",
    value: function () {
      var _normalSubmit = (0, _asyncToGenerator2.default)(
      /*#__PURE__*/
      _regenerator.default.mark(function _callee3() {
        var entry, tags, createEntryCb, newBankEntry, workingEntry, updateFunc, toClear;
        return _regenerator.default.wrap(function _callee3$(_context3) {
          while (1) {
            switch (_context3.prev = _context3.next) {
              case 0:
                entry = this.props.entry;

                if (!(entry.hasModifications() || this.props.shouldClone && this.hasPendingTagModifications())) {
                  _context3.next = 17;
                  break;
                }

                if (!this.props.shouldClone) {
                  _context3.next = 11;
                  break;
                }

                tags = this.visibleTagAssociations();
                createEntryCb = this.isItemEntry() ? _items.createItem : _stimuli.createStimulus;
                _context3.next = 7;
                return this.props.cloneBankEntry(this.props.bankEntry, createEntryCb);

              case 7:
                newBankEntry = _context3.sent;
                this.createTagsForClone(newBankEntry, tags);
                _context3.next = 15;
                break;

              case 11:
                workingEntry = entry.getWorkingInstance();
                updateFunc = this.isItemEntry() ? this.props.updateItem : this.props.updateStimulus;
                _context3.next = 15;
                return updateFunc(workingEntry, this.props.bankId, 'bank');

              case 15:
                toClear = this.isItemEntry() ? 'items' : 'stimuli';
                this.props.clearModifications(toClear, entry.id);

              case 17:
                if (!this.hasPendingTagModifications()) {
                  _context3.next = 20;
                  break;
                }

                _context3.next = 20;
                return this.updateTagsForEntry();

              case 20:
              case "end":
                return _context3.stop();
            }
          }
        }, _callee3, this);
      }));

      function normalSubmit() {
        return _normalSubmit.apply(this, arguments);
      }

      return normalSubmit;
    }()
  }, {
    key: "temporarySubmit",
    value: function () {
      var _temporarySubmit = (0, _asyncToGenerator2.default)(
      /*#__PURE__*/
      _regenerator.default.mark(function _callee4() {
        var entry, workingEntry, workingBankEntry, createEntryCb, newBankEntry, toClear;
        return _regenerator.default.wrap(function _callee4$(_context4) {
          while (1) {
            switch (_context4.prev = _context4.next) {
              case 0:
                entry = this.props.entry;
                workingEntry = entry.getWorkingInstance();
                workingBankEntry = this.props.bankEntry.getWorkingInstance();
                createEntryCb = this.isItemEntry() ? _items.createItem : _stimuli.createStimulus;
                _context4.next = 6;
                return this.props.createEntryAndBankEntry(this.props.bankId, workingEntry, workingBankEntry, createEntryCb);

              case 6:
                newBankEntry = _context4.sent;

                if (this.hasPendingTagModifications()) {
                  this.props.createTagAssociations(newBankEntry.id, newBankEntry.entry_type, newBankEntry.entry.id, this.props.pendingAdditionTags.map(function (tagToAdd) {
                    return tagToAdd.get('tag_value');
                  }));
                }

                toClear = this.isItemEntry() ? 'items' : 'stimuli';
                this.props.clearModifications(toClear, entry.id);
                this.props.clearTemporaryBankItem(this.props.bankId);

              case 11:
              case "end":
                return _context4.stop();
            }
          }
        }, _callee4, this);
      }));

      function temporarySubmit() {
        return _temporarySubmit.apply(this, arguments);
      }

      return temporarySubmit;
    }()
  }, {
    key: "renderFeedbackSection",
    value: function renderFeedbackSection() {
      if (!this.isItemEntry()) {
        return;
      }

      var shouldClone = this.props.shouldClone;
      var disabled = this.props.entry.isImmutable() && !shouldClone;
      var icon, text;

      if (this.props.entry.getWorkingInstance().hasFeedback()) {
        icon = _IconDiscussion2.default;
        text = "Rediger tilbakemelding p\xE5 element-niv\xE5 (n\xE5v\xE6rende)";
      } else {
        icon = _IconDiscussion.default;
        text = "Redigere elementniv\xE5 tilbakemelding";
      }

      return _react.default.createElement(_Button.default, {
        variant: "icon",
        onClick: this.openFeedbackModal,
        disabled: disabled,
        ref: this.storeFeedbackButtonRef,
        icon: icon
      }, _react.default.createElement(_ScreenReaderContent.default, null, text));
    }
  }, {
    key: "getBankEntryId",
    value: function getBankEntryId(bankEntry) {
      // bankEntry.entry can be either 'TEMPORARY_ITEM' or an entire Map
      return bankEntry.entry ? bankEntry.entry.get ? bankEntry.entry.get('id') : bankEntry.entry : null;
    }
  }, {
    key: "visibleTagAssociations",
    value: function visibleTagAssociations() {
      var _this$props = this.props,
          pendingAdditionTags = _this$props.pendingAdditionTags,
          pendingDeletionTags = _this$props.pendingDeletionTags,
          tagAssociations = _this$props.tagAssociations;
      var existingValues = (0, _keyBy.default)(tagAssociations.toJS(), function (t) {
        return t.tag_value;
      });
      var noDuplicates = pendingAdditionTags.filter(function (t) {
        return (0, _isUndefined.default)(existingValues[t.get('tag_value')]);
      });
      return tagAssociations.filter(function (tag) {
        return !pendingDeletionTags.includes(tag);
      }).concat(noDuplicates).toJS();
    }
  }, {
    key: "visibleTags",
    value: function visibleTags() {
      return this.visibleTagAssociations().map(function (a) {
        return {
          id: a.tag_id,
          value: a.tag_value
        };
      });
    }
  }, {
    key: "renderEntry",
    value: function renderEntry(entry) {
      var _this2 = this;

      if (!entry) return;
      var _this$props2 = this.props,
          bankEntry = _this$props2.bankEntry,
          useBankTags = _this$props2.useBankTags;
      var props = this.editProps(entry);
      var propsFunc = this.isItemEntry() ? _warningHelpers.propsForItemVersioningWrapper : _warningHelpers.propsForStimulusVersioningWrapper;
      var versioningProps = propsFunc(entry.isImmutable(), this.props.shouldClone, this.props.setShouldClone, this.navigateToBank, true);
      var canEdit = !entry.isImmutable() || this.props.shouldClone;
      var ItemComponent = canEdit ? _ItemEdit.default : _ItemShow.default;
      var StimulusComponent = canEdit ? _StimulusEditInfo.default : _StimulusShowInfo.default;
      var EntryComponent = this.isItemEntry() ? ItemComponent : StimulusComponent;
      var entryType = bankEntry.entryType;
      var entryId = this.getBankEntryId(bankEntry);

      var tags = function tags() {
        return _react.default.createElement(_TagSuggestSelect.default, {
          allowNewTags: true,
          noMatchText: "Angi en knagg for \xE5 finne eller opprette",
          parentType: entryType,
          parentId: entryId,
          onChange: _this2.handleTagChange,
          tags: _this2.visibleTags()
        });
      };

      return _react.default.createElement("div", null, _react.default.createElement("div", {
        className: styles.entryEdit
      }, _react.default.createElement(_WarningWrapper.default, versioningProps, canEdit && _react.default.createElement(_Alert.default, {
        closeButtonLabel: "Avvise",
        margin: "0 0 medium 0"
      }, _react.default.createElement(_Text.default, null, "Endringer gjort her vil vises p\xE5 alle vurderinger som bruker dette elementet.")), _react.default.createElement(EntryComponent, props), useBankTags && tags())), _react.default.createElement("div", {
        className: styles.footer
      }, _react.default.createElement("div", {
        className: styles.leftFooter
      }, this.renderFeedbackSection()), _react.default.createElement("div", {
        className: styles.rightFooter
      }, _react.default.createElement(_EntrySave.default, props))));
    }
  }, {
    key: "render",
    value: function render() {
      var entry = this.props.entry;

      if (entry && !entry.isLoaded()) {
        return _react.default.createElement(_Spinner.default, null);
      }

      return _react.default.createElement(_Page.default, null, this.renderNav(), _react.default.createElement("div", {
        className: styles.content
      }, this.renderHeader(entry), this.renderEntry(entry), !this.props.isCompact && _react.default.createElement(_ItemFeedbackModal.default, {
        parentId: this.props.bankId,
        parentType: _constants.PARENT_TYPE_BANK
      })));
    }
  }]);
  BankEntry.displayName = "BankEntry";
  return BankEntry;
}(_react.Component), _class2.propTypes = {
  bankEntryId: _propTypes.default.string.isRequired,
  bankId: _propTypes.default.string.isRequired,
  bank: _reactImmutableProptypes.default.record.isRequired,
  bankEntry: _reactImmutableProptypes.default.record.isRequired,
  entry: _reactImmutableProptypes.default.record,
  changeItemTitle: _propTypes.default.func.isRequired,
  changeQuizEntryPoints: _propTypes.default.func.isRequired,
  cloneBankEntry: _propTypes.default.func.isRequired,
  clearModifications: _propTypes.default.func.isRequired,
  clearTemporaryBankItem: _propTypes.default.func.isRequired,
  createEntryAndBankEntry: _propTypes.default.func.isRequired,
  closeTray: _propTypes.default.func.isRequired,
  createTagAssociations: _propTypes.default.func.isRequired,
  deleteTagAssociations: _propTypes.default.func.isRequired,
  getBankEntry: _propTypes.default.func.isRequired,
  getBank: _propTypes.default.func.isRequired,
  isCompact: _propTypes.default.bool,
  navigateToBanks: _propTypes.default.func.isRequired,
  // can be from consumer
  navigateToBank: _propTypes.default.func.isRequired,
  // can be from consumer
  navigateToBuild: _propTypes.default.func.isRequired,
  // from consumer
  openModal: _propTypes.default.func.isRequired,
  pendingAdditionTags: _reactImmutableProptypes.default.listOf(_reactImmutableProptypes.default.map),
  pendingDeletionTags: _reactImmutableProptypes.default.listOf(_reactImmutableProptypes.default.map),
  setPendingAdditionTagAssociations: _propTypes.default.func.isRequired,
  setPendingDeletionTagAssociations: _propTypes.default.func.isRequired,
  setShouldClone: _propTypes.default.func.isRequired,
  setTagInput: _propTypes.default.func.isRequired,
  setUi: _propTypes.default.func.isRequired,
  shouldClone: _propTypes.default.bool.isRequired,
  tagAssociations: _reactImmutableProptypes.default.listOf(_reactImmutableProptypes.default.map),
  tagInput: _propTypes.default.string,
  updateItem: _propTypes.default.func.isRequired,
  updateStimulus: _propTypes.default.func.isRequired,
  useBankTags: _propTypes.default.bool
}, _class2.defaultProps = {
  isCompact: false,
  pendingAdditionTags: _immutable.default.List(),
  pendingDeletionTags: _immutable.default.List(),
  tagAssociations: _immutable.default.List(),
  tagInput: null,
  useBankTags: false
}, _temp)) || _class);
exports.default = BankEntry;