@instructure/quiz-core 17.62.1-rc.0 → 17.62.1-rc.2

package/lib/banks/api/copyingBanksPoller.js

@@ -0,0 +1,116 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.addToPolling = void 0;
+
+var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
+
+var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
+
+var _formatMessage = _interopRequireDefault(require("@instructure/quiz-i18n/es/format-message"));
+
+var _alerts = require("../../common/actions/alerts.js");
+
+var _banks = require("./banks.js");
+
+var pollingBanks = [];
+var currentlyPolling = false;
+
+var addToPolling = function addToPolling(bankId, bankTitle) {
+  var getSpecificBanksFn = arguments.length > 2 && arguments[2] !== void 0 ? arguments[2] : _banks.getSpecificBanks;
+  return function (dispatch) {
+    pollingBanks.push({
+      id: bankId,
+      title: bankTitle
+    });
+
+    if (!currentlyPolling) {
+      currentlyPolling = true;
+      handlePollingBanks(dispatch, getSpecificBanksFn);
+    }
+  };
+};
+
+exports.addToPolling = addToPolling;
+
+var handlePollingBanks = /*#__PURE__*/function () {
+  var _ref = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee(dispatch) {
+    var getSpecificBanksFn,
+        updatedPollingBanks,
+        updatedPollingBankIds,
+        finishedCopying,
+        finishedCopyingIds,
+        _args = arguments;
+    return _regenerator.default.wrap(function _callee$(_context) {
+      while (1) {
+        switch (_context.prev = _context.next) {
+          case 0:
+            getSpecificBanksFn = _args.length > 1 && _args[1] !== void 0 ? _args[1] : _banks.getSpecificBanks;
+            _context.next = 3;
+            return getSpecificBanksFn(pollingBanks.map(function (bank) {
+              return bank.id;
+            }))(dispatch);
+
+          case 3:
+            updatedPollingBanks = _context.sent;
+            updatedPollingBankIds = updatedPollingBanks.map(function (updatedBank) {
+              return updatedBank.id;
+            }); // banks that now have status 'waiting' have finished successfully
+            // banks that are no longer in the updated list but were in the previous list have
+            // failed to copy and therefore were archived
+
+            finishedCopying = updatedPollingBanks.filter(function (bank) {
+              return bank.status === 'waiting';
+            }).concat(pollingBanks.filter(function (prevBank) {
+              return !updatedPollingBankIds.includes(prevBank.id);
+            }));
+            finishedCopying.forEach(function (bank) {
+              var bankInfo = updatedPollingBanks.find(function (info) {
+                return info.id == bank.id;
+              });
+
+              if ((bankInfo === null || bankInfo === void 0 ? void 0 : bankInfo.status) === 'waiting') {
+                dispatch((0, _alerts.addSuccess)((0, _formatMessage.default)('Created "{name}" successfully! Duplicate can be seen in \'All Banks\' filter.', {
+                  name: bank.title
+                })));
+              } else if (!bankInfo) {
+                dispatch((0, _alerts.addError)((0, _formatMessage.default)('Failed to create "{name}". Please try again.', {
+                  name: bank.title
+                })));
+              }
+            });
+            finishedCopyingIds = finishedCopying.map(function (bank) {
+              return bank.id;
+            });
+            removeFinishedCopies(finishedCopyingIds);
+
+            if (pollingBanks.length > 0) {
+              setTimeout(function () {
+                handlePollingBanks(dispatch);
+              }, 3000);
+            } else {
+              currentlyPolling = false;
+            }
+
+          case 10:
+          case "end":
+            return _context.stop();
+        }
+      }
+    }, _callee);
+  }));
+
+  return function handlePollingBanks(_x) {
+    return _ref.apply(this, arguments);
+  };
+}();
+
+var removeFinishedCopies = function removeFinishedCopies(finishedCopyingIds) {
+  pollingBanks = pollingBanks.filter(function (bank) {
+    return !finishedCopyingIds.includes(bank.id);
+  });
+};

