@instructure/quiz-core 20.17.2-rc.1 → 20.17.2-rc.11

package/lib/common/components/PreviewFrame/index.js

@@ -1,51 +1,30 @@
 "use strict";
 
-var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = exports.PreviewFrame = void 0;
-
 var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
-
 var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
-
+var _callSuper2 = _interopRequireDefault(require("@babel/runtime/helpers/callSuper"));
 var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
-
-var _createSuper2 = _interopRequireDefault(require("@babel/runtime/helpers/createSuper"));
-
 var _react = _interopRequireWildcard(require("react"));
-
 var _propTypes = _interopRequireDefault(require("prop-types"));
-
 var _quizCommon = require("@instructure/quiz-common");
-
 var _uiHeading = require("@instructure/ui-heading");
-
 var _uiIcons = require("@instructure/ui-icons");
-
 var _uiButtons = require("@instructure/ui-buttons");
-
 var _formatMessage = _interopRequireDefault(require("@instructure/quiz-i18n/es/format-message"));
-
-var _ref = /*#__PURE__*/_react.default.createElement(_uiIcons.IconEyeSolid, {
-  variant: "icon-inverse"
-});
-
-var PreviewFrame = /*#__PURE__*/function (_Component) {
-  (0, _inherits2.default)(PreviewFrame, _Component);
-
-  var _super = (0, _createSuper2.default)(PreviewFrame);
-
+var _IconEyeSolid;
+var PreviewFrame = exports.PreviewFrame = /*#__PURE__*/function (_Component) {
   function PreviewFrame() {
     (0, _classCallCheck2.default)(this, PreviewFrame);
-    return _super.apply(this, arguments);
+    return (0, _callSuper2.default)(this, PreviewFrame, arguments);
   }
-
-  (0, _createClass2.default)(PreviewFrame, [{
+  (0, _inherits2.default)(PreviewFrame, _Component);
+  return (0, _createClass2.default)(PreviewFrame, [{
     key: "render",
     value: function render() {
       return /*#__PURE__*/_react.default.createElement(_quizCommon.BarneyBox, {
@@ -53,19 +32,16 @@ var PreviewFrame = /*#__PURE__*/function (_Component) {
       }, /*#__PURE__*/_react.default.createElement(_quizCommon.BarneyBox.Body, null, this.props.children), /*#__PURE__*/_react.default.createElement(_quizCommon.BarneyBox.Footer, null, /*#__PURE__*/_react.default.createElement(_uiHeading.Heading, {
         level: "h4",
         color: "primary-inverse"
-      }, _ref, " \xA0", (0, _formatMessage.default)('Preview')), /*#__PURE__*/_react.default.createElement(_uiButtons.Button, {
+      }, _IconEyeSolid || (_IconEyeSolid = /*#__PURE__*/_react.default.createElement(_uiIcons.IconEyeSolid, {
+        variant: "icon-inverse"
+      })), " \xA0", (0, _formatMessage.default)('Preview')), /*#__PURE__*/_react.default.createElement(_uiButtons.Button, {
         onClick: this.props.onPreviewClose
       }, (0, _formatMessage.default)('Exit Preview'))));
     }
   }]);
-  PreviewFrame.displayName = "PreviewFrame";
-  return PreviewFrame;
 }(_react.Component);
-
-exports.PreviewFrame = PreviewFrame;
 PreviewFrame.propTypes = {
   children: _propTypes.default.element.isRequired,
   onPreviewClose: _propTypes.default.func.isRequired
 };
-var _default = PreviewFrame;
-exports.default = _default;
+var _default = exports.default = PreviewFrame;

package/lib/common/components/PrintFontSizeModal/index.js

@@ -1,13 +1,9 @@
 "use strict";
 
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-
-var _presenter = _interopRequireDefault(require("./presenter.js"));
-
-var _default = _presenter.default;
-exports.default = _default;
+var _presenter = _interopRequireDefault(require("./presenter"));
+var _default = exports.default = _presenter.default;

package/lib/common/components/PrintFontSizeModal/presenter.js

@@ -1,80 +1,61 @@
 "use strict";
 
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = exports.PrintFontSizeModal = void 0;
-
 var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
-
 var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
-
+var _callSuper2 = _interopRequireDefault(require("@babel/runtime/helpers/callSuper"));
 var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
-
-var _createSuper2 = _interopRequireDefault(require("@babel/runtime/helpers/createSuper"));
-
 var _react = require("react");
-
 var _propTypes = _interopRequireDefault(require("prop-types"));
-
 var _quizCommon = require("@instructure/quiz-common");
-
 var _uiHeading = require("@instructure/ui-heading");
-
 var _uiButtons = require("@instructure/ui-buttons");
-
 var _emotion = require("@instructure/emotion");
-
-var _styles = _interopRequireDefault(require("./styles.js"));
-
-var _theme = _interopRequireDefault(require("./theme.js"));
-
+var _styles = _interopRequireDefault(require("./styles"));
+var _theme = _interopRequireDefault(require("./theme"));
 var _formatMessage = _interopRequireDefault(require("@instructure/quiz-i18n/es/format-message"));
-
 var _uiRadioInput = require("@instructure/ui-radio-input");
-
 var _uiCheckbox = require("@instructure/ui-checkbox");
-
-var _dec, _class, _class2, _temp;
-
-var PrintFontSizeModal = (_dec = (0, _emotion.withStyle)(_styles.default, _theme.default), _dec(_class = (_temp = _class2 = /*#__PURE__*/function (_Component) {
-  (0, _inherits2.default)(PrintFontSizeModal, _Component);
-
-  var _super = (0, _createSuper2.default)(PrintFontSizeModal);
-
+var _dec, _class, _PrintFontSizeModal;
+/** @jsx jsx */
+var PrintFontSizeModal = exports.PrintFontSizeModal = (_dec = (0, _emotion.withStyle)(_styles.default, _theme.default), _dec(_class = (_PrintFontSizeModal = /*#__PURE__*/function (_Component) {
   function PrintFontSizeModal() {
     var _this;
-
     (0, _classCallCheck2.default)(this, PrintFontSizeModal);
-
     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 = (0, _callSuper2.default)(this, PrintFontSizeModal, [].concat(args));
     _this.state = {
       selectedFontSize: null,
       rememberTextSizeSetting: false
     };
-
+    // =============
+    //   HELPERS
+    // =============
+    // =============
+    //   HANDLERS
+    // =============
     _this.handleSubmit = function () {
       _this.props.onSubmit(_this.state.selectedFontSize, _this.state.rememberTextSizeSetting);
     };
-
     _this.handleFontSizeChange = function (_, fontSize) {
       _this.setState({
         selectedFontSize: fontSize
       });
     };
-
     _this.handleRememberFontSize = function (e) {
       _this.setState({
         rememberTextSizeSetting: e.target.checked
       });
     };
-
+    // =============
+    //   RENDERING
+    // =============
     _this.text = {
       printQuiz: (0, _formatMessage.default)('Print Quiz'),
       close: (0, _formatMessage.default)('Close'),
@@ -97,13 +78,15 @@ var PrintFontSizeModal = (_dec = (0, _emotion.withStyle)(_styles.default, _theme
     }];
     return _this;
   }
-
-  (0, _createClass2.default)(PrintFontSizeModal, [{
+  (0, _inherits2.default)(PrintFontSizeModal, _Component);
+  return (0, _createClass2.default)(PrintFontSizeModal, [{
     key: "componentDidMount",
+    value:
     // =============
     //   LIFECYCLE
     // =============
-    value: function componentDidMount() {
+
+    function componentDidMount() {
       this.setState({
         selectedFontSize: this.props.persistedPrintFontSize,
         rememberTextSizeSetting: !!this.props.persistedPrintFontSize
@@ -116,13 +99,7 @@ var PrintFontSizeModal = (_dec = (0, _emotion.withStyle)(_styles.default, _theme
         selectedFontSize: nextProps.persistedPrintFontSize || this.state.selectedFontSize,
         rememberTextSizeSetting: !!this.props.persistedPrintFontSize || this.state.rememberTextSizeSetting
       });
-    } // =============
-    //   HELPERS
-    // =============
-    // =============
-    //   HANDLERS
-    // =============
-
+    }
   }, {
     key: "render",
     value: function render() {
@@ -181,9 +158,7 @@ var PrintFontSizeModal = (_dec = (0, _emotion.withStyle)(_styles.default, _theme
       }, this.text.printPreview)));
     }
   }]);
-  PrintFontSizeModal.displayName = "PrintFontSizeModal";
-  return PrintFontSizeModal;
-}(_react.Component), _class2.propTypes = {
+}(_react.Component), _PrintFontSizeModal.propTypes = {
   isOpen: _propTypes.default.bool,
   persistedPrintFontSize: _propTypes.default.string,
   onSubmit: _propTypes.default.func.isRequired,
@@ -191,10 +166,8 @@ var PrintFontSizeModal = (_dec = (0, _emotion.withStyle)(_styles.default, _theme
   onExited: _propTypes.default.func.isRequired,
   // eslint-disable-next-line react/require-default-props,react/forbid-prop-types
   styles: _propTypes.default.object
-}, _class2.defaultProps = {
+}, _PrintFontSizeModal.defaultProps = {
   isOpen: false,
   persistedPrintFontSize: 'medium'
-}, _temp)) || _class);
-exports.PrintFontSizeModal = PrintFontSizeModal;
-var _default = PrintFontSizeModal;
-exports.default = _default;
+}, _PrintFontSizeModal)) || _class);
+var _default = exports.default = PrintFontSizeModal;

package/lib/common/components/PrintFontSizeModal/styles.js

@@ -4,7 +4,6 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-
 var generateStyle = function generateStyle(componentTheme) {
   return {
     separator: {
@@ -16,6 +15,4 @@ var generateStyle = function generateStyle(componentTheme) {
     }
   };
 };
-
-var _default = generateStyle;
-exports.default = _default;
+var _default = exports.default = generateStyle;

package/lib/common/components/PrintFontSizeModal/theme.js

@@ -4,17 +4,14 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-
 var generateComponentTheme = function generateComponentTheme(_ref) {
   var colors = _ref.colors,
-      borders = _ref.borders,
-      spacing = _ref.spacing;
+    borders = _ref.borders,
+    spacing = _ref.spacing;
   return {
     separatorColor: colors.tiara,
     separatorBorderWidth: borders.widthSmall,
     separatorMargin: spacing.medium
   };
 };
-
-var _default = generateComponentTheme;
-exports.default = _default;
+var _default = exports.default = generateComponentTheme;

package/lib/common/components/RceConfigProvider/index.js

@@ -1,29 +1,21 @@
 "use strict";
 
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-
-var _reactRedux = require("../../react-redux.js");
-
-var _presenter = _interopRequireDefault(require("./presenter.js"));
-
-var _rce = require("../../selectors/rce.js");
-
-var _rce2 = require("../../actions/rce.js");
-
+var _reactRedux = require("../../react-redux");
+var _presenter = _interopRequireDefault(require("./presenter"));
+var _rce = require("../../selectors/rce");
+var _rce2 = require("../../actions/rce");
 var mapStateToProps = function mapStateToProps(state, ownProps) {
   return {
     storedRCEConfig: (0, _rce.getRCEConfig)(state)
   };
 };
-
 var mapDispatchToProps = {
   setStoredRCEConfig: _rce2.setStoredRCEConfig
 };
 var RceConfigProvider = (0, _reactRedux.connect)(mapStateToProps, mapDispatchToProps)(_presenter.default);
-var _default = RceConfigProvider;
-exports.default = _default;
+var _default = exports.default = RceConfigProvider;

package/lib/common/components/RceConfigProvider/presenter.js

@@ -1,119 +1,84 @@
 "use strict";
 
-var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
-
-var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
-
+var _regeneratorRuntime2 = _interopRequireDefault(require("@babel/runtime/helpers/regeneratorRuntime"));
 var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
-
 var _react = _interopRequireWildcard(require("react"));
-
 var _propTypes = _interopRequireDefault(require("prop-types"));
-
-var _Spinner = require("../shared/spinner/Spinner.js");
-
-var _index = require("../shared/Card/index.js");
-
+var _Spinner = require("../shared/spinner/Spinner");
+var _Card2 = require("../shared/Card");
 var _quizCommon = require("@instructure/quiz-common");
-
-var _rceConfigUtils = require("./rceConfigUtils.js");
-
-var _rceConfigMapper = require("./rceConfigMapper.js");
-
-var _rceConfigErrorMessages = require("./rceConfigErrorMessages.js");
-
-var _rceConfigErrorHandler = require("./rceConfigErrorHandler.js");
-
-var _rceConfigFetcher = require("./rceConfigFetcher.js");
-
-var _postMessageService = _interopRequireDefault(require("../../../messages/postMessageService.js"));
-
+var _rceConfigUtils = require("./rceConfigUtils");
+var _rceConfigMapper = require("./rceConfigMapper");
+var _rceConfigErrorMessages = require("./rceConfigErrorMessages");
+var _rceConfigErrorHandler = require("./rceConfigErrorHandler");
+var _rceConfigFetcher = require("./rceConfigFetcher");
+var _postMessageService = _interopRequireDefault(require("../../../messages/postMessageService"));
+var _Card;
 var decorateRcsJwtRefreshFn = function decorateRcsJwtRefreshFn(rcsJwtRefreshFn, jwt, setJwt) {
   return /*#__PURE__*/function () {
-    var _ref = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee(setTokenFn, questionStem) {
+    var _ref = (0, _asyncToGenerator2.default)( /*#__PURE__*/(0, _regeneratorRuntime2.default)().mark(function _callee(setTokenFn, questionStem) {
       var _response$json;
-
       var response, refreshedToken;
-      return _regenerator.default.wrap(function _callee$(_context) {
-        while (1) {
-          switch (_context.prev = _context.next) {
-            case 0:
-              _context.next = 2;
-              return rcsJwtRefreshFn(jwt);
-
-            case 2:
-              response = _context.sent;
-              refreshedToken = response === null || response === void 0 ? void 0 : (_response$json = response.json) === null || _response$json === void 0 ? void 0 : _response$json.token; // inst-redux-service-middleware response structure
-
-              if (refreshedToken) {
-                _context.next = 7;
-                break;
-              }
-
-              (0, _rceConfigErrorHandler.handleError)((0, _rceConfigErrorMessages.quizLogMsgErrorDuringTaking)(questionStem));
-              return _context.abrupt("return");
-
-            case 7:
-              setJwt(refreshedToken);
-              setTokenFn(refreshedToken);
-
-            case 9:
-            case "end":
-              return _context.stop();
-          }
+      return (0, _regeneratorRuntime2.default)().wrap(function _callee$(_context) {
+        while (1) switch (_context.prev = _context.next) {
+          case 0:
+            _context.next = 2;
+            return rcsJwtRefreshFn(jwt);
+          case 2:
+            response = _context.sent;
+            refreshedToken = response === null || response === void 0 ? void 0 : (_response$json = response.json) === null || _response$json === void 0 ? void 0 : _response$json.token; // inst-redux-service-middleware response structure
+            if (refreshedToken) {
+              _context.next = 7;
+              break;
+            }
+            (0, _rceConfigErrorHandler.handleError)((0, _rceConfigErrorMessages.quizLogMsgErrorDuringTaking)(questionStem));
+            return _context.abrupt("return");
+          case 7:
+            setJwt(refreshedToken);
+            setTokenFn(refreshedToken);
+          case 9:
+          case "end":
+            return _context.stop();
         }
       }, _callee);
     }));
-
     return function (_x, _x2) {
       return _ref.apply(this, arguments);
     };
   }();
 };
-
-var _ref4 = /*#__PURE__*/_react.default.createElement(_index.Card, {
-  wrapped: true
-}, /*#__PURE__*/_react.default.createElement(_Spinner.QuizzesSpinner, null));
-
 var RceConfigProviderComponent = function RceConfigProviderComponent(_ref2) {
   var children = _ref2.children,
-      contextId = _ref2.contextId,
-      contextType = _ref2.contextType,
-      canvasUserId = _ref2.canvasUserId,
-      canvasToolId = _ref2.canvasToolId,
-      rcsHost = _ref2.rcsHost,
-      rcsJwt = _ref2.rcsJwt,
-      rcsJwtRefreshFn = _ref2.rcsJwtRefreshFn,
-      canvasOrigin = _ref2.canvasOrigin,
-      storedRCEConfig = _ref2.storedRCEConfig,
-      setStoredRCEConfig = _ref2.setStoredRCEConfig;
-
+    contextId = _ref2.contextId,
+    contextType = _ref2.contextType,
+    canvasUserId = _ref2.canvasUserId,
+    canvasToolId = _ref2.canvasToolId,
+    rcsHost = _ref2.rcsHost,
+    rcsJwt = _ref2.rcsJwt,
+    rcsJwtRefreshFn = _ref2.rcsJwtRefreshFn,
+    canvasOrigin = _ref2.canvasOrigin,
+    storedRCEConfig = _ref2.storedRCEConfig,
+    setStoredRCEConfig = _ref2.setStoredRCEConfig;
   var _useState = (0, _react.useState)(rcsJwt),
-      _useState2 = (0, _slicedToArray2.default)(_useState, 2),
-      jwt = _useState2[0],
-      setJwt = _useState2[1];
-
+    _useState2 = (0, _slicedToArray2.default)(_useState, 2),
+    jwt = _useState2[0],
+    setJwt = _useState2[1];
   var _useState3 = (0, _react.useState)(storedRCEConfig),
-      _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
-      canvasConfig = _useState4[0],
-      setCanvasConfig = _useState4[1];
-
+    _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
+    canvasConfig = _useState4[0],
+    setCanvasConfig = _useState4[1];
   var rceConfigAvailable = storedRCEConfig ? false : true;
-
   var _useState5 = (0, _react.useState)(rceConfigAvailable),
-      _useState6 = (0, _slicedToArray2.default)(_useState5, 2),
-      canvasConfigLoading = _useState6[0],
-      setCanvasConfigLoading = _useState6[1];
-
+    _useState6 = (0, _slicedToArray2.default)(_useState5, 2),
+    canvasConfigLoading = _useState6[0],
+    setCanvasConfigLoading = _useState6[1];
   var refreshToken = rcsJwtRefreshFn && jwt ? decorateRcsJwtRefreshFn(rcsJwtRefreshFn, jwt, setJwt) : null;
   var rcsParams = {
     contextId: contextId,
@@ -130,61 +95,49 @@ var RceConfigProviderComponent = function RceConfigProviderComponent(_ref2) {
     canvasOrigin: canvasOrigin
   };
   (0, _react.useEffect)(function () {
-    (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee2() {
+    (0, _asyncToGenerator2.default)( /*#__PURE__*/(0, _regeneratorRuntime2.default)().mark(function _callee2() {
       var json;
-      return _regenerator.default.wrap(function _callee2$(_context2) {
-        while (1) {
-          switch (_context2.prev = _context2.next) {
-            case 0:
-              _context2.prev = 0;
-
-              if ((0, _rceConfigUtils.hasAllPropsForRcs)(rcsParams)) {
-                _context2.next = 4;
-                break;
-              }
-
-              (0, _rceConfigErrorHandler.handleError)((0, _rceConfigErrorMessages.quizLogMsgInvalidParams)());
-              return _context2.abrupt("return");
-
-            case 4:
-              if (!storedRCEConfig) {
-                _context2.next = 8;
-                break;
-              }
-
-              setCanvasConfig(storedRCEConfig);
-              _context2.next = 14;
+      return (0, _regeneratorRuntime2.default)().wrap(function _callee2$(_context2) {
+        while (1) switch (_context2.prev = _context2.next) {
+          case 0:
+            _context2.prev = 0;
+            if ((0, _rceConfigUtils.hasAllPropsForRcs)(rcsParams)) {
+              _context2.next = 4;
               break;
-
-            case 8:
-              _context2.next = 10;
-              return (0, _rceConfigFetcher.fetchRceConfig)(rcsHost, contextType, contextId, jwt);
-
-            case 10:
-              json = _context2.sent;
-              setStoredRCEConfig(json);
-              setCanvasConfig(json);
-              (0, _rceConfigErrorHandler.setEventToQuizLog)(null);
-
-            case 14:
-              _context2.next = 20;
+            }
+            (0, _rceConfigErrorHandler.handleError)((0, _rceConfigErrorMessages.quizLogMsgInvalidParams)());
+            return _context2.abrupt("return");
+          case 4:
+            if (!storedRCEConfig) {
+              _context2.next = 8;
               break;
-
-            case 16:
-              _context2.prev = 16;
-              _context2.t0 = _context2["catch"](0);
-              setCanvasConfig(null);
-              (0, _rceConfigErrorHandler.handleError)((0, _rceConfigErrorMessages.quizLogMsgFailedConfigFetch)());
-
-            case 20:
-              _context2.prev = 20;
-              setCanvasConfigLoading(false);
-              return _context2.finish(20);
-
-            case 23:
-            case "end":
-              return _context2.stop();
-          }
+            }
+            setCanvasConfig(storedRCEConfig);
+            _context2.next = 14;
+            break;
+          case 8:
+            _context2.next = 10;
+            return (0, _rceConfigFetcher.fetchRceConfig)(rcsHost, contextType, contextId, jwt);
+          case 10:
+            json = _context2.sent;
+            setStoredRCEConfig(json);
+            setCanvasConfig(json);
+            (0, _rceConfigErrorHandler.setEventToQuizLog)(null);
+          case 14:
+            _context2.next = 20;
+            break;
+          case 16:
+            _context2.prev = 16;
+            _context2.t0 = _context2["catch"](0);
+            setCanvasConfig(null);
+            (0, _rceConfigErrorHandler.handleError)((0, _rceConfigErrorMessages.quizLogMsgFailedConfigFetch)());
+          case 20:
+            _context2.prev = 20;
+            setCanvasConfigLoading(false);
+            return _context2.finish(20);
+          case 23:
+          case "end":
+            return _context2.stop();
         }
       }, _callee2, null, [[0, 16, 20, 23]]);
     }))();
@@ -196,16 +149,15 @@ var RceConfigProviderComponent = function RceConfigProviderComponent(_ref2) {
       postMessageService.cleanupPostMessageListener();
     };
   }, []);
-
   if (canvasConfigLoading) {
-    return _ref4;
+    return _Card || (_Card = /*#__PURE__*/_react.default.createElement(_Card2.Card, {
+      wrapped: true
+    }, /*#__PURE__*/_react.default.createElement(_Spinner.QuizzesSpinner, null)));
   }
-
   return /*#__PURE__*/_react.default.createElement(_quizCommon.RceConfigContext.Provider, {
     value: (0, _rceConfigMapper.mapParamsToRceConfigContext)(rcsParams, rendererParams, canvasConfig, ltiAppParams)
   }, children);
 };
-
 RceConfigProviderComponent.propTypes = {
   children: _propTypes.default.node.isRequired,
   contextId: _propTypes.default.string,
@@ -240,5 +192,4 @@ RceConfigProviderComponent.defaultProps = {
   storedRCEConfig: null,
   setStoredRCEConfig: null
 };
-var _default = RceConfigProviderComponent;
-exports.default = _default;
+var _default = exports.default = RceConfigProviderComponent;