UNPKG

@instructure/quiz-grading

Version:

The Quiz React SDK by Instructure Inc.

171 lines (170 loc) • 8.32 kB
"use strict"; var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault"); Object.defineProperty(exports, "__esModule", { value: true }); exports["default"] = exports.SessionItemResultList = 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 _partial = _interopRequireDefault(require("lodash/partial")); var _reactImmutableProptypes = _interopRequireDefault(require("react-immutable-proptypes")); var _emotion = require("@instructure/emotion"); var _uiView = require("@instructure/ui-view"); var _uiIcons = require("@instructure/ui-icons"); var _quizCore = require("@instructure/quiz-core"); var _quizCommon = require("@instructure/quiz-common"); var _SessionItemResultWrapper = _interopRequireDefault(require("../SessionItemResultWrapper")); var _styles = _interopRequireDefault(require("./styles")); var _formatMessage = _interopRequireDefault(require("@instructure/quiz-i18n/es/format-message")); var _dec, _class, _SessionItemResultList; /** @jsx jsx */ 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 SessionItemResultList = exports.SessionItemResultList = (_dec = (0, _quizCommon.withStyleOverrides)(_styles["default"], null), _dec(_class = (_SessionItemResultList = /*#__PURE__*/function (_Component) { function SessionItemResultList() { var _this2; (0, _classCallCheck2["default"])(this, SessionItemResultList); for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) { args[_key] = arguments[_key]; } _this2 = _callSuper(this, SessionItemResultList, [].concat(args)); (0, _defineProperty2["default"])(_this2, "nextStudent", function () { _this2.props.postToParent({ subject: _quizCommon.GRADE_BY_QUESTION_NEXT }); }); (0, _defineProperty2["default"])(_this2, "renderSessionItemResultWrapper", function (sessionItem, shouldRenderTopBorder) { var _this2$props = _this2.props, handleChangePoints = _this2$props.handleChangePoints, handleChangeFeedback = _this2$props.handleChangeFeedback, handleChangeGradeStatus = _this2$props.handleChangeGradeStatus, quizSessionId = _this2$props.quizSessionId, regradingIdentifier = _this2$props.regradingIdentifier, renderUpdateButton = _this2$props.renderUpdateButton; var result = sessionItem.sessionItemResult; var item = sessionItem.getItem(); return (0, _emotion.jsx)(_SessionItemResultWrapper["default"], { handleChangeFeedback: handleChangeFeedback, handleChangeGradeStatus: (0, _partial["default"])(handleChangeGradeStatus, result.id, item.id), handleChangePoints: (0, _partial["default"])(handleChangePoints, result.id, item.id), item: item, key: sessionItem.id, quizSessionId: quizSessionId, isRegrading: sessionItem.id === regradingIdentifier, regradingKey: sessionItem.id, renderUpdateButton: renderUpdateButton, sessionItem: sessionItem, shouldRenderTopBorder: shouldRenderTopBorder }); }); return _this2; } (0, _inherits2["default"])(SessionItemResultList, _Component); return (0, _createClass2["default"])(SessionItemResultList, [{ key: "componentDidMount", value: function componentDidMount() { this.scrollToActiveItem(); } }, { key: "componentDidUpdate", value: function componentDidUpdate(prevProps) { if (prevProps.quizSessionId !== this.props.quizSessionId) { this.scrollToActiveItem(); } } }, { key: "scrollToActiveItem", value: function scrollToActiveItem() { var _this$props = this.props, activeItemId = _this$props.activeItemId, gradeByQuestionEnabled = _this$props.gradeByQuestionEnabled, sessionItems = _this$props.sessionItems; if (gradeByQuestionEnabled && activeItemId) { var sessionItem = sessionItems.find(function (si) { return si.itemRecord.id === activeItemId; }); if (sessionItem) { this.props.scrollToItem(sessionItem.id); } else { var continueText = (0, _emotion.jsx)(_quizCommon.Flex, { alignItems: "center" }, (0, _emotion.jsx)(_uiView.View, { margin: "0 x-small 0 0" }, (0, _formatMessage["default"])('Next Student')), (0, _emotion.jsx)(_uiIcons.IconArrowOpenEndLine, null)); this.props.withConfirm(this.nextStudent, { continueText: continueText, text: (0, _formatMessage["default"])('The active student does not have this question. Please use the Next Student button to proceed.'), title: (0, _formatMessage["default"])('Question Not Available') }); } } } }, { key: "renderItem", value: function renderItem(sessionItem) { if (sessionItem.stimulus) { return (0, _emotion.jsx)(_quizCore.ResultStimulus, { key: sessionItem.id, stimulus: sessionItem.stimulusRecord, renderItem: this.renderSessionItemResultWrapper, sessionItem: sessionItem // This prop is necessary to rerender the child items when we enter regrading mode , regradingIdentifier: this.props.regradingIdentifier }); } return this.renderSessionItemResultWrapper(sessionItem, true); } }, { key: "renderItems", value: function renderItems() { var _this3 = this; return (0, _quizCore.generateDisplayPositions)(this.props.sessionItems).map(function (si) { return _this3.renderItem(si.record); }); } }, { key: "render", value: function render() { return (0, _emotion.jsx)("div", { css: this.props.styles.root }, this.renderItems()); } }]); }(_react.Component), (0, _defineProperty2["default"])(_SessionItemResultList, "displayName", 'SessionItemResultList'), (0, _defineProperty2["default"])(_SessionItemResultList, "componentId", "Quizzes".concat(_SessionItemResultList.displayName)), (0, _defineProperty2["default"])(_SessionItemResultList, "propTypes", { activeItemId: _propTypes["default"].string, gradeByQuestionEnabled: _propTypes["default"].bool, handleChangePoints: _propTypes["default"].func.isRequired, handleChangeFeedback: _propTypes["default"].func.isRequired, handleChangeGradeStatus: _propTypes["default"].func.isRequired, postToParent: _propTypes["default"].func.isRequired, quizSessionId: _propTypes["default"].string.isRequired, regradingIdentifier: _propTypes["default"].string.isRequired, renderUpdateButton: _propTypes["default"].func.isRequired, scrollToItem: _propTypes["default"].func.isRequired, sessionItems: _reactImmutableProptypes["default"].list.isRequired, withConfirm: _propTypes["default"].func.isRequired, styles: _propTypes["default"].object }), (0, _defineProperty2["default"])(_SessionItemResultList, "defaultProps", { activeItemId: null, gradeByQuestionEnabled: false }), _SessionItemResultList)) || _class); var _default = exports["default"] = SessionItemResultList;