package/lib/banks/components/Banks/presenter.js

@@ -211,8 +211,7 @@ var Banks = (_dec = (0, _uiThemeable.themeable)(_theme.default, styles), _dec(_c
         minChars: _this.props.minChars,
         navigateToBank: _this.props.navigateToBank,
         onShare: _this.props.onShare,
-        recordIds: recordIds,
-        redirectAllBanks: _this.handleBankCreated
+        recordIds: recordIds
       });
     };
 

package/lib/banks/components/BanksList/index.js

@@ -24,6 +24,8 @@ var _featureCheck = require("../../../common/util/featureCheck.js");
 
 var _alerts = require("../../../common/actions/alerts.js");
 
+var _copyingBanksPoller = require("../../api/copyingBanksPoller.js");
+
 function mapStateToProps(state, props) {
   return {
     appContainer: state.getIn(['ui', 'appContainer']),
@@ -39,7 +41,8 @@ var _default = (0, _reactRedux.connect)(mapStateToProps, {
   deleteBank: _banks.deleteBank,
   withConfirm: _modal.withConfirm,
   createBankCloneJob: _banks.createBankCloneJob,
-  addInfo: _alerts.addInfo
+  addInfo: _alerts.addInfo,
+  addToPolling: _copyingBanksPoller.addToPolling
 })(_presenter.default);
 
 exports.default = _default;

package/lib/banks/components/BanksList/presenter.js

@@ -80,7 +80,7 @@ var styles = {
   'deletePreface': 'dgJJi_eTBd'
 };
 
-var _ref3 = /*#__PURE__*/_react.default.createElement(_uiSpinner.Spinner, {
+var _ref4 = /*#__PURE__*/_react.default.createElement(_uiSpinner.Spinner, {
   renderTitle: "Loading",
   size: "x-small"
 });
@@ -180,18 +180,41 @@ var BanksList = (_dec = (0, _uiThemeable.themeable)(_theme.default, styles), _de
 
     _this.openDuplicateBankModal = function (bank) {
       return function () {
-        _this.createCloneJob = function () {
-          _this.props.createBankCloneJob(bank.id, _this.props.currentUser.uuid);
+        var createCloneJob = /*#__PURE__*/function () {
+          var _ref3 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee2() {
+            var cloneJob;
+            return _regenerator.default.wrap(function _callee2$(_context2) {
+              while (1) {
+                switch (_context2.prev = _context2.next) {
+                  case 0:
+                    _context2.next = 2;
+                    return _this.props.createBankCloneJob(bank.id, _this.props.currentUser.uuid);
+
+                  case 2:
+                    cloneJob = _context2.sent;
+
+                    _this.props.addToPolling(cloneJob.cloned_bank_id, (0, _formatMessage.default)('{name} Copy', {
+                      name: bank.title
+                    }));
+
+                    _this.props.addInfo((0, _formatMessage.default)('Creating "{name} Copy". Duplicate will appear in \'All Banks\'  filter.', {
+                      name: bank.title
+                    }));
+
+                  case 5:
+                  case "end":
+                    return _context2.stop();
+                }
+              }
+            }, _callee2);
+          }));
 
-          _this.props.addInfo( /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, (0, _formatMessage.default)('Creating "{name} Copy". Duplicate will appear in ', {
-            name: bank.title
-          }), /*#__PURE__*/_react.default.createElement(_uiLink.Link, {
-            key: bank.id,
-            onClick: _this.props.redirectAllBanks
-          }, (0, _formatMessage.default)('\'All Banks\'')), (0, _formatMessage.default)(' filter.')));
-        };
+          return function createCloneJob() {
+            return _ref3.apply(this, arguments);
+          };
+        }();
 
-        _this.props.withConfirm((0, _partial.default)(_this.createCloneJob), {
+        _this.props.withConfirm((0, _partial.default)(createCloneJob), {
           text: (0, _formatMessage.default)('Are you sure you want to duplicate this item bank?'),
           title: (0, _formatMessage.default)('Duplicate Bank'),
           continueText: (0, _formatMessage.default)('Duplicate'),
@@ -330,7 +353,7 @@ var BanksList = (_dec = (0, _uiThemeable.themeable)(_theme.default, styles), _de
       if (bank.status == 'copying') {
         return /*#__PURE__*/_react.default.createElement("div", {
           className: styles.bankOptions
-        }, _ref3);
+        }, _ref4);
       } else {
         return /*#__PURE__*/_react.default.createElement("div", {
           className: styles.bankOptions
@@ -430,6 +453,7 @@ var BanksList = (_dec = (0, _uiThemeable.themeable)(_theme.default, styles), _de
   return BanksList;
 }((0, _quizCommon.withI18nSupport)(_react.Component)), _class2.propTypes = {
   addInfo: _propTypes.default.func.isRequired,
+  addToPolling: _propTypes.default.func.isRequired,
   appContainer: _CustomPropTypes.default.selectors.isRequired,
   banks: _reactImmutableProptypes.default.list.isRequired,
   createBankCloneJob: _propTypes.default.func.isRequired,
@@ -452,7 +476,6 @@ var BanksList = (_dec = (0, _uiThemeable.themeable)(_theme.default, styles), _de
   navigateToBank: _propTypes.default.func.isRequired,
   onShare: _propTypes.default.func,
   openModal: _propTypes.default.func.isRequired,
-  redirectAllBanks: _propTypes.default.func.isRequired,
   withConfirm: _propTypes.default.func.isRequired,
   locale: _propTypes.default.string,
   timezone: _propTypes.default.string

package/lib/reporting/components/resources/NewQuizAndItemAnalysis/AnswerSummaryTable/ChoiceInfo/index.js

@@ -0,0 +1,11 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _presenter = require("./presenter.js");
+
+var _default = _presenter.ChoiceInfo;
+exports.default = _default;

package/lib/reporting/components/resources/NewQuizAndItemAnalysis/AnswerSummaryTable/ChoiceInfo/presenter.js

@@ -0,0 +1,110 @@
+"use strict";
+
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.ChoiceInfo = void 0;
+
+var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
+
+var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
+
+var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
+
+var _createSuper2 = _interopRequireDefault(require("@babel/runtime/helpers/createSuper"));
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _formatMessage = _interopRequireDefault(require("@instructure/quiz-i18n/es/format-message"));
+
+var _uiTable = require("@instructure/ui-table");
+
+var _index = _interopRequireDefault(require("../Row/index.js"));
+
+var _propTypes = _interopRequireDefault(require("prop-types"));
+
+var _ref = /*#__PURE__*/_react.default.createElement(_uiTable.Table.ColHeader, {
+  width: "46px"
+});
+
+var ChoiceInfo = /*#__PURE__*/function (_Component) {
+  (0, _inherits2.default)(ChoiceInfo, _Component);
+
+  var _super = (0, _createSuper2.default)(ChoiceInfo);
+
+  function ChoiceInfo() {
+    var _this;
+
+    (0, _classCallCheck2.default)(this, ChoiceInfo);
+
+    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.renderRow = function (choice, choiceIndex) {
+      return /*#__PURE__*/_react.default.createElement(_index.default, {
+        key: choiceIndex,
+        choice: choice,
+        choiceIndex: choiceIndex
+      });
+    };
+
+    _this.renderNoAnswer = function (payload, choiceIndex) {
+      var asChoice = {
+        body: (0, _formatMessage.default)('(No answer)'),
+        percentage: payload.percentage,
+        correct: false,
+        count: payload.count
+      };
+      return /*#__PURE__*/_react.default.createElement(_index.default, {
+        key: choiceIndex,
+        choice: asChoice,
+        choiceIndex: choiceIndex
+      });
+    };
+
+    return _this;
+  }
+
+  (0, _createClass2.default)(ChoiceInfo, [{
+    key: "render",
+    value: function render() {
+      var _this$props = this.props,
+          choices = _this$props.choices,
+          noAnswer = _this$props.noAnswer;
+      var numberOfChoices = choices.length;
+      return /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement(_uiTable.Table, {
+        caption: (0, _formatMessage.default)('Answer Frequency Summary')
+      }, /*#__PURE__*/_react.default.createElement(_uiTable.Table.Head, null, /*#__PURE__*/_react.default.createElement(_uiTable.Table.Row, null, _ref, /*#__PURE__*/_react.default.createElement(_uiTable.Table.ColHeader, {
+        height: "47px"
+      }, (0, _formatMessage.default)('Answer')), /*#__PURE__*/_react.default.createElement(_uiTable.Table.ColHeader, {
+        height: "47px"
+      }, (0, _formatMessage.default)('Respondents')), /*#__PURE__*/_react.default.createElement(_uiTable.Table.ColHeader, {
+        height: "47px",
+        textAlign: "center"
+      }, (0, _formatMessage.default)('%')))), /*#__PURE__*/_react.default.createElement(_uiTable.Table.Body, null, choices.map(this.renderRow), this.renderNoAnswer(noAnswer, numberOfChoices))));
+    }
+  }]);
+  ChoiceInfo.displayName = "ChoiceInfo";
+  return ChoiceInfo;
+}(_react.Component);
+
+exports.ChoiceInfo = ChoiceInfo;
+ChoiceInfo.propTypes = {
+  choices: _propTypes.default.arrayOf(_propTypes.default.shape({
+    body: _propTypes.default.string,
+    correct: _propTypes.default.bool,
+    count: _propTypes.default.number,
+    percentage: _propTypes.default.number
+  })),
+  noAnswer: _propTypes.default.shape({
+    count: _propTypes.default.number,
+    percentage: _propTypes.default.number
+  })
+}.isRequired;

package/lib/reporting/components/resources/NewQuizAndItemAnalysis/AnswerSummaryTable/Row/index.js

@@ -0,0 +1,11 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _presenter = require("./presenter.js");
+
+var _default = _presenter.Row;
+exports.default = _default;

package/lib/reporting/components/resources/NewQuizAndItemAnalysis/AnswerSummaryTable/Row/presenter.js

@@ -0,0 +1,132 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.Row = void 0;
+
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+
+var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
+
+var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
+
+var _createSuper2 = _interopRequireDefault(require("@babel/runtime/helpers/createSuper"));
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _uiTable = require("@instructure/ui-table");
+
+var _uiThemeable = require("@instructure/ui-themeable");
+
+var _theme = _interopRequireDefault(require("../theme.js"));
+
+var _propTypes = _interopRequireDefault(require("prop-types"));
+
+var _uiIcons = require("@instructure/ui-icons");
+
+var _classnames = _interopRequireDefault(require("classnames"));
+
+var _quizInteractions = require("@instructure/quiz-interactions");
+
+var _dec, _class, _class2, _temp;
+
+var styles = {
+  componentId: 'fvXKN',
+  template: function template(theme) {
+    return "\n\n.fvXKN_rMrG{display:flex;flex-basis:100%;flex-direction:column;padding-bottom:".concat(theme.tableBottomPadding || 'inherit', "}\n\n.fvXKN_cvRx{align-items:center;display:flex;height:48px;justify-content:center;width:46px}\n\n.fvXKN_EKAb{background-color:").concat(theme.colorGreen || 'inherit', ";border-radius:4px 0 0 4px}\n\n.fvXKN_EKAb svg{filter:invert(100%) sepia(100%) saturate(0%) hue-rotate(288deg) brightness(102%) contrast(102%)}\n\n.fvXKN_tnta{border-color:").concat(theme.colorGreen || 'inherit', ";border-style:solid;border-width:2px 0;padding:").concat(theme.cellPadding || 'inherit', "}\n\n.fvXKN_fvqY{border-radius:0 4px 4px 0;border-width:2px 2px 2px 0}");
+  },
+  'tableWrapper': 'fvXKN_rMrG',
+  'iconWrapper': 'fvXKN_cvRx',
+  'iconCorrect': 'fvXKN_EKAb',
+  'correctRowBorder': 'fvXKN_tnta',
+  'correctRowBorderRadius': 'fvXKN_fvqY'
+};
+
+var _ref = /*#__PURE__*/_react.default.createElement(_uiIcons.IconCheckSolid, null);
+
+var _ref2 = /*#__PURE__*/_react.default.createElement(_uiIcons.IconXSolid, null);
+
+var Row = (_dec = (0, _uiThemeable.themeable)(_theme.default, styles), _dec(_class = (_temp = _class2 = /*#__PURE__*/function (_Component) {
+  (0, _inherits2.default)(Row, _Component);
+
+  var _super = (0, _createSuper2.default)(Row);
+
+  function Row() {
+    var _this;
+
+    (0, _classCallCheck2.default)(this, Row);
+
+    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.renderIcon = function (correct) {
+      var className = (0, _classnames.default)(styles.iconWrapper, (0, _defineProperty2.default)({}, styles.iconCorrect, correct));
+      return /*#__PURE__*/_react.default.createElement("div", {
+        className: className
+      }, correct ? _ref : _ref2);
+    };
+
+    _this.renderMiddleCell = function (correct, content) {
+      var className = (0, _classnames.default)((0, _defineProperty2.default)({}, styles.correctRowBorder, correct));
+      return /*#__PURE__*/_react.default.createElement("div", {
+        className: className
+      }, content);
+    };
+
+    _this.renderLastCell = function (correct, content) {
+      var _classNames3;
+
+      var className = (0, _classnames.default)((_classNames3 = {}, (0, _defineProperty2.default)(_classNames3, styles.correctRowBorder, correct), (0, _defineProperty2.default)(_classNames3, styles.correctRowBorderRadius, correct), _classNames3));
+      return /*#__PURE__*/_react.default.createElement("div", {
+        className: className
+      }, content);
+    };
+
+    _this.render = function () {
+      var correct = _this.props.choice.correct;
+      var cellPadding = correct ? '0' : _this.theme.cellPadding;
+      return /*#__PURE__*/_react.default.createElement(_uiTable.Table.Row, {
+        key: _this.props.choiceIndex
+      }, /*#__PURE__*/_react.default.createElement(_uiTable.Table.Cell, {
+        theme: {
+          padding: '0px'
+        }
+      }, _this.renderIcon(correct)), /*#__PURE__*/_react.default.createElement(_uiTable.Table.RowHeader, {
+        theme: {
+          padding: cellPadding
+        },
+        className: styles.tableBody
+      }, _this.renderMiddleCell(correct, (0, _quizInteractions.extractTextFromHtml)(_this.props.choice.body))), /*#__PURE__*/_react.default.createElement(_uiTable.Table.Cell, {
+        theme: {
+          padding: cellPadding
+        }
+      }, _this.renderMiddleCell(correct, _this.props.choice.count)), /*#__PURE__*/_react.default.createElement(_uiTable.Table.Cell, {
+        theme: {
+          padding: cellPadding
+        },
+        textAlign: "center"
+      }, _this.renderLastCell(correct, "".concat(_this.props.choice.percentage, "%"))));
+    };
+
+    return _this;
+  }
+
+  return Row;
+}(_react.Component), _class2.propTypes = {
+  choice: _propTypes.default.shape({
+    body: _propTypes.default.string,
+    correct: _propTypes.default.bool,
+    count: _propTypes.default.number,
+    percentage: _propTypes.default.number
+  }),
+  choiceIndex: _propTypes.default.number
+}.isRequired, _temp)) || _class);
+exports.Row = Row;

package/lib/reporting/components/resources/NewQuizAndItemAnalysis/AnswerSummaryTable/index.js

@@ -0,0 +1,11 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _presenter = require("./presenter.js");
+
+var _default = _presenter.AnswerSummaryTable;
+exports.default = _default;

package/lib/reporting/components/resources/NewQuizAndItemAnalysis/AnswerSummaryTable/presenter.js

@@ -0,0 +1,83 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.AnswerSummaryTable = void 0;
+
+var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
+
+var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
+
+var _createSuper2 = _interopRequireDefault(require("@babel/runtime/helpers/createSuper"));
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _uiHeading = require("@instructure/ui-heading");
+
+var _uiThemeable = require("@instructure/ui-themeable");
+
+var _theme = _interopRequireDefault(require("./theme.js"));
+
+var _presenter = require("./ChoiceInfo/presenter.js");
+
+var _formatMessage = _interopRequireDefault(require("@instructure/quiz-i18n/es/format-message"));
+
+var _propTypes = require("../propTypes.js");
+
+var _dec, _class, _class2, _temp;
+
+var styles = {
+  componentId: 'fvXKN',
+  template: function template(theme) {
+    return "\n\n.fvXKN_rMrG{display:flex;flex-basis:100%;flex-direction:column;padding-bottom:".concat(theme.tableBottomPadding || 'inherit', "}\n\n.fvXKN_cvRx{align-items:center;display:flex;height:48px;justify-content:center;width:46px}\n\n.fvXKN_EKAb{background-color:").concat(theme.colorGreen || 'inherit', ";border-radius:4px 0 0 4px}\n\n.fvXKN_EKAb svg{filter:invert(100%) sepia(100%) saturate(0%) hue-rotate(288deg) brightness(102%) contrast(102%)}\n\n.fvXKN_tnta{border-color:").concat(theme.colorGreen || 'inherit', ";border-style:solid;border-width:2px 0;padding:").concat(theme.cellPadding || 'inherit', "}\n\n.fvXKN_fvqY{border-radius:0 4px 4px 0;border-width:2px 2px 2px 0}");
+  },
+  'tableWrapper': 'fvXKN_rMrG',
+  'iconWrapper': 'fvXKN_cvRx',
+  'iconCorrect': 'fvXKN_EKAb',
+  'correctRowBorder': 'fvXKN_tnta',
+  'correctRowBorderRadius': 'fvXKN_fvqY'
+};
+var AnswerSummaryTable = (_dec = (0, _uiThemeable.themeable)(_theme.default, styles), _dec(_class = (_temp = _class2 = /*#__PURE__*/function (_Component) {
+  (0, _inherits2.default)(AnswerSummaryTable, _Component);
+
+  var _super = (0, _createSuper2.default)(AnswerSummaryTable);
+
+  function AnswerSummaryTable() {
+    var _this;
+
+    (0, _classCallCheck2.default)(this, AnswerSummaryTable);
+
+    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.render = function () {
+      var _this$props$answerSum = _this.props.answerSummary,
+          choices = _this$props$answerSum.choices,
+          no_answer = _this$props$answerSum.no_answer;
+      return /*#__PURE__*/_react.default.createElement("div", {
+        className: styles.tableWrapper
+      }, /*#__PURE__*/_react.default.createElement(_uiHeading.Heading, {
+        margin: "large 0 small 0",
+        level: "h3"
+      }, (0, _formatMessage.default)('Answer Frequency Summary')), /*#__PURE__*/_react.default.createElement(_presenter.ChoiceInfo, {
+        choices: choices,
+        noAnswer: no_answer
+      }));
+    };
+
+    return _this;
+  }
+
+  return AnswerSummaryTable;
+}(_react.Component), _class2.propTypes = {
+  answerSummary: _propTypes.answerSummaryPropType
+}.isRequired, _temp)) || _class);
+exports.AnswerSummaryTable = AnswerSummaryTable;

package/lib/reporting/components/resources/NewQuizAndItemAnalysis/AnswerSummaryTable/theme.js

@@ -0,0 +1,15 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = generator;
+
+function generator(_ref) {
+  var spacing = _ref.spacing;
+  return {
+    colorGreen: '#0b874b',
+    cellPadding: ' 0.75rem 0.75rem',
+    tableBottomPadding: spacing.medium
+  };
+}