@instructure/quiz-core 22.10.2 → 22.11.1

package/lib/common/util/useRemoteComponent.js

@@ -0,0 +1,134 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useRemoteComponent = useRemoteComponent;
+var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
+var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+var _react = require("react");
+var _formatMessage = _interopRequireDefault(require("@instructure/quiz-i18n/es/format-message"));
+// @ts-check
+
+/**
+ * Custom hook to load and render a remote component asynchronously.
+ *
+ * @param {() => Promise<{
+ *   render: (container: HTMLElement, props: unknown) => void,
+ *   unmount?: () => void
+ * }>} loadRemoteModule - A function that returns a promise resolving to the remote component module
+ * @param {unknown | undefined} props - Props to pass to the remote component when rendering
+ * @param {boolean} enabled - Whether the remote component should be loaded and rendered
+ *
+ * @returns {{
+ *   containerRef: React.MutableRefObject<HTMLDivElement | null>,
+ *   componentActivityState: 'idle' | 'pending' | 'success' | 'error',
+ *   componentError: Error | null,
+ *   unmount: () => void
+ * }} An object containing the container ref and unmount function
+ */
+function useRemoteComponent(loadRemoteModule, props) {
+  var enabled = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : true;
+  var mountCancelled = (0, _react.useRef)(false);
+  var _useState = (0, _react.useState)(/** @type {'idle' | 'pending' | 'success' | 'error'} */'idle'),
+    _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
+    componentActivityState = _useState2[0],
+    setComponentActivityState = _useState2[1];
+  var _useState3 = (0, _react.useState)(/** @type {Error | null} */null),
+    _useState4 = (0, _slicedToArray2["default"])(_useState3, 2),
+    componentError = _useState4[0],
+    setComponentError = _useState4[1];
+
+  /**
+   * @type {React.MutableRefObject<{
+   *   render: (container: HTMLElement, props: unknown) => void,
+   *   unmount?: () => void
+   * } | null>}
+   */
+  var remoteModuleRef = (0, _react.useRef)(null);
+
+  /**
+   * @type {React.MutableRefObject<HTMLDivElement | null>}
+   */
+  var containerRef = (0, _react.useRef)(null);
+
+  // Note: This workflow can be converted to a TanStack Query hook in the future.
+  (0, _react.useEffect)(function () {
+    if (loadRemoteModule == null || !enabled || componentActivityState === 'error') {
+      return;
+    }
+    mountCancelled.current = false;
+    setComponentActivityState('idle');
+    function loadModule() {
+      return _loadModule.apply(this, arguments);
+    }
+    function _loadModule() {
+      _loadModule = (0, _asyncToGenerator2["default"])(/*#__PURE__*/_regenerator["default"].mark(function _callee() {
+        var module;
+        return _regenerator["default"].wrap(function _callee$(_context) {
+          while (1) switch (_context.prev = _context.next) {
+            case 0:
+              _context.prev = 0;
+              if (!remoteModuleRef.current) {
+                _context.next = 4;
+                break;
+              }
+              setComponentActivityState('success');
+              return _context.abrupt("return", remoteModuleRef.current);
+            case 4:
+              setComponentActivityState('pending');
+              _context.next = 7;
+              return loadRemoteModule();
+            case 7:
+              module = _context.sent;
+              setComponentActivityState('success');
+              return _context.abrupt("return", module);
+            case 12:
+              _context.prev = 12;
+              _context.t0 = _context["catch"](0);
+              setComponentActivityState('error');
+              setComponentError(new Error((0, _formatMessage["default"])('Failed to load remote module: {error}', {
+                error: _context.t0
+              })));
+            case 16:
+            case "end":
+              return _context.stop();
+          }
+        }, _callee, null, [[0, 12]]);
+      }));
+      return _loadModule.apply(this, arguments);
+    }
+    loadModule().then(function (module) {
+      if (module) {
+        remoteModuleRef.current = module;
+      }
+      var container = containerRef.current;
+      if (container == null || module == null || mountCancelled.current) {
+        return;
+      }
+      module.render(container, props);
+    });
+    return function () {
+      mountCancelled.current = true;
+    };
+  }, [loadRemoteModule, props, enabled]);
+  var unmount = (0, _react.useCallback)(function () {
+    var _module$unmount;
+    if (mountCancelled.current || !containerRef.current) {
+      return;
+    }
+    var module = remoteModuleRef.current;
+    if (!module) {
+      return;
+    }
+    (_module$unmount = module.unmount) === null || _module$unmount === void 0 || _module$unmount.call(module);
+  }, []);
+  return {
+    containerRef: containerRef,
+    componentActivityState: componentActivityState,
+    componentError: componentError,
+    unmount: unmount
+  };
+}

