@instructure/quiz-grading/lib/components/resources/quizEntry/RegradeOverride/presenter.js

The Quiz React SDK by Instructure Inc.

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
  value: true
});
exports["default"] = exports.RegradeOverride = void 0;
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 _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
var _react = require("react");
var _propTypes = _interopRequireDefault(require("prop-types"));
var _reactImmutableProptypes = _interopRequireDefault(require("react-immutable-proptypes"));
var _immutable = require("immutable");
var _uiAlerts = require("@instructure/ui-alerts");
var _uiButtons = require("@instructure/ui-buttons");
var _uiA11yContent = require("@instructure/ui-a11y-content");
var _uiText = require("@instructure/ui-text");
var _emotion = require("@instructure/emotion");
var _quizCore = require("@instructure/quiz-core");
var _quizCommon = require("@instructure/quiz-common");
var _RegradingModal = _interopRequireDefault(require("../../../RegradingModal"));
var _styles = _interopRequireDefault(require("./styles"));
var _theme = _interopRequireDefault(require("./theme"));
var _formatMessage = _interopRequireDefault(require("@instructure/quiz-i18n/es/format-message"));
var _dec, _class, _RegradeOverride;
/** @jsx jsx */
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) { (0, _defineProperty2["default"])(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; }
function _callSuper(_this, derived, args) {
  function isNativeReflectConstruct() {
    if (typeof Reflect === "undefined" || !Reflect.construct) return false;
    if (Reflect.construct.sham) return false;
    if (typeof Proxy === "function") return true;
    try {
      return !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {}));
    } catch (e) {
      return false;
    }
  }
  derived = (0, _getPrototypeOf2["default"])(derived);
  return (0, _possibleConstructorReturn2["default"])(_this, isNativeReflectConstruct() ? Reflect.construct(derived, args || [], (0, _getPrototypeOf2["default"])(_this).constructor) : derived.apply(_this, args));
}
var noop = function noop() {};
var RegradeOverride = exports.RegradeOverride = (_dec = (0, _quizCommon.withStyleOverrides)(_styles["default"], _theme["default"]), _dec(_class = (_RegradeOverride = /*#__PURE__*/function (_Component) {
  function RegradeOverride() {
    var _this2;
    (0, _classCallCheck2["default"])(this, RegradeOverride);
    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
      args[_key] = arguments[_key];
    }
    _this2 = _callSuper(this, RegradeOverride, [].concat(args));
    (0, _defineProperty2["default"])(_this2, "handleQuizEntryPointsChange", function (points) {
      var _this2$props = _this2.props,
        workingQuizEntry = _this2$props.workingQuizEntry,
        workingEntry = _this2$props.workingEntry;
      var qerIndexToUpdate = workingQuizEntry.quizEntryRegrades.findIndex(function (qer) {
        return qer.get('itemId') == workingEntry.id;
      });
      var newQuizEntryRegrades = qerIndexToUpdate > -1 ? workingQuizEntry.quizEntryRegrades.setIn([qerIndexToUpdate, 'pointsPossible'], null) : workingQuizEntry.quizEntryRegrades;
      _this2.props.changeQuizEntryPoints(workingQuizEntry.id, points, newQuizEntryRegrades.toJS());
    });
    (0, _defineProperty2["default"])(_this2, "navigateToTop", function () {
      setTimeout(function () {
        _this2.props.screenreaderNotification((0, _formatMessage["default"])('Focus moved to top of question. Navigate down to continue.'));
        _this2.alertNode.focus();
      });
    });
    (0, _defineProperty2["default"])(_this2, "turnOffRegradingEditMode", function () {
      _this2.props.clearModifications('items', _this2.props.itemId);
      _this2.props.clearModifications('quizEntries', _this2.props.sessionItem.quizEntryId);
      _this2.props.toggleRegradingEditMode('');
      _this2.props.onCancel(_this2.props.sessionItem.id);
    });
    (0, _defineProperty2["default"])(_this2, "triggerRegradingModal", function (e) {
      var _this2$props2 = _this2.props,
        displayPosition = _this2$props2.displayPosition,
        workingQuizEntry = _this2$props2.workingQuizEntry,
        itemId = _this2$props2.itemId;
      e && e.preventDefault();
      if (_this2.isValid()) {
        _this2.props.hideError(_this2.props.guid);
        var _this2$props$workingE = _this2.props.workingEntry,
          scoringAlgorithm = _this2$props$workingE.scoringAlgorithm,
          scoringData = _this2$props$workingE.scoringData;
        var pointsPossible = workingQuizEntry.regradeAdjustedPointsPossible(itemId) || workingQuizEntry.pointsPossible;
        _this2.props.setRegradingPayload({
          itemId: _this2.props.itemId,
          quizEntryId: _this2.props.quizEntry.id,
          pointsPossible: pointsPossible,
          scoringAlgorithm: scoringAlgorithm,
          scoringData: scoringData
        });
        _this2.props.openModal(_quizCommon.REGRADE_MODAL);
      } else {
        var msg = (0, _formatMessage["default"])('Question {displayPosition, number} cannot be saved due to invalid input data.', {
          displayPosition: displayPosition
        });
        _this2.props.screenreaderNotification(msg);
        _this2.props.showError(_this2.props.guid);
      }
    });
    (0, _defineProperty2["default"])(_this2, "setAlertRef", function (node) {
      _this2.alertNode = node;
    });
    (0, _defineProperty2["default"])(_this2, "renderActionFooter", function () {
      return (0, _emotion.jsx)("div", null, (0, _emotion.jsx)(_uiButtons.Button, {
        margin: "small",
        onClick: _this2.turnOffRegradingEditMode
      }, (0, _formatMessage["default"])('Cancel')), (0, _emotion.jsx)(_uiButtons.Button, {
        margin: "small",
        color: "primary",
        onClick: _this2.triggerRegradingModal,
        "data-automation": "sdk-trigger-regrade-button"
      }, _formatMessage["default"].rich('Regrade <0>question {position, number}</0>', {
        0: function _(_ref) {
          var children = _ref.children;
          return (0, _emotion.jsx)(_uiA11yContent.ScreenReaderContent, {
            key: "0"
          }, children);
        },
        position: _this2.props.quizEntry.position
      })));
    });
    return _this2;
  }
  (0, _inherits2["default"])(RegradeOverride, _Component);
  return (0, _createClass2["default"])(RegradeOverride, [{
    key: "quizEntryProps",
    value: function quizEntryProps() {
      return _objectSpread(_objectSpread({}, this.props), {}, {
        alternativeRightFooter: this.renderActionFooter,
        changeItemTitle: noop,
        clearModifications: noop,
        clearTemporaryItem: noop,
        cloneQuizEntry: noop,
        connectDragPreview: noop,
        connectDragSource: noop,
        createItem: noop,
        createQuizEntry: noop,
        disabledForRegrade: true,
        draggingAboveHalf: false,
        draggingOver: false,
        haveValidationErrorsFromApi: Boolean(Object.values(this.props.validationErrorsFromApi).length),
        hideError: noop,
        isOccluded: false,
        itemFeedbackOn: false,
        name: '',
        openModal: noop,
        openRegradeModal: noop,
        quizEntries: (0, _immutable.List)(),
        removeQuizEntry: noop,
        screenreaderNotification: noop,
        setUi: noop,
        shouldClone: false,
        showError: noop,
        switchOffEditing: noop,
        updateItem: noop,
        updateQuizEntry: noop,
        withConfirm: noop
      });
    }
  }, {
    key: "itemEditProps",
    value: function itemEditProps() {
      return _objectSpread(_objectSpread({}, this.props), {}, {
        handleQuizEntryPointsChange: this.handleQuizEntryPointsChange,
        openImportModal: function openImportModal() {},
        parentId: this.props.quizId,
        parentType: _quizCommon.PARENT_TYPE_QUIZ,
        title: this.props.entry.title,
        workingItem: this.props.workingEntry
      });
    }
  }, {
    key: "componentDidMount",
    value: function componentDidMount() {
      if (this.props.quizEntry.id === '0') {
        this.props.getQuizEntry(this.props.quizId, this.props.sessionItem.quizEntryId);
      }
      if (!this.props.entry.isLoaded()) {
        this.props.getItem(this.props.itemId);
      } else {
        this.navigateToTop();
      }
    }
  }, {
    key: "componentDidUpdate",
    value: function componentDidUpdate(prevProps) {
      if (!prevProps.entry.isLoaded() && this.props.entry.isLoaded()) {
        this.navigateToTop();
      }
    }
  }, {
    key: "isValid",
    value: function isValid() {
      return this.props.workingEntry.isValid() && this.props.workingQuizEntry.isValid();
    }
  }, {
    key: "renderRegradingAlert",
    value: function renderRegradingAlert() {
      return (0, _emotion.jsx)("div", null, (0, _emotion.jsx)(_uiAlerts.Alert, {
        margin: "small 0",
        transition: "none",
        variant: "info"
      }, (0, _emotion.jsx)("div", {
        css: this.props.styles.alert
      }, _formatMessage["default"].rich('<0>Regrading only applies to completed submissions.</0><1>If all students are affected please wait for all submissions before Regrading.</1>', [function (_ref2) {
        var children = _ref2.children;
        return (0, _emotion.jsx)(_uiText.Text, {
          as: "div",
          weight: "bold",
          key: "0"
        }, children);
      }, function (_ref3) {
        var children = _ref3.children;
        return (0, _emotion.jsx)(_uiText.Text, {
          as: "span",
          key: "1"
        }, children);
      }]))), (0, _emotion.jsx)(_uiAlerts.Alert, {
        margin: "small 0",
        transition: "none",
        variant: "info"
      }, (0, _emotion.jsx)("div", {
        css: this.props.styles.alert
      }, _formatMessage["default"].rich("<0>You are regrading this question.</0>\n              <1>Regrade options for this question type:</1>\n              <2>\n                <3>change the correct answer</3>\n                <4>change points value for the whole question</4>\n                <5>change points values on individual answers (if applicable)</5>\n              </2>", [function (_ref4) {
        var children = _ref4.children;
        return (0, _emotion.jsx)(_uiText.Text, {
          as: "div",
          weight: "bold",
          key: "0"
        }, children);
      }, function (_ref5) {
        var children = _ref5.children;
        return (0, _emotion.jsx)(_uiText.Text, {
          as: "span",
          key: "1"
        }, children);
      }, function (_ref6) {
        var children = _ref6.children;
        return (0, _emotion.jsx)("ul", {
          key: "2"
        }, children);
      }, function (_ref7) {
        var children = _ref7.children;
        return (0, _emotion.jsx)("li", {
          key: "3"
        }, children);
      }, function (_ref8) {
        var children = _ref8.children;
        return (0, _emotion.jsx)("li", {
          key: "4"
        }, children);
      }, function (_ref9) {
        var children = _ref9.children;
        return (0, _emotion.jsx)("li", {
          key: "5"
        }, children);
      }]))));
    }
  }, {
    key: "renderEditableView",
    value: function renderEditableView() {
      var propsForInteraction = (0, _quizCore.propsForInteractionEdit)(this.itemEditProps());
      var interactionType = this.props.entry.getInteractionType().slug;
      var Interaction = (0, _quizCore.componentForItem)(interactionType, _quizCommon.COMPONENT_EDIT);
      return (0, _emotion.jsx)(_quizCore.UndecoratedQuizEntryEdit, this.quizEntryProps(), this.renderRegradingAlert(), (0, _emotion.jsx)("div", {
        css: this.props.styles.container
      }, (0, _emotion.jsx)(Interaction, Object.assign({}, propsForInteraction, {
        itemId: this.props.sessionItem.id,
        overrideEditableForRegrading: true
      }))));
    }
  }, {
    key: "render",
    value: function render() {
      return (0, _emotion.jsx)("div", {
        tabIndex: "-1",
        ref: this.setAlertRef
      }, (0, _emotion.jsx)(_RegradingModal["default"], {
        fromSpeedgrader: true,
        quizId: this.props.quizId,
        handleValidationErrorsFromApi: this.props.handleValidationErrorsFromApi
      }), this.props.quizEntry.id !== '0' ? this.renderEditableView() : (0, _emotion.jsx)(_quizCore.QuizzesSpinner, null));
    }
  }]);
}(_react.Component), (0, _defineProperty2["default"])(_RegradeOverride, "displayName", 'RegradeOverride'), (0, _defineProperty2["default"])(_RegradeOverride, "componentId", "Quizzes".concat(_RegradeOverride.displayName)), (0, _defineProperty2["default"])(_RegradeOverride, "propTypes", {
  appContainer: _quizCore.CustomPropTypes.selectors.isRequired,
  changeQuizEntryPoints: _propTypes["default"].func.isRequired,
  entry: _reactImmutableProptypes["default"].record.isRequired,
  hideError: _propTypes["default"].func.isRequired,
  guid: _propTypes["default"].string.isRequired,
  workingEntry: _reactImmutableProptypes["default"].record.isRequired,
  clearModifications: _propTypes["default"].func.isRequired,
  getItem: _propTypes["default"].func.isRequired,
  getQuizEntry: _propTypes["default"].func.isRequired,
  itemId: _propTypes["default"].string.isRequired,
  onCancel: _propTypes["default"].func.isRequired,
  openModal: _propTypes["default"].func.isRequired,
  quizEntry: _reactImmutableProptypes["default"].record.isRequired,
  workingQuizEntry: _reactImmutableProptypes["default"].record.isRequired,
  quizId: _propTypes["default"].string.isRequired,
  sessionItem: _reactImmutableProptypes["default"].record.isRequired,
  setRegradingPayload: _propTypes["default"].func.isRequired,
  showError: _propTypes["default"].func.isRequired,
  toggleRegradingEditMode: _propTypes["default"].func.isRequired,
  handleValidationErrorsFromApi: _propTypes["default"].func.isRequired,
  validationErrorsFromApi: _propTypes["default"].objectOf(_propTypes["default"].arrayOf(_propTypes["default"].shape({
    type: _propTypes["default"].string,
    text: _propTypes["default"].string
  }))),
  // required by propsForInteractionEdit
  addError: _propTypes["default"].func.isRequired,
  changeItemState: _propTypes["default"].func.isRequired,
  displayPosition: _propTypes["default"].number.isRequired,
  errorsAreShowing: _propTypes["default"].bool,
  interactionFileUpload: _propTypes["default"].func.isRequired,
  oneQuestionAtATime: _propTypes["default"].bool.isRequired,
  partialDeepScoringEnabled: _propTypes["default"].bool,
  partialScoringEnabled: _propTypes["default"].bool,
  parentId: _propTypes["default"].string.isRequired,
  parentType: _propTypes["default"].string.isRequired,
  screenreaderNotification: _propTypes["default"].func.isRequired,
  setOneQuestionAtATime: _propTypes["default"].func.isRequired,
  styles: _propTypes["default"].object
}), (0, _defineProperty2["default"])(_RegradeOverride, "defaultProps", {
  errorsAreShowing: false,
  partialScoringEnabled: false,
  partialDeepScoringEnabled: false,
  validationErrorsFromApi: {}
}), _RegradeOverride)) || _class);
var _default = exports["default"] = RegradeOverride;