@instructure/quiz-core 21.1.1 → 22.0.0

package/lib/moderating/components/resources/ModerateTable/presenter.js

@@ -4,13 +4,14 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.default = exports.ModerateTable = void 0;
-var _createForOfIteratorHelper2 = _interopRequireDefault(require("@babel/runtime/helpers/createForOfIteratorHelper"));
+exports["default"] = exports.ModerateTable = void 0;
 var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
 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 _createSuper2 = _interopRequireDefault(require("@babel/runtime/helpers/createSuper"));
+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"));
@@ -22,47 +23,58 @@ var _uiButtons = require("@instructure/ui-buttons");
 var _uiIcons = require("@instructure/ui-icons");
 var _emotion = require("@instructure/emotion");
 var _formatMessage = _interopRequireDefault(require("@instructure/quiz-i18n/es/format-message"));
-var _index = _interopRequireDefault(require("../ModerateTableRow/index.js"));
-var _index2 = _interopRequireDefault(require("../../../../common/components/shared/IfFeature/index.js"));
-var _index3 = _interopRequireDefault(require("../OutstandingQuizzesModal/index.js"));
-var _index4 = _interopRequireDefault(require("../../sidebar/ModerateTray/index.js"));
-var _Spinner = _interopRequireDefault(require("../../../../common/components/shared/spinner/Spinner.js"));
-var _styles = _interopRequireDefault(require("./styles.js"));
-var _theme = _interopRequireDefault(require("./theme.js"));
-var _index5 = _interopRequireDefault(require("../../sidebar/ResetQuiz/index.js"));
+var _ModerateTableRow = _interopRequireDefault(require("../ModerateTableRow"));
+var _IfFeature = _interopRequireDefault(require("../../../../common/components/shared/IfFeature"));
+var _OutstandingQuizzesModal = _interopRequireDefault(require("../OutstandingQuizzesModal"));
+var _ModerateTray = _interopRequireDefault(require("../../sidebar/ModerateTray"));
+var _Spinner = _interopRequireDefault(require("../../../../common/components/shared/spinner/Spinner"));
+var _styles = _interopRequireDefault(require("./styles"));
+var _theme = _interopRequireDefault(require("./theme"));
+var _ResetQuiz = _interopRequireDefault(require("../../sidebar/ResetQuiz"));
 var _quizCommon = require("@instructure/quiz-common");
 var _lodash = require("lodash");
 var _dec, _class, _ModerateTable;
 /** @jsx jsx */