package/lib/configureStore.js

@@ -17,6 +17,7 @@ var _alertTimerMiddleware = _interopRequireDefault(require("./common/middleware/
 var _crossDomainMessagingMiddleware = _interopRequireDefault(require("./common/middleware/crossDomainMessagingMiddleware"));
 var _eventLoggerMiddleware = _interopRequireDefault(require("./common/middleware/eventLoggerMiddleware"));
 var _quizTimerWebSocketMiddleware = require("./common/middleware/quizTimerWebSocketMiddleware");
+var _sharedBanksMiddleware = require("./common/middleware/sharedBanksMiddleware");
 var _alerts = _interopRequireDefault(require("./common/reducers/alerts"));
 var _banks = _interopRequireDefault(require("./common/reducers/banks"));
 var _bankEntries = _interopRequireDefault(require("./common/reducers/bankEntries"));
@@ -54,6 +55,7 @@ var _qtiImports = _interopRequireDefault(require("./common/reducers/qtiImports")
 var _printing = _interopRequireDefault(require("./common/reducers/printing"));
 var _rce = _interopRequireDefault(require("./common/reducers/rce"));
 var _analyses = _interopRequireDefault(require("./common/reducers/analyses"));
+var _sharingModal = _interopRequireDefault(require("./common/reducers/sharingModal"));
 var _dragAndDrop = _interopRequireDefault(require("./common/reducers/dragAndDrop"));
 var _sharedBanks = _interopRequireDefault(require("./common/reducers/sharedBanks"));
 // middleware
@@ -85,7 +87,7 @@ function configureStore(_ref) {
   var getMiddleware = function getMiddleware(implementation, override) {
     return isTest && override ? override : implementation;
   };
-  var middlewares = [getMiddleware(_alertTimerMiddleware["default"], middlewareOverrides.alertTimerMiddleware), getMiddleware(_crossDomainMessagingMiddleware["default"], middlewareOverrides.crossDomainMessagingMiddleware), getMiddleware(_reduxMulti["default"], middlewareOverrides.multiMiddleware), getMiddleware((0, _eventLoggerMiddleware["default"])(), middlewareOverrides.kinesisMiddleware), getMiddleware(_reduxThunk["default"], middlewareOverrides.thunkMiddleware), getMiddleware((0, _quizTimerWebSocketMiddleware.createQuizTimerWebSocketMiddleware)(), middlewareOverrides.websocketMiddleware)];
+  var middlewares = [getMiddleware(_alertTimerMiddleware["default"], middlewareOverrides.alertTimerMiddleware), getMiddleware(_crossDomainMessagingMiddleware["default"], middlewareOverrides.crossDomainMessagingMiddleware), getMiddleware(_reduxMulti["default"], middlewareOverrides.multiMiddleware), getMiddleware((0, _eventLoggerMiddleware["default"])(), middlewareOverrides.kinesisMiddleware), getMiddleware(_reduxThunk["default"], middlewareOverrides.thunkMiddleware), getMiddleware((0, _quizTimerWebSocketMiddleware.createQuizTimerWebSocketMiddleware)(), middlewareOverrides.websocketMiddleware), getMiddleware((0, _sharedBanksMiddleware.createSharedBanksMiddleware)(), middlewareOverrides.sharedBanksMiddleware)];
   var devMiddleware = [getMiddleware(loggerMiddleware, middlewareOverrides.logger)];
   if (inDevelopment) {
     middlewares.push.apply(middlewares, devMiddleware);
@@ -106,6 +108,7 @@ function configureStore(_ref) {
     banks: _banks["default"],
     bankEntries: _bankEntries["default"],
     sharedBanks: _sharedBanks["default"],
+    sharingModal: _sharingModal["default"],
     calls: _calls["default"],
     config: _config["default"],
     editing: _editing["default"],

package/lib/index.js

@@ -111,6 +111,7 @@ var _exportNames = {
   printWithCss: true,
   ensureImagesLoaded: true,
   ensureRCEContentIsLoaded: true,
+  useRemoteComponent: true,
   applyComponentStyleOverride: true,
   withStyleOverrides: true,
   getThemeByKey: true,
@@ -121,7 +122,9 @@ var _exportNames = {
   createQuizEntryRegrade: true,
   getQuizEntry: true,
   moveQuizEntry: true,
+  createBulkQuizEntries: true,
   getItem: true,
+  createBulkItems: true,
   interactionFileUpload: true,
   setOneAtATimeType: true,
   quizBuildingSession: true,
@@ -816,6 +819,18 @@ Object.defineProperty(exports, "connect", {
     return _reactRedux.connect;
   }
 });
+Object.defineProperty(exports, "createBulkItems", {
+  enumerable: true,
+  get: function get() {
+    return _items.createBulkItems;
+  }
+});
+Object.defineProperty(exports, "createBulkQuizEntries", {
+  enumerable: true,
+  get: function get() {
+    return _quizEntries.createBulkQuizEntries;
+  }
+});
 Object.defineProperty(exports, "createQuizEntryRegrade", {
   enumerable: true,
   get: function get() {
@@ -1490,6 +1505,12 @@ Object.defineProperty(exports, "unsetFeatures", {
     return _featureCheck.unsetFeatures;
   }
 });
+Object.defineProperty(exports, "useRemoteComponent", {
+  enumerable: true,
+  get: function get() {
+    return _useRemoteComponent.useRemoteComponent;
+  }
+});
 Object.defineProperty(exports, "withStyleOverrides", {
   enumerable: true,
   get: function get() {
@@ -1598,6 +1619,7 @@ var _ElementsForSelectors = require("./common/util/ElementsForSelectors");
 var _sessionStore = require("./common/util/sessionStore");
 var _printUtils = require("./common/util/printUtils");
 var _rceChecker = require("./common/util/rceChecker");
+var _useRemoteComponent = require("./common/util/useRemoteComponent");
 var _quizCommon = require("@instructure/quiz-common");
 var _getClientIpAddress = require("./common/util/getClientIpAddress");
 var _quizEntryRegrades = require("./grading/api/quizEntryRegrades");

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@instructure/quiz-core",
-  "version": "22.10.2",
+  "version": "22.11.1",
   "license": "MIT",
   "description": "The Quiz React SDK by Instructure Inc.",
   "author": "Instructure, Inc. Engineering and Product Design",
@@ -111,12 +111,12 @@
     "store": "^1.3.20",
     "striptags": "^2.0.0",
     "uuid": "^3.2.1",
-    "@instructure/quiz-common": "22.10.2",
-    "@instructure/quiz-number-input": "22.10.2",
-    "@instructure/quiz-i18n": "22.10.2",
-    "@instructure/quiz-interactions": "22.10.2",
-    "instructure-validations": "22.10.2",
-    "@instructure/quiz-rce": "22.10.2"
+    "@instructure/quiz-i18n": "22.11.1",
+    "@instructure/quiz-interactions": "22.11.1",
+    "@instructure/quiz-common": "22.11.1",
+    "@instructure/quiz-number-input": "22.11.1",
+    "@instructure/quiz-rce": "22.11.1",
+    "instructure-validations": "22.11.1"
   },
   "devDependencies": {
     "@instructure/ui-axe-check": "10.17.0",
@@ -145,7 +145,7 @@
     "sinon": "^6.1.3",
     "sinon-chai": "^3.3.0",
     "@instructure/quiz-scripts": "21.0.0",
-    "quiz-presets": "22.10.2"
+    "quiz-presets": "22.11.1"
   },
   "peerDependencies": {
     "react": "^15 || ^16"