UNPKG

@instructure/quiz-grading

Version:

The Quiz React SDK by Instructure Inc.

451 lines (450 loc) • 20.4 kB
/** @jsx jsx */ function _assert_this_initialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; } function _call_super(_this, derived, args) { derived = _get_prototype_of(derived); return _possible_constructor_return(_this, _is_native_reflect_construct() ? Reflect.construct(derived, args || [], _get_prototype_of(_this).constructor) : derived.apply(_this, args)); } function _class_call_check(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } function _defineProperties(target, props) { for(var i = 0; i < props.length; i++){ var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } function _create_class(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; } function _define_property(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; } function _get_prototype_of(o) { _get_prototype_of = Object.setPrototypeOf ? Object.getPrototypeOf : function getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _get_prototype_of(o); } function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _set_prototype_of(subClass, superClass); } function _object_spread(target) { for(var i = 1; i < arguments.length; i++){ var source = arguments[i] != null ? arguments[i] : {}; var ownKeys = Object.keys(source); if (typeof Object.getOwnPropertySymbols === "function") { ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function(sym) { return Object.getOwnPropertyDescriptor(source, sym).enumerable; })); } ownKeys.forEach(function(key) { _define_property(target, key, source[key]); }); } return target; } 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 _object_spread_props(target, source) { source = source != null ? source : {}; 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 _possible_constructor_return(self, call) { if (call && (_type_of(call) === "object" || typeof call === "function")) { return call; } return _assert_this_initialized(self); } function _set_prototype_of(o, p) { _set_prototype_of = Object.setPrototypeOf || function setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _set_prototype_of(o, p); } function _type_of(obj) { "@swc/helpers - typeof"; return obj && typeof Symbol !== "undefined" && obj.constructor === Symbol ? "symbol" : typeof obj; } function _is_native_reflect_construct() { try { var result = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function() {})); } catch (_) {} return (_is_native_reflect_construct = function() { return !!result; })(); } import { Component } from 'react'; import PropTypes from 'prop-types'; import ImmutablePropTypes from 'react-immutable-proptypes'; import { List } from 'immutable'; import { Alert } from '@instructure/ui-alerts'; import { Button } from '@instructure/ui-buttons'; import { ScreenReaderContent } from '@instructure/ui-a11y-content'; import { Text } from '@instructure/ui-text'; import { jsx } from '@instructure/emotion'; import { CustomPropTypes } from '@instructure/quiz-core/common/util/CustomPropTypes'; import { Spinner } from '@instructure/quiz-core/common/components/shared/spinner/Spinner'; import { componentForItem } from '@instructure/quiz-core/common/util/componentForItem'; import { propsForInteractionEdit } from '@instructure/quiz-core/common/util/interactionTypePropsHelper'; import { UndecoratedQuizEntryEdit } from '@instructure/quiz-core/building/components/resources/quizEntry/QuizEntryEdit/presenter'; import { COMPONENT_EDIT, PARENT_TYPE_QUIZ, REGRADE_MODAL } from '@instructure/quiz-common/constants'; import { withStyleOverrides } from '@instructure/quiz-common/util/withStyleOverrides'; import RegradingModal from '../../../RegradingModal'; import generateStyle from './styles'; import generateComponentTheme from './theme'; import t from '@instructure/quiz-i18n/format-message'; var noop = function() {}; var BaseRegradeOverride = /*#__PURE__*/ function(Component) { "use strict"; _inherits(BaseRegradeOverride, Component); function BaseRegradeOverride() { _class_call_check(this, BaseRegradeOverride); var _this; _this = _call_super(this, BaseRegradeOverride, arguments), _define_property(_this, "handleQuizEntryPointsChange", function(points) { var _this_props = _this.props, workingQuizEntry = _this_props.workingQuizEntry, workingEntry = _this_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; _this.props.changeQuizEntryPoints(workingQuizEntry.id, points, newQuizEntryRegrades.toJS()); }), _define_property(_this, "navigateToTop", function() { setTimeout(function() { _this.props.screenreaderNotification(t('Focus moved to top of question. Navigate down to continue.')); if (_this.alertNode) { _this.alertNode.focus(); } }); }), _define_property(_this, "turnOffRegradingEditMode", function() { _this.props.clearModifications('items', _this.props.itemId); _this.props.clearModifications('quizEntries', _this.props.sessionItem.quizEntryId); _this.props.toggleRegradingEditMode(''); _this.props.onCancel(_this.props.sessionItem.id); }), _define_property(_this, "triggerRegradingModal", function(e) { var _this_props = _this.props, displayPosition = _this_props.displayPosition, workingQuizEntry = _this_props.workingQuizEntry, itemId = _this_props.itemId; e && e.preventDefault(); if (_this.isValid()) { _this.props.hideError(_this.props.guid); var _this_props_workingEntry = _this.props.workingEntry, scoringAlgorithm = _this_props_workingEntry.scoringAlgorithm, scoringData = _this_props_workingEntry.scoringData; var pointsPossible = workingQuizEntry.regradeAdjustedPointsPossible(itemId) || workingQuizEntry.pointsPossible; _this.props.setRegradingPayload({ itemId: _this.props.itemId, quizEntryId: _this.props.quizEntry.id, pointsPossible: pointsPossible, scoringAlgorithm: scoringAlgorithm, scoringData: scoringData }); _this.props.openModal(REGRADE_MODAL); } else { var msg = t('Question {displayPosition, number} cannot be saved due to invalid input data.', { displayPosition: displayPosition }); _this.props.screenreaderNotification(msg); _this.props.showError(_this.props.guid); } }), _define_property(_this, "setAlertRef", function(node) { _this.alertNode = node; }), _define_property(_this, "renderActionFooter", function() { return /*#__PURE__*/ jsx("div", null, /*#__PURE__*/ jsx(Button, { margin: "small", onClick: _this.turnOffRegradingEditMode }, t('Cancel')), /*#__PURE__*/ jsx(Button, { margin: "small", color: "primary", onClick: _this.triggerRegradingModal, "data-automation": "sdk-trigger-regrade-button" }, t.rich('Regrade <0>question {position, number}</0>', { 0: function(param) { var children = param.children; return /*#__PURE__*/ jsx(ScreenReaderContent, { key: "0" }, children); }, position: _this.props.quizEntry.position }))); }); return _this; } _create_class(BaseRegradeOverride, [ { key: "quizEntryProps", value: function quizEntryProps() { return _object_spread_props(_object_spread({}, 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: 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 _object_spread_props(_object_spread({}, this.props), { handleQuizEntryPointsChange: this.handleQuizEntryPointsChange, openImportModal: function() {}, parentId: this.props.quizId, parentType: 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 /*#__PURE__*/ jsx("div", null, /*#__PURE__*/ jsx(Alert, { margin: "small 0", transition: "none", variant: "info" }, /*#__PURE__*/ jsx("div", { css: this.props.styles.alert }, t.rich('<0>Regrading only applies to completed submissions.</0><1>If all students are affected please wait for all submissions before Regrading.</1>', [ function(param) { var children = param.children; return /*#__PURE__*/ jsx(Text, { as: "div", weight: "bold", key: "0" }, children); }, function(param) { var children = param.children; return /*#__PURE__*/ jsx(Text, { as: "span", key: "1" }, children); } ]))), /*#__PURE__*/ jsx(Alert, { margin: "small 0", transition: "none", variant: "info" }, /*#__PURE__*/ jsx("div", { css: this.props.styles.alert }, t.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(param) { var children = param.children; return /*#__PURE__*/ jsx(Text, { as: "div", weight: "bold", key: "0" }, children); }, function(param) { var children = param.children; return /*#__PURE__*/ jsx(Text, { as: "span", key: "1" }, children); }, function(param) { var children = param.children; return /*#__PURE__*/ jsx("ul", { key: "2" }, children); }, function(param) { var children = param.children; return /*#__PURE__*/ jsx("li", { key: "3" }, children); }, function(param) { var children = param.children; return /*#__PURE__*/ jsx("li", { key: "4" }, children); }, function(param) { var children = param.children; return /*#__PURE__*/ jsx("li", { key: "5" }, children); } ])))); } }, { key: "renderEditableView", value: function renderEditableView() { var propsForInteraction = propsForInteractionEdit(this.itemEditProps()); var interactionType = this.props.entry.getInteractionType().slug; var Interaction = componentForItem(interactionType, COMPONENT_EDIT); return /*#__PURE__*/ jsx(UndecoratedQuizEntryEdit, this.quizEntryProps(), this.renderRegradingAlert(), /*#__PURE__*/ jsx("div", { css: this.props.styles.container }, /*#__PURE__*/ jsx(Interaction, _object_spread_props(_object_spread({}, propsForInteraction), { itemId: this.props.sessionItem.id, overrideEditableForRegrading: true })))); } }, { key: "render", value: function render() { return /*#__PURE__*/ jsx("div", { tabIndex: "-1", ref: this.setAlertRef }, /*#__PURE__*/ jsx(RegradingModal, { fromSpeedgrader: true, quizId: this.props.quizId, handleValidationErrorsFromApi: this.props.handleValidationErrorsFromApi }), this.props.quizEntry.id !== '0' ? this.renderEditableView() : /*#__PURE__*/ jsx(Spinner, null)); } } ]); return BaseRegradeOverride; }(Component); _define_property(BaseRegradeOverride, "displayName", 'RegradeOverride'); _define_property(BaseRegradeOverride, "componentId", "Quizzes".concat(BaseRegradeOverride.displayName)); _define_property(BaseRegradeOverride, "propTypes", { appContainer: CustomPropTypes.selectors.isRequired, changeQuizEntryPoints: PropTypes.func.isRequired, entry: ImmutablePropTypes.record.isRequired, hideError: PropTypes.func.isRequired, guid: PropTypes.string.isRequired, workingEntry: ImmutablePropTypes.record.isRequired, clearModifications: PropTypes.func.isRequired, getItem: PropTypes.func.isRequired, getQuizEntry: PropTypes.func.isRequired, itemId: PropTypes.string.isRequired, onCancel: PropTypes.func.isRequired, openModal: PropTypes.func.isRequired, quizEntry: ImmutablePropTypes.record.isRequired, workingQuizEntry: ImmutablePropTypes.record.isRequired, quizId: PropTypes.string.isRequired, sessionItem: ImmutablePropTypes.record.isRequired, setRegradingPayload: PropTypes.func.isRequired, showError: PropTypes.func.isRequired, toggleRegradingEditMode: PropTypes.func.isRequired, handleValidationErrorsFromApi: PropTypes.func.isRequired, validationErrorsFromApi: PropTypes.objectOf(PropTypes.arrayOf(PropTypes.shape({ type: PropTypes.string, text: PropTypes.string }))), // required by propsForInteractionEdit addError: PropTypes.func.isRequired, changeItemState: PropTypes.func.isRequired, displayPosition: PropTypes.number.isRequired, errorsAreShowing: PropTypes.bool, interactionFileUpload: PropTypes.func.isRequired, oneQuestionAtATime: PropTypes.bool.isRequired, partialDeepScoringEnabled: PropTypes.bool, partialScoringEnabled: PropTypes.bool, parentId: PropTypes.string.isRequired, parentType: PropTypes.string.isRequired, screenreaderNotification: PropTypes.func.isRequired, setOneQuestionAtATime: PropTypes.func.isRequired, styles: PropTypes.object }); _define_property(BaseRegradeOverride, "defaultProps", { errorsAreShowing: false, partialScoringEnabled: false, partialDeepScoringEnabled: false, validationErrorsFromApi: {} }); export var RegradeOverride = withStyleOverrides(generateStyle, generateComponentTheme)(BaseRegradeOverride); export default RegradeOverride;