@instructure/quiz-core 21.1.1 → 22.0.0

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

@@ -1,20 +1,19 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.default = exports.SharingModalPresenter = void 0;
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+exports["default"] = exports.SharingModalPresenter = void 0;
 var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
 var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
-var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
 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 = _interopRequireWildcard(require("react"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _immutable = require("immutable");
@@ -28,29 +27,44 @@ var _uiGrid = require("@instructure/ui-grid");
 var _uiTabs = require("@instructure/ui-tabs");
 var _uiText = require("@instructure/ui-text");
 var _emotion = require("@instructure/emotion");
-var _CustomPropTypes = _interopRequireDefault(require("../../../common/util/CustomPropTypes.js"));
-var _index = _interopRequireDefault(require("./ShareList/index.js"));
-var _index2 = _interopRequireDefault(require("../AsyncSearch/index.js"));
-var _RootAccountSharing = _interopRequireDefault(require("./RootAccountSharing.js"));
-var _Spinner = _interopRequireDefault(require("../../../common/components/shared/spinner/Spinner.js"));
-var _styles = _interopRequireDefault(require("./styles.js"));
-var _theme = _interopRequireDefault(require("./theme.js"));
+var _CustomPropTypes = _interopRequireDefault(require("../../../common/util/CustomPropTypes"));
+var _ShareList = _interopRequireDefault(require("./ShareList"));
+var _AsyncSearch = _interopRequireDefault(require("../AsyncSearch"));
+var _RootAccountSharing = _interopRequireDefault(require("./RootAccountSharing"));
+var _Spinner = _interopRequireDefault(require("../../../common/components/shared/spinner/Spinner"));
+var _styles = _interopRequireDefault(require("./styles"));
+var _theme = _interopRequireDefault(require("./theme"));
 var _formatMessage = _interopRequireDefault(require("@instructure/quiz-i18n/es/format-message"));
 var _dec, _class, _SharingModalPresenter;
 /** @jsx jsx */
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+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; }
+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 noop = function noop() {};
-var _ref7 = (0, _emotion.jsx)(_Spinner.default, null);
-var SharingModalPresenter = (_dec = (0, _quizCommon.withStyleOverrides)(_styles.default, _theme.default), _dec(_class = (_SharingModalPresenter = /*#__PURE__*/function (_Component) {
-  (0, _inherits2.default)(SharingModalPresenter, _Component);
-  var _super = (0, _createSuper2.default)(SharingModalPresenter);
+var SharingModalPresenter = exports.SharingModalPresenter = (_dec = (0, _quizCommon.withStyleOverrides)(_styles["default"], _theme["default"]), _dec(_class = (_SharingModalPresenter = /*#__PURE__*/function (_Component) {
   function SharingModalPresenter() {
-    var _this;
-    (0, _classCallCheck2.default)(this, SharingModalPresenter);
+    var _this2;
+    (0, _classCallCheck2["default"])(this, SharingModalPresenter);
     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, SharingModalPresenter, [].concat(args));
+    (0, _defineProperty2["default"])(_this2, "state", {
       accountPermission: null,
       shares: (0, _immutable.List)(),
       newEntities: (0, _immutable.List)(),
@@ -58,145 +72,145 @@ var SharingModalPresenter = (_dec = (0, _quizCommon.withStyleOverrides)(_styles.
       searchPermission: _quizCommon.READ_ONLY,
       entitiesWithChangedPermission: {},
       selectedTabIndex: 0
-    };
-    _this.shareListRef = null;
-    _this.shareButtonRef = null;
+    });
+    (0, _defineProperty2["default"])(_this2, "shareListRef", null);
+    (0, _defineProperty2["default"])(_this2, "shareButtonRef", null);
     // =============
     //   LIFECYCLE
     // =============
-    _this.checkForSharedBanks = function () {
-      var size = _this.props.sharedBanks.size;
-      if (size >= 0 && size !== _this.props.bank.sharedCount || size === 0) {
-        _this.props.getSharedBanks(_this.props.bank, _this.props.getUserInfo, _this.props.getCourseInfo, _this.props.getSubaccountInfo);
+    (0, _defineProperty2["default"])(_this2, "checkForSharedBanks", function () {
+      var size = _this2.props.sharedBanks.size;
+      if (size >= 0 && size !== _this2.props.bank.sharedCount || size === 0) {
+        _this2.props.getSharedBanks(_this2.props.bank, _this2.props.getUserInfo, _this2.props.getCourseInfo, _this2.props.getSubaccountInfo);
       } else {
-        _this.setState({
-          shares: _this.props.sharedBanks
+        _this2.setState({
+          shares: _this2.props.sharedBanks
         });
       }
-    };
+    });
     // =============
     //   HELPERS
     // =============
-    _this.handleTabChange = function (event, _ref) {
+    (0, _defineProperty2["default"])(_this2, "handleTabChange", function (event, _ref) {
       var index = _ref.index;
-      _this.setState({
+      _this2.setState({
         selectedTabIndex: index
       });
-    };
-    _this.modalDismissCleanup = function () {
-      var focusCreateBank = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : false;
-      _this.props.onDismiss();
-      if (_this.props.modalTrigger && !focusCreateBank) {
-        _this.props.modalTrigger.focus();
+    });
+    (0, _defineProperty2["default"])(_this2, "modalDismissCleanup", function () {
+      var focusCreateBank = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;
+      _this2.props.onDismiss();
+      if (_this2.props.modalTrigger && !focusCreateBank) {
+        _this2.props.modalTrigger.focus();
       } else {
-        setTimeout(_this.props.focusCreateBankButton, 100);
+        setTimeout(_this2.props.focusCreateBankButton, 100);
       }
       // removes the creator's temporary sharedBank record
-      _this.props.removeSharedBank('-1');
-    };
-    _this.numEntitiesToRemove = function () {
-      var permissions = Object.values(_this.state.entitiesWithChangedPermission);
+      _this2.props.removeSharedBank('-1');
+    });
+    (0, _defineProperty2["default"])(_this2, "numEntitiesToRemove", function () {
+      var permissions = Object.values(_this2.state.entitiesWithChangedPermission);
       return permissions.reduce(function (count, val) {
         return val === _quizCommon.REMOVED_ACCESS ? count + 1 : count;
       }, 0);
-    };
-    _this.newEntitiesToSubmit = function () {
-      var newEntities = _this.state.newEntities.filter(function (entity) {
-        return _this.state.entitiesWithChangedPermission[entity.get('id')] !== _quizCommon.REMOVED_ACCESS;
+    });
+    (0, _defineProperty2["default"])(_this2, "newEntitiesToSubmit", function () {
+      var newEntities = _this2.state.newEntities.filter(function (entity) {
+        return _this2.state.entitiesWithChangedPermission[entity.get('id')] !== _quizCommon.REMOVED_ACCESS;
       });
 
       // special case if the creator tries to change their own permissions before
       // first share, since they don't have a SharedBank record to update
-      var newCreatorPerm = _this.state.entitiesWithChangedPermission['-1'];
+      var newCreatorPerm = _this2.state.entitiesWithChangedPermission['-1'];
       if (newCreatorPerm && newCreatorPerm !== _quizCommon.CAN_EDIT) {
-        var creatorSharedBank = _this.props.sharedBanks.find(function (sharedBank) {
+        var creatorSharedBank = _this2.props.sharedBanks.find(function (sharedBank) {
           return sharedBank.get('id') == '-1';
         });
-        newEntities = newEntities.push((0, _immutable.Map)((0, _objectSpread2.default)((0, _objectSpread2.default)({}, creatorSharedBank.toJS()), {}, {
+        newEntities = newEntities.push((0, _immutable.Map)(_objectSpread(_objectSpread({}, creatorSharedBank.toJS()), {}, {
           permission: newCreatorPerm
         })));
       }
       return newEntities;
-    };
-    _this.isSharedWithAccount = function () {
-      var state = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : _this.state;
+    });
+    (0, _defineProperty2["default"])(_this2, "isSharedWithAccount", function () {
+      var state = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : _this2.state;
       return [_quizCommon.READ_ONLY, _quizCommon.CAN_EDIT].includes(state.accountPermission);
-    };
+    });
     // =============
     //   HANDLERS
     // =============
-    _this.handleDismiss = function (e) {
-      _this.props.updateSharedCount(null);
-      _this.modalDismissCleanup();
-    };
-    _this.handleSubmit = function () {
+    (0, _defineProperty2["default"])(_this2, "handleDismiss", function (e) {
+      _this2.props.updateSharedCount(null);
+      _this2.modalDismissCleanup();
+    });
+    (0, _defineProperty2["default"])(_this2, "handleSubmit", function () {
       // calls the sharedBank api with the new entities you shared the current bank with
       var promises = [];
-      if (_this.state.accountPermission !== _this.props.bank.accountPermission) {
-        var updatedBank = _this.props.bank.set('accountPermission', _this.state.accountPermission);
-        promises.push(_this.props.updateBank(updatedBank));
+      if (_this2.state.accountPermission !== _this2.props.bank.accountPermission) {
+        var updatedBank = _this2.props.bank.set('accountPermission', _this2.state.accountPermission);
+        promises.push(_this2.props.updateBank(updatedBank));
       }
-      _this.newEntitiesToSubmit().forEach(function (entity) {
-        _this.props.onShare(entity.toJS());
-        promises.push(_this.props.shareBank(_this.sharedBankForEntity(entity), _this.props.getUserInfo));
+      _this2.newEntitiesToSubmit().forEach(function (entity) {
+        _this2.props.onShare(entity.toJS());
+        promises.push(_this2.props.shareBank(_this2.sharedBankForEntity(entity), _this2.props.getUserInfo));
       });
 
       // call the update api if any shared bank permission was updated
-      Object.entries(_this.state.entitiesWithChangedPermission).forEach(function (_ref2) {
-        var _ref3 = (0, _slicedToArray2.default)(_ref2, 2),
+      Object.entries(_this2.state.entitiesWithChangedPermission).forEach(function (_ref2) {
+        var _ref3 = (0, _slicedToArray2["default"])(_ref2, 2),
           sharedBankId = _ref3[0],
           permission = _ref3[1];
-        var sharedBank = _this.props.sharedBanks.find(function (sharedBank) {
+        var sharedBank = _this2.props.sharedBanks.find(function (sharedBank) {
           return sharedBank.get('id') === sharedBankId;
         });
         if (sharedBank && sharedBank.get('permission') !== permission && sharedBankId != '-1') {
-          promises.push(_this.props.updateSharedBankPermission(_this.props.bank.id, sharedBankId, permission));
+          promises.push(_this2.props.updateSharedBankPermission(_this2.props.bank.id, sharedBankId, permission));
         }
       });
 
       // waits till all the calls to the shareBank and updateSharedBank apis have completed
       Promise.all(promises).then(function (values) {
         // calls getBank for the current bank to update the sharedCount
-        _this.props.getBank(_this.props.bank.id);
+        _this2.props.getBank(_this2.props.bank.id);
       });
-      _this.setState({
+      _this2.setState({
         newEntities: (0, _immutable.List)()
       });
-      _this.modalDismissCleanup(!!_this.numEntitiesToRemove());
-    };
-    _this.handleSearchSelectionChange = function (searchSelection) {
-      _this.setState({
+      _this2.modalDismissCleanup(!!_this2.numEntitiesToRemove());
+    });
+    (0, _defineProperty2["default"])(_this2, "handleSearchSelectionChange", function (searchSelection) {
+      _this2.setState({
         searchSelection: searchSelection
       });
-    };
-    _this.updateEntitiesCount = function () {
+    });
+    (0, _defineProperty2["default"])(_this2, "updateEntitiesCount", function () {
       // state.shares is a list containing everyone in the list,
-      _this.props.updateSharedCount(_this.state.shares.size - _this.numEntitiesToRemove());
-    };
-    _this.originalPermissionForEntity = function (entity) {
-      var originalEntity = _this.props.sharedBanks.find(function (sb) {
+      _this2.props.updateSharedCount(_this2.state.shares.size - _this2.numEntitiesToRemove());
+    });
+    (0, _defineProperty2["default"])(_this2, "originalPermissionForEntity", function (entity) {
+      var originalEntity = _this2.props.sharedBanks.find(function (sb) {
         return sb.get('id') == entity.get('id');
       }) || (0, _immutable.Map)();
       return originalEntity.get('permission', _quizCommon.CAN_EDIT);
-    };
-    _this.handleEntityRemove = function (entity, undoRemove) {
-      _this.confirmPermissionChange(entity, _quizCommon.REMOVED_ACCESS);
-    };
-    _this.handleSearchPermissionChange = function (e, _ref4) {
+    });
+    (0, _defineProperty2["default"])(_this2, "handleEntityRemove", function (entity, undoRemove) {
+      _this2.confirmPermissionChange(entity, _quizCommon.REMOVED_ACCESS);
+    });
+    (0, _defineProperty2["default"])(_this2, "handleSearchPermissionChange", function (e, _ref4) {
       var value = _ref4.value;
-      _this.setState({
+      _this2.setState({
         searchPermission: value
       });
-    };
-    _this.handleSearchFilter = function (searchResults) {
+    });
+    (0, _defineProperty2["default"])(_this2, "handleSearchFilter", function (searchResults) {
       return searchResults.filter(function (result) {
-        return !_this.state.shares.some(function (entity) {
+        return !_this2.state.shares.some(function (entity) {
           return entity.get('entityId') === result.uuid;
-        }) && (result.uuid !== _this.props.bank.creator || _this.props.bank.sharedCount > 0);
+        }) && (result.uuid !== _this2.props.bank.creator || _this2.props.bank.sharedCount > 0);
       });
-    };
-    _this.handleShare = function () {
-      var newEntities = (0, _immutable.List)(_this.state.searchSelection.map(function (entity) {
+    });
+    (0, _defineProperty2["default"])(_this2, "handleShare", function () {
+      var newEntities = (0, _immutable.List)(_this2.state.searchSelection.map(function (entity) {
         return (0, _immutable.Map)({
           id: entity.uuid,
           entityType: entity.entityType,
@@ -204,131 +218,129 @@ var SharingModalPresenter = (_dec = (0, _quizCommon.withStyleOverrides)(_styles.
           title: entity.fullName || entity.title || entity.name,
           avatar: entity.avatar,
           email: entity.email,
-          permission: _this.state.searchPermission
+          permission: _this2.state.searchPermission
         });
       }));
       newEntities.forEach(function (entity) {
-        _this.props.onShare(entity.toJS());
-        _this.props.shareBank(_this.sharedBankForEntity(entity), _this.props.getUserInfo);
+        _this2.props.onShare(entity.toJS());
+        _this2.props.shareBank(_this2.sharedBankForEntity(entity), _this2.props.getUserInfo);
       });
-      _this.setState({
+      _this2.setState({
         searchSelection: []
       });
-    };
-    _this.updatePermission = /*#__PURE__*/function () {
-      var _ref5 = (0, _asyncToGenerator2.default)(/*#__PURE__*/_regenerator.default.mark(function _callee(entity, permission) {
-        var _this$props, updateSharedBankPermission, getBank, bank;
-        return _regenerator.default.wrap(function _callee$(_context) {
-          while (1) {
-            switch (_context.prev = _context.next) {
-              case 0:
-                _this$props = _this.props, updateSharedBankPermission = _this$props.updateSharedBankPermission, getBank = _this$props.getBank, bank = _this$props.bank;
-                _context.next = 3;
-                return updateSharedBankPermission(bank.id, entity.get('id'), permission);
-              case 3:
-                getBank(bank.id); // make sure the user still has access to the bank
-              case 4:
-              case "end":
-                return _context.stop();
-            }
+    });
+    (0, _defineProperty2["default"])(_this2, "updatePermission", /*#__PURE__*/function () {
+      var _ref5 = (0, _asyncToGenerator2["default"])(/*#__PURE__*/_regenerator["default"].mark(function _callee(entity, permission) {
+        var _this2$props, updateSharedBankPermission, getBank, bank;
+        return _regenerator["default"].wrap(function _callee$(_context) {
+          while (1) switch (_context.prev = _context.next) {
+            case 0:
+              _this2$props = _this2.props, updateSharedBankPermission = _this2$props.updateSharedBankPermission, getBank = _this2$props.getBank, bank = _this2$props.bank;
+              _context.next = 3;
+              return updateSharedBankPermission(bank.id, entity.get('id'), permission);
+            case 3:
+              getBank(bank.id); // make sure the user still has access to the bank
+            case 4:
+            case "end":
+              return _context.stop();
           }
         }, _callee);
       }));
       return function (_x, _x2) {
         return _ref5.apply(this, arguments);
       };
-    }();
-    _this.translatedPermissionLevel = function (permission) {
-      var _CAN_EDIT$READ_ONLY$p;
-      return (_CAN_EDIT$READ_ONLY$p = {}, (0, _defineProperty2.default)(_CAN_EDIT$READ_ONLY$p, _quizCommon.CAN_EDIT, (0, _formatMessage.default)('edit')), (0, _defineProperty2.default)(_CAN_EDIT$READ_ONLY$p, _quizCommon.READ_ONLY, (0, _formatMessage.default)('view')), _CAN_EDIT$READ_ONLY$p)[permission];
-    };
-    _this.confirmPermissionChange = function (entity, permission) {
-      var confirmText = permission === _quizCommon.REMOVED_ACCESS ? (0, _formatMessage.default)('You are about to remove { accessLevel } access for { entityTitle } to this bank.', {
-        accessLevel: _this.translatedPermissionLevel(_this.originalPermissionForEntity(entity)),
+    }());
+    (0, _defineProperty2["default"])(_this2, "translatedPermissionLevel", function (permission) {
+      return (0, _defineProperty2["default"])((0, _defineProperty2["default"])({}, _quizCommon.CAN_EDIT, (0, _formatMessage["default"])('edit')), _quizCommon.READ_ONLY, (0, _formatMessage["default"])('view'))[permission];
+    });
+    (0, _defineProperty2["default"])(_this2, "confirmPermissionChange", function (entity, permission) {
+      var confirmText = permission === _quizCommon.REMOVED_ACCESS ? (0, _formatMessage["default"])('You are about to remove { accessLevel } access for { entityTitle } to this bank.', {
+        accessLevel: _this2.translatedPermissionLevel(_this2.originalPermissionForEntity(entity)),
         entityTitle: entity.get('title')
-      }) : (0, _formatMessage.default)('You are about to change access level for { entityTitle } from { originalAccessLevel } to { permission }.', {
+      }) : (0, _formatMessage["default"])('You are about to change access level for { entityTitle } from { originalAccessLevel } to { permission }.', {
         entityTitle: entity.get('title'),
-        originalAccessLevel: _this.translatedPermissionLevel(_this.originalPermissionForEntity(entity)),
-        permission: _this.translatedPermissionLevel(permission)
+        originalAccessLevel: _this2.translatedPermissionLevel(_this2.originalPermissionForEntity(entity)),
+        permission: _this2.translatedPermissionLevel(permission)
       });
-      _this.props.withConfirm((0, _partial.default)(_this.updatePermission, entity, permission), {
-        title: (0, _formatMessage.default)('Change Permission'),
+      _this2.props.withConfirm((0, _partial["default"])(_this2.updatePermission, entity, permission), {
+        title: (0, _formatMessage["default"])('Change Permission'),
         text: confirmText,
-        continueText: (0, _formatMessage.default)('Confirm')
+        continueText: (0, _formatMessage["default"])('Confirm')
       });
-    };
-    _this.handleEntityPermissionChange = function (entity, permission) {
-      _this.confirmPermissionChange(entity, permission);
-    };
-    _this.toggleAccountShare = function (event) {
-      _this.setState(function (prevState) {
+    });
+    (0, _defineProperty2["default"])(_this2, "handleEntityPermissionChange", function (entity, permission) {
+      _this2.confirmPermissionChange(entity, permission);
+    });
+    (0, _defineProperty2["default"])(_this2, "toggleAccountShare", function (event) {
+      _this2.setState(function (prevState) {
         return {
-          accountPermission: _this.isSharedWithAccount(prevState) ? _quizCommon.REMOVED_ACCESS : _quizCommon.READ_ONLY
+          accountPermission: _this2.isSharedWithAccount(prevState) ? _quizCommon.REMOVED_ACCESS : _quizCommon.READ_ONLY
         };
       });
-    };
-    _this.handleAccountPermissionChange = function (e, _ref6) {
+    });
+    (0, _defineProperty2["default"])(_this2, "handleAccountPermissionChange", function (e, _ref6) {
       var value = _ref6.value;
-      return _this.setState({
+      return _this2.setState({
         accountPermission: value
       });
-    };
-    _this.handleShareListRef = function (node) {
-      _this.shareListRef = node;
-    };
-    _this.handleShareButtonRef = function (node) {
-      _this.shareButtonRef = node;
-    };
-    _this.renderSearchSection = function (searchType) {
-      if (_this.props.bank.canEdit()) {
-        return (0, _emotion.jsx)(_react.default.Fragment, null, (0, _emotion.jsx)(_uiGrid.Grid, {
+    });
+    (0, _defineProperty2["default"])(_this2, "handleShareListRef", function (node) {
+      _this2.shareListRef = node;
+    });
+    (0, _defineProperty2["default"])(_this2, "handleShareButtonRef", function (node) {
+      _this2.shareButtonRef = node;
+    });
+    (0, _defineProperty2["default"])(_this2, "renderSearchSection", function (searchType) {
+      if (_this2.props.bank.canEdit()) {
+        return (0, _emotion.jsx)(_react["default"].Fragment, null, (0, _emotion.jsx)(_uiGrid.Grid, {
           vAlign: "bottom",
           colSpacing: "small"
-        }, (0, _emotion.jsx)(_uiGrid.Grid.Row, null, (0, _emotion.jsx)(_uiGrid.Grid.Col, null, (0, _emotion.jsx)(_index2.default, {
-          getShareableCourses: _this.props.getShareableCourses,
-          getShareableUsers: _this.props.getShareableUsers,
-          getShareableSubaccounts: _this.props.getShareableSubaccounts,
-          minChars: _this.props.minChars,
-          onSelectionChange: _this.handleSearchSelectionChange,
+        }, (0, _emotion.jsx)(_uiGrid.Grid.Row, null, (0, _emotion.jsx)(_uiGrid.Grid.Col, null, (0, _emotion.jsx)(_AsyncSearch["default"], {
+          getShareableCourses: _this2.props.getShareableCourses,
+          getShareableUsers: _this2.props.getShareableUsers,
+          getShareableSubaccounts: _this2.props.getShareableSubaccounts,
+          minChars: _this2.props.minChars,
+          onSelectionChange: _this2.handleSearchSelectionChange,
           searchType: searchType,
-          selectedOption: _this.state.searchSelection,
-          selectionFilter: _this.handleSearchFilter
+          selectedOption: _this2.state.searchSelection,
+          selectionFilter: _this2.handleSearchFilter
         })), (0, _emotion.jsx)(_uiGrid.Grid.Col, {
           width: "auto"
         }, (0, _emotion.jsx)(_quizCommon.SimpleSelect, {
-          onChange: _this.handleSearchPermissionChange,
-          value: _this.state.searchPermission,
-          renderLabel: (0, _formatMessage.default)('Access')
+          onChange: _this2.handleSearchPermissionChange,
+          value: _this2.state.searchPermission,
+          renderLabel: (0, _formatMessage["default"])('Access')
         }, (0, _emotion.jsx)(_quizCommon.SimpleSelect.Option, {
           id: "sharing-modal-search-section-select-option-can-view",
           value: _quizCommon.READ_ONLY
-        }, (0, _formatMessage.default)('Can view')), (0, _emotion.jsx)(_quizCommon.SimpleSelect.Option, {
+        }, (0, _formatMessage["default"])('Can view')), (0, _emotion.jsx)(_quizCommon.SimpleSelect.Option, {
           id: "sharing-modal-search-section-select-option-can-edit",
           value: _quizCommon.CAN_EDIT
-        }, (0, _formatMessage.default)('Can edit')))), (0, _emotion.jsx)(_uiGrid.Grid.Col, {
+        }, (0, _formatMessage["default"])('Can edit')))), (0, _emotion.jsx)(_uiGrid.Grid.Col, {
           width: "auto"
         }, (0, _emotion.jsx)(_uiButtons.Button, {
           "data-automation": "sdk-shared-bank-add-user-button",
-          ref: _this.handleShareButtonRef,
-          onClick: _this.handleShare,
-          color: _this.state.searchSelection.length ? 'success' : 'secondary'
-        }, (0, _formatMessage.default)('Add'))))), (0, _emotion.jsx)("div", {
-          css: _this.props.styles.separator
+          ref: _this2.handleShareButtonRef,
+          onClick: _this2.handleShare,
+          color: _this2.state.searchSelection.length ? 'success' : 'secondary'
+        }, (0, _formatMessage["default"])('Add'))))), (0, _emotion.jsx)("div", {
+          css: _this2.props.styles.separator
         }));
       }
-    };
-    _this.renderShareList = function (entities) {
-      return (0, _emotion.jsx)(_index.default, {
-        canEdit: _this.props.bank.canEdit(),
+    });
+    (0, _defineProperty2["default"])(_this2, "renderShareList", function (entities) {
+      return (0, _emotion.jsx)(_ShareList["default"], {
+        canEdit: _this2.props.bank.canEdit(),
         entities: entities,
-        onPermissionChange: _this.handleEntityPermissionChange,
-        onEntityRemove: _this.handleEntityRemove,
-        sharedBanks: _this.props.sharedBanks
+        onPermissionChange: _this2.handleEntityPermissionChange,
+        onEntityRemove: _this2.handleEntityRemove,
+        sharedBanks: _this2.props.sharedBanks
       });
-    };
-    return _this;
+    });
+    return _this2;
   }
-  (0, _createClass2.default)(SharingModalPresenter, [{
+  (0, _inherits2["default"])(SharingModalPresenter, _Component);
+  return (0, _createClass2["default"])(SharingModalPresenter, [{
     key: "componentDidMount",
     value: function componentDidMount() {
       this.setState({
@@ -365,12 +377,14 @@ var SharingModalPresenter = (_dec = (0, _quizCommon.withStyleOverrides)(_styles.
     }
   }, {
     key: "renderRootAccountSharing",
+    value:
     // =============
     //   RENDERING
     // =============
-    value: function renderRootAccountSharing() {
+
+    function renderRootAccountSharing() {
       var _this$props$currentUs;
-      return (0, _emotion.jsx)(_RootAccountSharing.default, {
+      return (0, _emotion.jsx)(_RootAccountSharing["default"], {
         accountName: (_this$props$currentUs = this.props.currentUser) === null || _this$props$currentUs === void 0 ? void 0 : _this$props$currentUs.account_name,
         onShareChange: this.toggleAccountShare,
         onShareTypeChange: this.handleAccountPermissionChange,
@@ -387,7 +401,7 @@ var SharingModalPresenter = (_dec = (0, _quizCommon.withStyleOverrides)(_styles.
       }, (0, _emotion.jsx)(_uiTabs.Tabs, {
         onRequestTabChange: this.handleTabChange
       }, (0, _emotion.jsx)(_uiTabs.Tabs.Panel, {
-        renderTitle: (0, _formatMessage.default)('People ({ peopleCount })', {
+        renderTitle: (0, _formatMessage["default"])('People ({ peopleCount })', {
           peopleCount: existingPeople.size
         }),
         isSelected: this.state.selectedTabIndex === 0,
@@ -396,8 +410,8 @@ var SharingModalPresenter = (_dec = (0, _quizCommon.withStyleOverrides)(_styles.
         as: "div",
         weight: "bold",
         lineHeight: "double"
-      }, (0, _formatMessage.default)('Currently shared with')), this.renderShareList(existingPeople)), (0, _emotion.jsx)(_uiTabs.Tabs.Panel, {
-        renderTitle: (0, _formatMessage.default)('Courses ({ coursesCount })', {
+      }, (0, _formatMessage["default"])('Currently shared with')), this.renderShareList(existingPeople)), (0, _emotion.jsx)(_uiTabs.Tabs.Panel, {
+        renderTitle: (0, _formatMessage["default"])('Courses ({ coursesCount })', {
           coursesCount: existingCourses.size
         }),
         isSelected: this.state.selectedTabIndex === 1,
@@ -406,8 +420,8 @@ var SharingModalPresenter = (_dec = (0, _quizCommon.withStyleOverrides)(_styles.
         as: "div",
         weight: "bold",
         lineHeight: "double"
-      }, (0, _formatMessage.default)('Currently shared with')), this.renderShareList(existingCourses)), ((currentUser === null || currentUser === void 0 ? void 0 : currentUser.bank_admin) || (currentUser === null || currentUser === void 0 ? void 0 : currentUser.can_share_banks_with_subaccounts)) && (0, _emotion.jsx)(_uiTabs.Tabs.Panel, {
-        renderTitle: (0, _formatMessage.default)('Accounts ({ accountsCount })', {
+      }, (0, _formatMessage["default"])('Currently shared with')), this.renderShareList(existingCourses)), ((currentUser === null || currentUser === void 0 ? void 0 : currentUser.bank_admin) || (currentUser === null || currentUser === void 0 ? void 0 : currentUser.can_share_banks_with_subaccounts)) && (0, _emotion.jsx)(_uiTabs.Tabs.Panel, {
+        renderTitle: (0, _formatMessage["default"])('Accounts ({ accountsCount })', {
           accountsCount: existingAccounts.size
         }),
         isSelected: this.state.selectedTabIndex === 2,
@@ -416,7 +430,7 @@ var SharingModalPresenter = (_dec = (0, _quizCommon.withStyleOverrides)(_styles.
         as: "div",
         weight: "bold",
         lineHeight: "double"
-      }, (0, _formatMessage.default)('Currently shared with')), this.renderShareList(existingAccounts))));
+      }, (0, _formatMessage["default"])('Currently shared with')), this.renderShareList(existingAccounts))));
     }
   }, {
     key: "renderOriginalDesignEntities",
@@ -426,7 +440,7 @@ var SharingModalPresenter = (_dec = (0, _quizCommon.withStyleOverrides)(_styles.
       }, (0, _emotion.jsx)(_uiText.Text, {
         as: "div",
         weight: "bold"
-      }, (0, _formatMessage.default)('Currently shared with')), (0, _emotion.jsx)(_uiView.View, {
+      }, (0, _formatMessage["default"])('Currently shared with')), (0, _emotion.jsx)(_uiView.View, {
         as: "div",
         "data-automation": "sdk-shared-bank-user-list"
       }, !this.state.newEntities.isEmpty() && (0, _emotion.jsx)(_uiView.View, {
@@ -435,13 +449,13 @@ var SharingModalPresenter = (_dec = (0, _quizCommon.withStyleOverrides)(_styles.
       }, this.renderShareList(this.state.newEntities)), (0, _emotion.jsx)(_uiTabs.Tabs, {
         onRequestTabChange: this.handleTabChange
       }, (0, _emotion.jsx)(_uiTabs.Tabs.Panel, {
-        renderTitle: (0, _formatMessage.default)('People ({ peopleCount })', {
+        renderTitle: (0, _formatMessage["default"])('People ({ peopleCount })', {
           peopleCount: existingPeople.size
         }),
         isSelected: this.state.selectedTabIndex === 0,
         padding: "large small small small"
       }, this.renderShareList(existingPeople)), !existingCourses.isEmpty() && (0, _emotion.jsx)(_uiTabs.Tabs.Panel, {
-        renderTitle: (0, _formatMessage.default)('Courses ({ coursesCount })', {
+        renderTitle: (0, _formatMessage["default"])('Courses ({ coursesCount })', {
           coursesCount: existingCourses.size
         }),
         isSelected: this.state.selectedTabIndex === 1,
@@ -475,7 +489,7 @@ var SharingModalPresenter = (_dec = (0, _quizCommon.withStyleOverrides)(_styles.
         color: "primary",
         margin: "0 x-small 0 0",
         onClick: this.handleDismiss
-      }, (0, _formatMessage.default)('Close'));
+      }, (0, _formatMessage["default"])('Close'));
     }
   }, {
     key: "render",
@@ -484,55 +498,53 @@ var SharingModalPresenter = (_dec = (0, _quizCommon.withStyleOverrides)(_styles.
         open: this.props.isOpen,
         onDismiss: this.handleDismiss,
         size: "medium",
-        label: (0, _formatMessage.default)('Sharing'),
+        label: (0, _formatMessage["default"])('Sharing'),
         shouldCloseOnDocumentClick: true,
         onOpen: this.checkForSharedBanks
       }, (0, _emotion.jsx)(_quizCommon.ModalHeader, null, (0, _emotion.jsx)(_uiHeading.Heading, null, this.props.bank.title), (0, _emotion.jsx)(_uiButtons.CloseButton, {
         onClick: this.handleDismiss,
         placement: "end",
         offset: "medium",
-        screenReaderLabel: (0, _formatMessage.default)('Close')
-      })), (0, _emotion.jsx)(_quizCommon.ModalBody, null, this.state.shares.size >= 0 ? this.renderEntitiesSection() : _ref7), (0, _emotion.jsx)(_quizCommon.ModalFooter, null, this.renderFooter()));
+        screenReaderLabel: (0, _formatMessage["default"])('Close')
+      })), (0, _emotion.jsx)(_quizCommon.ModalBody, null, this.state.shares.size >= 0 ? this.renderEntitiesSection() : (0, _emotion.jsx)(_Spinner["default"], null)), (0, _emotion.jsx)(_quizCommon.ModalFooter, null, this.renderFooter()));
     }
   }]);
-  SharingModalPresenter.displayName = "SharingModalPresenter";
-  return SharingModalPresenter;
-}(_react.Component), _SharingModalPresenter.displayName = 'SharingModalPresenter', _SharingModalPresenter.componentId = "Quizzes".concat(_SharingModalPresenter.displayName), _SharingModalPresenter.propTypes = {
-  appContainer: _CustomPropTypes.default.selectors.isRequired,
-  bank: _reactImmutableProptypes.default.record.isRequired,
-  currentUser: _propTypes.default.shape({
-    bank_admin: _propTypes.default.bool,
-    can_share_banks_with_subaccounts: _propTypes.default.bool,
-    email: _propTypes.default.string,
-    enrollment_names: _propTypes.default.arrayOf(_propTypes.default.string),
-    full_name: _propTypes.default.string,
-    uuid: _propTypes.default.string,
-    account_name: _propTypes.default.string
+}(_react.Component), (0, _defineProperty2["default"])(_SharingModalPresenter, "displayName", 'SharingModalPresenter'), (0, _defineProperty2["default"])(_SharingModalPresenter, "componentId", "Quizzes".concat(_SharingModalPresenter.displayName)), (0, _defineProperty2["default"])(_SharingModalPresenter, "propTypes", {
+  appContainer: _CustomPropTypes["default"].selectors.isRequired,
+  bank: _reactImmutableProptypes["default"].record.isRequired,
+  currentUser: _propTypes["default"].shape({
+    bank_admin: _propTypes["default"].bool,
+    can_share_banks_with_subaccounts: _propTypes["default"].bool,
+    email: _propTypes["default"].string,
+    enrollment_names: _propTypes["default"].arrayOf(_propTypes["default"].string),
+    full_name: _propTypes["default"].string,
+    uuid: _propTypes["default"].string,
+    account_name: _propTypes["default"].string
   }),
-  focusCreateBankButton: _propTypes.default.func.isRequired,
-  getBank: _propTypes.default.func.isRequired,
-  getShareableCourses: _propTypes.default.func.isRequired,
-  getCourseInfo: _propTypes.default.func.isRequired,
-  getShareableUsers: _propTypes.default.func.isRequired,
-  getSharedBanks: _propTypes.default.func.isRequired,
-  getUserInfo: _propTypes.default.func.isRequired,
-  getShareableSubaccounts: _propTypes.default.func.isRequired,
-  getSubaccountInfo: _propTypes.default.func.isRequired,
-  isOpen: _propTypes.default.bool,
-  minChars: _propTypes.default.number,
-  modalTrigger: _propTypes.default.node,
+  focusCreateBankButton: _propTypes["default"].func.isRequired,
+  getBank: _propTypes["default"].func.isRequired,
+  getShareableCourses: _propTypes["default"].func.isRequired,
+  getCourseInfo: _propTypes["default"].func.isRequired,
+  getShareableUsers: _propTypes["default"].func.isRequired,
+  getSharedBanks: _propTypes["default"].func.isRequired,
+  getUserInfo: _propTypes["default"].func.isRequired,
+  getShareableSubaccounts: _propTypes["default"].func.isRequired,
+  getSubaccountInfo: _propTypes["default"].func.isRequired,
+  isOpen: _propTypes["default"].bool,
+  minChars: _propTypes["default"].number,
+  modalTrigger: _propTypes["default"].node,
   // html or react element that triggered this Modal
-  onDismiss: _propTypes.default.func,
-  onShare: _propTypes.default.func,
-  removeSharedBank: _propTypes.default.func.isRequired,
-  shareBank: _propTypes.default.func.isRequired,
-  sharedBanks: _reactImmutableProptypes.default.list,
-  updateBank: _propTypes.default.func.isRequired,
-  updateSharedBankPermission: _propTypes.default.func.isRequired,
-  updateSharedCount: _propTypes.default.func,
-  withConfirm: _propTypes.default.func.isRequired,
-  styles: _propTypes.default.object
-}, _SharingModalPresenter.defaultProps = {
+  onDismiss: _propTypes["default"].func,
+  onShare: _propTypes["default"].func,
+  removeSharedBank: _propTypes["default"].func.isRequired,
+  shareBank: _propTypes["default"].func.isRequired,
+  sharedBanks: _reactImmutableProptypes["default"].list,
+  updateBank: _propTypes["default"].func.isRequired,
+  updateSharedBankPermission: _propTypes["default"].func.isRequired,
+  updateSharedCount: _propTypes["default"].func,
+  withConfirm: _propTypes["default"].func.isRequired,
+  styles: _propTypes["default"].object
+}), (0, _defineProperty2["default"])(_SharingModalPresenter, "defaultProps", {
   bank: null,
   currentUser: null,
   isOpen: false,
@@ -542,7 +554,5 @@ var SharingModalPresenter = (_dec = (0, _quizCommon.withStyleOverrides)(_styles.
   onShare: function onShare() {},
   sharedBanks: (0, _immutable.List)(),
   updateSharedCount: Function.prototype
-}, _SharingModalPresenter)) || _class);
-exports.SharingModalPresenter = SharingModalPresenter;
-var _default = SharingModalPresenter;
-exports.default = _default;
+}), _SharingModalPresenter)) || _class);
+var _default = exports["default"] = SharingModalPresenter;