-var _ref2 = (0, _emotion.jsx)(_quizCommon.Flex.Item, null, (0, _emotion.jsx)(_uiIcons.IconInfoLine, null));
-var _ref4 = (0, _emotion.jsx)(_uiIcons.IconConfigureLine, null);
-var _ref5 = (0, _emotion.jsx)(_Spinner.default, null);
-var _ref6 = (0, _emotion.jsx)(_index5.default, null);
-var ModerateTable = (_dec = (0, _quizCommon.withStyleOverrides)(_styles.default, _theme.default), _dec(_class = (_ModerateTable = /*#__PURE__*/function (_Component) {
-  (0, _inherits2.default)(ModerateTable, _Component);
-  var _super = (0, _createSuper2.default)(ModerateTable);
+function _createForOfIteratorHelper(o, allowArrayLike) { var it = typeof Symbol !== "undefined" && o[Symbol.iterator] || o["@@iterator"]; if (!it) { if (Array.isArray(o) || (it = _unsupportedIterableToArray(o)) || allowArrayLike && o && typeof o.length === "number") { if (it) o = it; var i = 0; var F = function F() {}; return { s: F, n: function n() { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }, e: function e(_e) { throw _e; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var normalCompletion = true, didErr = false, err; return { s: function s() { it = it.call(o); }, n: function n() { var step = it.next(); normalCompletion = step.done; return step; }, e: function e(_e2) { didErr = true; err = _e2; }, f: function f() { try { if (!normalCompletion && it["return"] != null) it["return"](); } finally { if (didErr) throw err; } } }; }
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
+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 ModerateTable = exports.ModerateTable = (_dec = (0, _quizCommon.withStyleOverrides)(_styles["default"], _theme["default"]), _dec(_class = (_ModerateTable = /*#__PURE__*/function (_Component) {
   function ModerateTable() {
-    var _this;
-    (0, _classCallCheck2.default)(this, ModerateTable);
+    var _this2;
+    (0, _classCallCheck2["default"])(this, ModerateTable);
     for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
       args[_key] = arguments[_key];
     }
-    _this = _super.call.apply(_super, [this].concat(args));
-    _this.state = {
+    _this2 = _callSuper(this, ModerateTable, [].concat(args));
+    (0, _defineProperty2["default"])(_this2, "state", {
       displayScoreAsPercentage: true,
       // To support voiceover when the table changes
       moderatePanelIterations: 0,
       selectedStudent: null,
       // To display the spinner while manually submitted quiz sessions are being graded
       isWaiting: false
-    };
-    _this.fetchData = function () {
-      var _this$props = _this.props,
-        getQuizSessions = _this$props.getQuizSessions,
-        quizId = _this$props.quizId,
-        inProgressData = _this$props.inProgressData,
-        tableData = _this$props.tableData;
-      var quizSessionIds = (0, _toConsumableArray2.default)(new Set([].concat((0, _toConsumableArray2.default)(_this.quizSessionIds(inProgressData)), (0, _toConsumableArray2.default)(_this.quizSessionIds(tableData)))));
+    });
+    (0, _defineProperty2["default"])(_this2, "fetchData", function () {
+      var _this2$props = _this2.props,
+        getQuizSessions = _this2$props.getQuizSessions,
+        quizId = _this2$props.quizId,
+        inProgressData = _this2$props.inProgressData,
+        tableData = _this2$props.tableData;
+      var quizSessionIds = (0, _toConsumableArray2["default"])(new Set([].concat((0, _toConsumableArray2["default"])(_this2.quizSessionIds(inProgressData)), (0, _toConsumableArray2["default"])(_this2.quizSessionIds(tableData)))));
 
       // NOTE: The consumer provided no quizSessionIds. Don't fetch
       if (!quizSessionIds.length) return;
@@ -71,22 +83,22 @@ var ModerateTable = (_dec = (0, _quizCommon.withStyleOverrides)(_styles.default,
           ids: chunkedIds
         });
       });
-    };
-    _this.onModerateButtonClick = function (data) {
-      _this.setState({
+    });
+    (0, _defineProperty2["default"])(_this2, "onModerateButtonClick", function (data) {
+      _this2.setState({
         selectedStudent: data.id
       });
-      _this.props.onOpenTray(data);
-      _this.props.openTray(data);
-    };
-    _this.onCloseTray = function () {
-      _this.props.onCloseTray();
-      _this.setState({
-        moderatePanelIterations: _this.state.moderatePanelIterations + 1
+      _this2.props.onOpenTray(data);
+      _this2.props.openTray(data);
+    });
+    (0, _defineProperty2["default"])(_this2, "onCloseTray", function () {
+      _this2.props.onCloseTray();
+      _this2.setState({
+        moderatePanelIterations: _this2.state.moderatePanelIterations + 1
       });
-    };
-    _this.sessionsStillAutograding = function (quizzesToSubmit) {
-      var _iterator = (0, _createForOfIteratorHelper2.default)(_this.props.quizSessionsData),
+    });
+    (0, _defineProperty2["default"])(_this2, "sessionsStillAutograding", function (quizzesToSubmit) {
+      var _iterator = _createForOfIteratorHelper(_this2.props.quizSessionsData),
         _step;
       try {
         for (_iterator.s(); !(_step = _iterator.n()).done;) {
@@ -101,54 +113,55 @@ var ModerateTable = (_dec = (0, _quizCommon.withStyleOverrides)(_styles.default,
         _iterator.f();
       }
       return false;
-    };
-    _this.checkAutogradingStatus = function (submittedQuizSessions) {
-      if (_this.sessionsStillAutograding(submittedQuizSessions)) {
-        _this.pollAutogradingStatus(submittedQuizSessions);
+    });
+    (0, _defineProperty2["default"])(_this2, "checkAutogradingStatus", function (submittedQuizSessions) {
+      if (_this2.sessionsStillAutograding(submittedQuizSessions)) {
+        _this2.pollAutogradingStatus(submittedQuizSessions);
       } else {
-        _this.setState({
+        _this2.setState({
           isWaiting: false
         });
-        _this.props.addSuccess((0, _formatMessage.default)('Manual submission was successful.'));
+        _this2.props.addSuccess((0, _formatMessage["default"])('Manual submission was successful.'));
       }
-    };
-    _this.pollAutogradingStatus = function (submittedQuizSessions) {
-      _this.fetchData();
+    });
+    (0, _defineProperty2["default"])(_this2, "pollAutogradingStatus", function (submittedQuizSessions) {
+      _this2.fetchData();
       setTimeout(function () {
-        _this.checkAutogradingStatus(submittedQuizSessions);
+        _this2.checkAutogradingStatus(submittedQuizSessions);
       }, 1000);
-    };
-    _this.handleSubmissionAndPoll = function (submittedQuizSessions) {
-      _this.setState({
+    });
+    (0, _defineProperty2["default"])(_this2, "handleSubmissionAndPoll", function (submittedQuizSessions) {
+      _this2.setState({
         isWaiting: true
       });
-      _this.pollAutogradingStatus(submittedQuizSessions);
-    };
-    _this.handleScoreToggle = function () {
-      _this.setState(function (prevState) {
+      _this2.pollAutogradingStatus(submittedQuizSessions);
+    });
+    (0, _defineProperty2["default"])(_this2, "handleScoreToggle", function () {
+      _this2.setState(function (prevState) {
         return {
           displayScoreAsPercentage: !prevState.displayScoreAsPercentage
         };
       });
-    };
-    _this.scoreToggleScreenreaderMessage = function () {
-      return _this.state.displayScoreAsPercentage ? (0, _formatMessage.default)('Toggle scores to raw points') : (0, _formatMessage.default)('Toggle scores to percentages');
-    };
-    _this.openModalOnClick = function () {
-      _this.props.openModal(_quizCommon.OUTSTANDING_QUIZZES_MODAL);
-    };
-    return _this;
+    });
+    (0, _defineProperty2["default"])(_this2, "scoreToggleScreenreaderMessage", function () {
+      return _this2.state.displayScoreAsPercentage ? (0, _formatMessage["default"])('Toggle scores to raw points') : (0, _formatMessage["default"])('Toggle scores to percentages');
+    });
+    (0, _defineProperty2["default"])(_this2, "openModalOnClick", function () {
+      _this2.props.openModal(_quizCommon.OUTSTANDING_QUIZZES_MODAL);
+    });
+    return _this2;
   }
-  (0, _createClass2.default)(ModerateTable, [{
+  (0, _inherits2["default"])(ModerateTable, _Component);
+  return (0, _createClass2["default"])(ModerateTable, [{
     key: "componentDidMount",
     value: function componentDidMount() {
       this.props.makeStyles({
         displayScoreAsPercentage: this.state.displayScoreAsPercentage
       });
       this.fetchData();
-      var _this$props2 = this.props,
-        hasSessionTimeLimit = _this$props2.hasSessionTimeLimit,
-        sessionTimeLimitInSeconds = _this$props2.sessionTimeLimitInSeconds;
+      var _this$props = this.props,
+        hasSessionTimeLimit = _this$props.hasSessionTimeLimit,
+        sessionTimeLimitInSeconds = _this$props.sessionTimeLimitInSeconds;
       this.props.sendSessionTimeLimit({
         hasSessionTimeLimit: hasSessionTimeLimit,
         sessionTimeLimitInSeconds: sessionTimeLimitInSeconds
@@ -160,9 +173,9 @@ var ModerateTable = (_dec = (0, _quizCommon.withStyleOverrides)(_styles.default,
       this.props.makeStyles({
         displayScoreAsPercentage: this.state.displayScoreAsPercentage
       });
-      var _this$props3 = this.props,
-        hasSessionTimeLimit = _this$props3.hasSessionTimeLimit,
-        sessionTimeLimitInSeconds = _this$props3.sessionTimeLimitInSeconds;
+      var _this$props2 = this.props,
+        hasSessionTimeLimit = _this$props2.hasSessionTimeLimit,
+        sessionTimeLimitInSeconds = _this$props2.sessionTimeLimitInSeconds;
       if (prevProps.hasSessionTimeLimit !== hasSessionTimeLimit || prevProps.sessionTimeLimitInSeconds !== sessionTimeLimitInSeconds) {
         this.props.sendSessionTimeLimit({
           hasSessionTimeLimit: hasSessionTimeLimit,
@@ -174,8 +187,8 @@ var ModerateTable = (_dec = (0, _quizCommon.withStyleOverrides)(_styles.default,
           selectedStudent: null
         });
       }
-      var quizSessionIds = (0, _toConsumableArray2.default)(new Set([].concat((0, _toConsumableArray2.default)(this.quizSessionIds(this.props.inProgressData)), (0, _toConsumableArray2.default)(this.quizSessionIds(this.props.tableData)))));
-      var prevQuizSessionIds = (0, _toConsumableArray2.default)(new Set([].concat((0, _toConsumableArray2.default)(this.quizSessionIds(prevProps.inProgressData)), (0, _toConsumableArray2.default)(this.quizSessionIds(prevProps.tableData)))));
+      var quizSessionIds = (0, _toConsumableArray2["default"])(new Set([].concat((0, _toConsumableArray2["default"])(this.quizSessionIds(this.props.inProgressData)), (0, _toConsumableArray2["default"])(this.quizSessionIds(this.props.tableData)))));
+      var prevQuizSessionIds = (0, _toConsumableArray2["default"])(new Set([].concat((0, _toConsumableArray2["default"])(this.quizSessionIds(prevProps.inProgressData)), (0, _toConsumableArray2["default"])(this.quizSessionIds(prevProps.tableData)))));
       var skipFetchData = quizSessionIds.every(function (id, index) {
         return id === prevQuizSessionIds[index];
       });
@@ -192,28 +205,30 @@ var ModerateTable = (_dec = (0, _quizCommon.withStyleOverrides)(_styles.default,
     }
   }, {
     key: "renderTableRows",
+    value:
     // =============
     //   RENDERING
     // =============
-    value: function renderTableRows() {
-      var _this2 = this;
-      var _this$props4 = this.props,
-        onModerateLogClick = _this$props4.onModerateLogClick,
-        onResultsLinkClick = _this$props4.onResultsLinkClick,
-        shouldRenderModerateButton = _this$props4.shouldRenderModerateButton;
+
+    function renderTableRows() {
+      var _this3 = this;
+      var _this$props3 = this.props,
+        onModerateLogClick = _this$props3.onModerateLogClick,
+        onResultsLinkClick = _this$props3.onResultsLinkClick,
+        shouldRenderModerateButton = _this$props3.shouldRenderModerateButton;
       return this.props.tableData.map(function (rowData) {
         var id = rowData.id;
-        return (0, _emotion.jsx)(_index.default, {
-          anonymousGrading: _this2.props.anonymousGrading,
+        return (0, _emotion.jsx)(_ModerateTableRow["default"], {
+          anonymousGrading: _this3.props.anonymousGrading,
           onResultsLinkClick: onResultsLinkClick,
-          onAccommodationsClick: _this2.props.onAccommodationsClick,
-          key: "".concat(id, "-").concat(_this2.state.moderatePanelIterations),
-          onModerateButtonClick: _this2.onModerateButtonClick,
+          onAccommodationsClick: _this3.props.onAccommodationsClick,
+          key: "".concat(id, "-").concat(_this3.state.moderatePanelIterations),
+          onModerateButtonClick: _this3.onModerateButtonClick,
           onModerateLogClick: onModerateLogClick,
           rowData: rowData,
           shouldRenderModerateButton: shouldRenderModerateButton,
-          focusTarget: _this2.state.selectedStudent,
-          displayScoreAsPercentage: _this2.state.displayScoreAsPercentage
+          focusTarget: _this3.state.selectedStudent,
+          displayScoreAsPercentage: _this3.state.displayScoreAsPercentage
         });
       });
     }
@@ -224,7 +239,7 @@ var ModerateTable = (_dec = (0, _quizCommon.withStyleOverrides)(_styles.default,
       if (!this.props.quizSessionsData) {
         return 0;
       }
-      var _iterator2 = (0, _createForOfIteratorHelper2.default)(this.props.quizSessionsData),
+      var _iterator2 = _createForOfIteratorHelper(this.props.quizSessionsData),
         _step2;
       try {
         for (_iterator2.s(); !(_step2 = _iterator2.n()).done;) {
@@ -243,24 +258,24 @@ var ModerateTable = (_dec = (0, _quizCommon.withStyleOverrides)(_styles.default,
   }, {
     key: "renderAlertContent",
     value: function renderAlertContent(outstandingAttemptsCount) {
-      var _this3 = this;
-      return (0, _emotion.jsx)("div", null, (0, _emotion.jsx)(_index2.default, {
+      var _this4 = this;
+      return (0, _emotion.jsx)("div", null, (0, _emotion.jsx)(_IfFeature["default"], {
         name: "manual_submission"
-      }, (0, _emotion.jsx)(_quizCommon.Flex, null, _ref2, (0, _emotion.jsx)(_quizCommon.Flex.Item, {
+      }, (0, _emotion.jsx)(_quizCommon.Flex, null, (0, _emotion.jsx)(_quizCommon.Flex.Item, null, (0, _emotion.jsx)(_uiIcons.IconInfoLine, null)), (0, _emotion.jsx)(_quizCommon.Flex.Item, {
         padding: "xx-small"
-      }, _formatMessage.default.rich('This assessment has <0>{count, plural, one {# attempt} other {# attempts}}</0> in progress.', {
+      }, _formatMessage["default"].rich('This assessment has <0>{count, plural, one {# attempt} other {# attempts}}</0> in progress.', {
         count: outstandingAttemptsCount,
-        0: function _(_ref3) {
-          var children = _ref3.children;
+        0: function _(_ref2) {
+          var children = _ref2.children;
           return (0, _emotion.jsx)(_uiLink.Link, {
             key: "0",
-            onClick: _this3.openModalOnClick,
+            onClick: _this4.openModalOnClick,
             "data-automation": "sdk-outstanding-quizzes-modal-open"
           }, children);
         }
-      })))), (0, _emotion.jsx)(_index2.default, {
+      })))), (0, _emotion.jsx)(_IfFeature["default"], {
         name: "manual_submission"
-      }, (0, _emotion.jsx)(_index3.default, {
+      }, (0, _emotion.jsx)(_OutstandingQuizzesModal["default"], {
         quizSessionsData: this.props.quizSessionsData,
         quizSessionIdsAndUsers: this.props.quizSessionIdsAndUsers,
         handleSubmissionAndPoll: this.handleSubmissionAndPoll,
@@ -280,7 +295,7 @@ var ModerateTable = (_dec = (0, _quizCommon.withStyleOverrides)(_styles.default,
         screenReaderLabel: this.scoreToggleScreenreaderMessage(),
         onClick: this.handleScoreToggle,
         "data-automation": "moderation-table-score-toggle"
-      }, _ref4));
+      }, (0, _emotion.jsx)(_uiIcons.IconConfigureLine, null)));
     }
   }, {
     key: "renderTable",
@@ -289,34 +304,34 @@ var ModerateTable = (_dec = (0, _quizCommon.withStyleOverrides)(_styles.default,
       return (0, _emotion.jsx)("div", {
         className: "fs-mask"
       }, outstandingAttemptsCount ? this.renderAlertContent(outstandingAttemptsCount) : null, (0, _emotion.jsx)(_uiTable.Table, {
-        caption: (0, _formatMessage.default)('Moderation Table')
+        caption: (0, _formatMessage["default"])('Moderation Table')
       }, (0, _emotion.jsx)(_uiTable.Table.Head, null, (0, _emotion.jsx)(_uiTable.Table.Row, null, (0, _emotion.jsx)(_uiTable.Table.ColHeader, {
         id: "moderation-table-student"
-      }, (0, _formatMessage.default)('Student')), !this.props.anonymousGrading && (0, _emotion.jsx)(_uiTable.Table.ColHeader, {
+      }, (0, _formatMessage["default"])('Student')), !this.props.anonymousGrading && (0, _emotion.jsx)(_uiTable.Table.ColHeader, {
         id: "moderation-table-attempts"
-      }, (0, _formatMessage.default)('Attempts')), !this.props.anonymousGrading && (0, _emotion.jsx)(_uiTable.Table.ColHeader, {
+      }, (0, _formatMessage["default"])('Attempts')), !this.props.anonymousGrading && (0, _emotion.jsx)(_uiTable.Table.ColHeader, {
         id: "moderation-table-score"
-      }, (0, _formatMessage.default)('Score'), this.renderScoreToggle()), !this.props.anonymousGrading && (0, _emotion.jsx)(_uiTable.Table.ColHeader, {
+      }, (0, _formatMessage["default"])('Score'), this.renderScoreToggle()), !this.props.anonymousGrading && (0, _emotion.jsx)(_uiTable.Table.ColHeader, {
         id: "moderation-table-time"
-      }, (0, _formatMessage.default)('Time')), !this.props.anonymousGrading && (0, _emotion.jsx)(_uiTable.Table.ColHeader, {
+      }, (0, _formatMessage["default"])('Time')), !this.props.anonymousGrading && (0, _emotion.jsx)(_uiTable.Table.ColHeader, {
         id: "moderation-table-log"
-      }, (0, _formatMessage.default)('Log')), this.props.onAccommodationsClick && !this.props.anonymousGrading && (0, _emotion.jsx)(_uiTable.Table.ColHeader, {
+      }, (0, _formatMessage["default"])('Log')), this.props.onAccommodationsClick && !this.props.anonymousGrading && (0, _emotion.jsx)(_uiTable.Table.ColHeader, {
         id: "moderation-table-accommodations"
-      }, (0, _formatMessage.default)({
-        default: 'Accommodations',
+      }, (0, _formatMessage["default"])({
+        "default": 'Accommodations',
         description: 'Support for students with who need extra time or attempts.'
       })), this.props.shouldRenderModerateButton && (0, _emotion.jsx)(_uiTable.Table.ColHeader, {
         id: "moderation-table-moderate"
-      }, (0, _emotion.jsx)(_uiA11yContent.ScreenReaderContent, null, (0, _formatMessage.default)('Moderate'))))), (0, _emotion.jsx)(_uiTable.Table.Body, null, this.renderTableRows())));
+      }, (0, _emotion.jsx)(_uiA11yContent.ScreenReaderContent, null, (0, _formatMessage["default"])('Moderate'))))), (0, _emotion.jsx)(_uiTable.Table.Body, null, this.renderTableRows())));
     }
   }, {
     key: "renderContent",
     value: function renderContent() {
-      var _this$props5 = this.props,
-        isFetching = _this$props5.isFetching,
-        tableData = _this$props5.tableData,
-        emptyMessage = _this$props5.emptyMessage;
-      if (isFetching || this.state.isWaiting) return _ref5;
+      var _this$props4 = this.props,
+        isFetching = _this$props4.isFetching,
+        tableData = _this$props4.tableData,
+        emptyMessage = _this$props4.emptyMessage;
+      if (isFetching || this.state.isWaiting) return (0, _emotion.jsx)(_Spinner["default"], null);
       if (tableData.length) return this.renderTable();
       return (0, _emotion.jsx)("span", {
         css: this.props.styles.emptyText
@@ -329,70 +344,68 @@ var ModerateTable = (_dec = (0, _quizCommon.withStyleOverrides)(_styles.default,
     value: function render() {
       return (0, _emotion.jsx)("div", {
         css: this.props.styles.page
-      }, (0, _emotion.jsx)(_index4.default, {
+      }, (0, _emotion.jsx)(_ModerateTray["default"], {
         onClose: this.onCloseTray,
         onSave: this.props.onSaveTray,
         atteqApplyChangesToCurrentQuizAttemptsEnabled: this.props.atteqApplyChangesToCurrentQuizAttemptsEnabled
-      }, (0, _emotion.jsx)(_quizCommon.Flex.Item, null, !this.props.anonymousGrading && _ref6), this.props.children), this.renderContent());
+      }, (0, _emotion.jsx)(_quizCommon.Flex.Item, null, !this.props.anonymousGrading && (0, _emotion.jsx)(_ResetQuiz["default"], null)), this.props.children), this.renderContent());
     }
   }]);
-  ModerateTable.displayName = "ModerateTable";
-  return ModerateTable;
-}(_react.Component), _ModerateTable.displayName = 'ModerateTable', _ModerateTable.componentId = "Quizzes".concat(_ModerateTable.displayName), _ModerateTable.propTypes = {
-  anonymousGrading: _propTypes.default.bool,
-  children: _propTypes.default.node,
-  emptyMessage: _propTypes.default.string,
-  isFetching: _propTypes.default.bool.isRequired,
-  onCloseTray: _propTypes.default.func,
-  onModerateLogClick: _propTypes.default.func.isRequired,
-  onAccommodationsClick: _propTypes.default.func,
-  onOpenTray: _propTypes.default.func,
-  onResultsLinkClick: _propTypes.default.func,
-  openTray: _propTypes.default.func.isRequired,
-  onSaveTray: _propTypes.default.func.isRequired,
-  sessionTimeLimitInSeconds: _propTypes.default.number,
-  hasSessionTimeLimit: _propTypes.default.bool,
-  sendSessionTimeLimit: _propTypes.default.func,
-  shouldRenderModerateButton: _propTypes.default.bool,
-  openModal: _propTypes.default.func.isRequired,
-  quizSessionIdsAndUsers: _propTypes.default.arrayOf(_propTypes.default.shape({
-    id: _propTypes.default.string,
-    name: _propTypes.default.string
+}(_react.Component), (0, _defineProperty2["default"])(_ModerateTable, "displayName", 'ModerateTable'), (0, _defineProperty2["default"])(_ModerateTable, "componentId", "Quizzes".concat(_ModerateTable.displayName)), (0, _defineProperty2["default"])(_ModerateTable, "propTypes", {
+  anonymousGrading: _propTypes["default"].bool,
+  children: _propTypes["default"].node,
+  emptyMessage: _propTypes["default"].string,
+  isFetching: _propTypes["default"].bool.isRequired,
+  onCloseTray: _propTypes["default"].func,
+  onModerateLogClick: _propTypes["default"].func.isRequired,
+  onAccommodationsClick: _propTypes["default"].func,
+  onOpenTray: _propTypes["default"].func,
+  onResultsLinkClick: _propTypes["default"].func,
+  openTray: _propTypes["default"].func.isRequired,
+  onSaveTray: _propTypes["default"].func.isRequired,
+  sessionTimeLimitInSeconds: _propTypes["default"].number,
+  hasSessionTimeLimit: _propTypes["default"].bool,
+  sendSessionTimeLimit: _propTypes["default"].func,
+  shouldRenderModerateButton: _propTypes["default"].bool,
+  openModal: _propTypes["default"].func.isRequired,
+  quizSessionIdsAndUsers: _propTypes["default"].arrayOf(_propTypes["default"].shape({
+    id: _propTypes["default"].string,
+    name: _propTypes["default"].string
   })),
-  quizSessionsData: _reactImmutableProptypes.default.listOf(_reactImmutableProptypes.default.record).isRequired,
-  afterManualSubmit: _propTypes.default.func,
-  inProgressData: _propTypes.default.arrayOf(_propTypes.default.shape({
-    avatar: _propTypes.default.string,
-    id: _propTypes.default.string.isRequired,
-    name: _propTypes.default.string.isRequired,
-    quizSessionIds: _propTypes.default.arrayOf(_propTypes.default.string).isRequired,
-    maxAttempts: _propTypes.default.number,
-    accommodations: _propTypes.default.arrayOf(_propTypes.default.shape({
-      name: _propTypes.default.string.isRequired,
-      value: _propTypes.default.string.isRequired
+  quizSessionsData: _reactImmutableProptypes["default"].listOf(_reactImmutableProptypes["default"].record).isRequired,
+  afterManualSubmit: _propTypes["default"].func,
+  inProgressData: _propTypes["default"].arrayOf(_propTypes["default"].shape({
+    avatar: _propTypes["default"].string,
+    id: _propTypes["default"].string.isRequired,
+    name: _propTypes["default"].string.isRequired,
+    quizSessionIds: _propTypes["default"].arrayOf(_propTypes["default"].string).isRequired,
+    maxAttempts: _propTypes["default"].number,
+    accommodations: _propTypes["default"].arrayOf(_propTypes["default"].shape({
+      name: _propTypes["default"].string.isRequired,
+      value: _propTypes["default"].string.isRequired
     }))
   })).isRequired,
-  tableData: _propTypes.default.arrayOf(_propTypes.default.shape({
-    avatar: _propTypes.default.string,
-    id: _propTypes.default.string.isRequired,
-    name: _propTypes.default.string.isRequired,
-    quizSessionIds: _propTypes.default.arrayOf(_propTypes.default.string).isRequired,
-    maxAttempts: _propTypes.default.number,
-    accommodations: _propTypes.default.arrayOf(_propTypes.default.shape({
-      name: _propTypes.default.string.isRequired,
-      value: _propTypes.default.string.isRequired
+  tableData: _propTypes["default"].arrayOf(_propTypes["default"].shape({
+    avatar: _propTypes["default"].string,
+    id: _propTypes["default"].string.isRequired,
+    name: _propTypes["default"].string.isRequired,
+    quizSessionIds: _propTypes["default"].arrayOf(_propTypes["default"].string).isRequired,
+    maxAttempts: _propTypes["default"].number,
+    accommodations: _propTypes["default"].arrayOf(_propTypes["default"].shape({
+      name: _propTypes["default"].string.isRequired,
+      value: _propTypes["default"].string.isRequired
     }))
   })).isRequired,
-  quizId: _propTypes.default.string.isRequired,
-  getQuizSessions: _propTypes.default.func.isRequired,
-  addSuccess: _propTypes.default.func.isRequired,
-  styles: _propTypes.default.object,
-  makeStyles: _propTypes.default.func,
-  atteqApplyChangesToCurrentQuizAttemptsEnabled: _propTypes.default.bool.isRequired
-}, _ModerateTable.defaultProps = {
+  quizId: _propTypes["default"].string.isRequired,
+  getQuizSessions: _propTypes["default"].func.isRequired,
+  addSuccess: _propTypes["default"].func.isRequired,
+  styles: _propTypes["default"].object,
+  makeStyles: _propTypes["default"].func,
+  atteqApplyChangesToCurrentQuizAttemptsEnabled: _propTypes["default"].bool.isRequired
+}), (0, _defineProperty2["default"])(_ModerateTable, "defaultProps", {
   anonymousGrading: false,
   children: void 0,
-  emptyMessage: (0, _formatMessage.default)('There is no moderation information to display yet.'),
+  emptyMessage: (0, _formatMessage["default"])('There is no moderation information to display yet.'),
   onCloseTray: Function.prototype,
   onOpenTray: Function.prototype,
   sendSessionTimeLimit: Function.prototype,
@@ -404,7 +417,5 @@ var ModerateTable = (_dec = (0, _quizCommon.withStyleOverrides)(_styles.default,
   onResultsLinkClick: void 0,
   quizSessionIdsAndUsers: [],
   afterManualSubmit: Function.prototype
-}, _ModerateTable)) || _class);
-exports.ModerateTable = ModerateTable;
-var _default = ModerateTable;
-exports.default = _default;
+}), _ModerateTable)) || _class);
+var _default = exports["default"] = ModerateTable;

package/lib/moderating/components/resources/ModerateTable/styles.js

@@ -4,8 +4,10 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.default = void 0;
-var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
+exports["default"] = void 0;
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+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; }
 var generateStyle = function generateStyle(componentTheme, props, state) {
   return {
     emptyText: {
@@ -17,7 +19,7 @@ var generateStyle = function generateStyle(componentTheme, props, state) {
       flex: '1',
       backgroundColor: componentTheme.pageBackgroundColor
     },
-    scoreToggleWrapper: (0, _objectSpread2.default)({
+    scoreToggleWrapper: _objectSpread({
       display: 'inline-block',
       transition: 'transform 0.3s'
     }, !state.displayScoreAsPercentage && {
@@ -25,5 +27,4 @@ var generateStyle = function generateStyle(componentTheme, props, state) {
     })
   };
 };
-var _default = generateStyle;
-exports.default = _default;
+var _default = exports["default"] = generateStyle;

package/lib/moderating/components/resources/ModerateTable/theme.js

@@ -3,14 +3,13 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.default = void 0;
+exports["default"] = void 0;
 var generateComponentTheme = function generateComponentTheme(_ref) {
   var spacing = _ref.spacing,
     colors = _ref.colors;
   return {
     emptyTextMargin: spacing.small,
-    pageBackgroundColor: colors.white
+    pageBackgroundColor: colors.contrasts.white1010
   };
 };
-var _default = generateComponentTheme;
-exports.default = _default;
+var _default = exports["default"] = generateComponentTheme;

package/lib/moderating/components/resources/ModerateTableRow/ModerateTableRow.examples.js

@@ -4,29 +4,29 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.default = void 0;
+exports["default"] = void 0;
 var _immutable = require("immutable");
-var _QuizSession = _interopRequireDefault(require("../../../../common/records/QuizSession.js"));
-var _QuizSessionResult = _interopRequireDefault(require("../../../../common/records/QuizSessionResult.js"));
-var failedResult = new _QuizSessionResult.default((0, _immutable.fromJS)({
+var _QuizSession = _interopRequireDefault(require("../../../../common/records/QuizSession"));
+var _QuizSessionResult = _interopRequireDefault(require("../../../../common/records/QuizSessionResult"));
+var failedResult = new _QuizSessionResult["default"]((0, _immutable.fromJS)({
   status: 'autograding_failed',
   score: 42,
   pointsPossible: 100
 }));
-var errorSession = new _QuizSession.default((0, _immutable.fromJS)({
+var errorSession = new _QuizSession["default"]((0, _immutable.fromJS)({
   id: '1',
   status: 'graded'
 }));
 errorSession.findAuthoritativeResult = function () {
   return failedResult;
 };
-var quizSessions = (0, _immutable.List)([errorSession, new _QuizSession.default((0, _immutable.fromJS)({
+var quizSessions = (0, _immutable.List)([errorSession, new _QuizSession["default"]((0, _immutable.fromJS)({
   id: '2',
   status: 'graded'
-})), new _QuizSession.default((0, _immutable.fromJS)({
+})), new _QuizSession["default"]((0, _immutable.fromJS)({
   id: '3'
 }))]);
-var _default = {
+var _default = exports["default"] = {
   propValues: {
     onAccommodationsClick: [null, Function.prototype],
     shouldRenderModerateButton: [true, false],
@@ -75,5 +75,4 @@ var _default = {
       quizSessions: quizSessions
     };
   }
-};
-exports.default = _default;
+};