@instructure/quiz-core 17.58.2-rc.0 → 17.58.2-rc.10

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

@@ -9,6 +9,12 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = exports.Bank = void 0;
 
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+
+var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
+
+var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
+
 var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
 
 var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
@@ -27,6 +33,8 @@ var _propTypes = _interopRequireDefault(require("prop-types"));
 
 var _reactImmutableProptypes = _interopRequireDefault(require("react-immutable-proptypes"));
 
+var _partial = _interopRequireDefault(require("lodash/partial"));
+
 var _uiIcons = require("@instructure/ui-icons");
 
 var _uiBreadcrumb = require("@instructure/ui-breadcrumb");
@@ -39,6 +47,10 @@ var _uiA11yContent = require("@instructure/ui-a11y-content");
 
 var _uiThemeable = require("@instructure/ui-themeable");
 
+var _uiCheckbox = require("@instructure/ui-checkbox");
+
+var _uiView = require("@instructure/ui-view");
+
 var _Bank = _interopRequireDefault(require("../../../common/records/Bank.js"));
 
 var _index = _interopRequireDefault(require("../../../common/components/layout/Page/index.js"));
@@ -94,6 +106,10 @@ var Bank = (_dec = (0, _uiThemeable.themeable)(_theme.default, styles), _dec(_cl
     }
 
     _this = _super.call.apply(_super, [this].concat(_args));
+    _this.state = {
+      sharedWithCourse: false,
+      shareWithCourseCheckboxDisabled: true
+    };
 
     _this.openAddBankEntryModal = function () {
       _this.props.openModal(_quizCommon.ADD_BANK_ENTRY_MODAL, {
@@ -113,6 +129,74 @@ var Bank = (_dec = (0, _uiThemeable.themeable)(_theme.default, styles), _dec(_cl
       _this.createBankEntryButton = c;
     };
 
+    _this.toggleCheckbox = function () {
+      // disable until request resolves
+      _this.setState({
+        shareWithCourseCheckboxDisabled: true
+      });
+
+      _this.changeSharedPermissions();
+    };
+
+    _this.unshareBankWithCourse = /*#__PURE__*/function () {
+      var _ref = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee(sharedBank) {
+        var _this$props, updateSharedBankPermission, bankId, getSharedBank, scope;
+
+        return _regenerator.default.wrap(function _callee$(_context) {
+          while (1) {
+            switch (_context.prev = _context.next) {
+              case 0:
+                _this$props = _this.props, updateSharedBankPermission = _this$props.updateSharedBankPermission, bankId = _this$props.bankId, getSharedBank = _this$props.getSharedBank, scope = _this$props.scope;
+                _context.next = 3;
+                return updateSharedBankPermission(bankId, sharedBank.get('id'), _quizCommon.REMOVED_ACCESS);
+
+              case 3:
+                getSharedBank(bankId, scope.type, scope.uuid).catch(function (err) {
+                  // make sure the user still has access to the bank
+                  if (err.response.status === 401) {
+                    _this.props.navigateToBanks();
+                  }
+                });
+
+              case 4:
+              case "end":
+                return _context.stop();
+            }
+          }
+        }, _callee);
+      }));
+
+      return function (_x) {
+        return _ref.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.confirmUnshareBankWithCourse = function () {
+      var confirmText = (0, _formatMessage.default)('You are about to remove { accessLevel } access for { entityTitle } to this bank.', {
+        accessLevel: _this.translatedPermissionLevel(_this.props.courseSharedBank.get('permission')),
+        entityTitle: _this.props.scope.title
+      });
+
+      _this.props.withConfirm((0, _partial.default)(_this.unshareBankWithCourse, _this.props.courseSharedBank), {
+        title: (0, _formatMessage.default)('Unshare Bank with Course'),
+        text: confirmText,
+        continueText: (0, _formatMessage.default)('Confirm'),
+        onCancel: _this.onCancelUnshareBankWithCourse
+      });
+    };
+
+    _this.onCancelUnshareBankWithCourse = function () {
+      _this.setState({
+        shareWithCourseCheckboxDisabled: false
+      });
+    };
+
     _this.addBankToQuiz = function () {
       var newEntry = _QuizEntry.default.create({
         entryId: _this.props.bankId,
@@ -138,8 +222,8 @@ var Bank = (_dec = (0, _uiThemeable.themeable)(_theme.default, styles), _dec(_cl
       }, _this.renderNewBankEntryButton());
     };
 
-    _this.announceResults = function (_ref) {
-      var totalPages = _ref.totalPages;
+    _this.announceResults = function (_ref2) {
+      var totalPages = _ref2.totalPages;
       var message = (0, _formatMessage.default)("{\n      count, plural,\n         =0 {No search results found}\n        one {Displaying one page of results}\n      other {Displaying # pages of results}\n    }", {
         count: totalPages
       }); // Audibly announce when search results are ready.
@@ -153,10 +237,10 @@ var Bank = (_dec = (0, _uiThemeable.themeable)(_theme.default, styles), _dec(_cl
     _this.debouncedAnnounceResults = (0, _debounce.default)(_this.announceResults, 1000);
 
     _this.getPage = function (page, search) {
-      var _this$props = _this.props,
-          getBankEntries = _this$props.getBankEntries,
-          bankId = _this$props.bankId,
-          useBankSearch = _this$props.useBankSearch;
+      var _this$props2 = _this.props,
+          getBankEntries = _this$props2.getBankEntries,
+          bankId = _this$props2.bankId,
+          useBankSearch = _this$props2.useBankSearch;
       var text = search.get('text');
       var interactionTypes = search.get('interactionTypes', immutable.Set()).toJS();
       var tagIds = search.get('tags', []).map(function (tag) {
@@ -211,19 +295,68 @@ var Bank = (_dec = (0, _uiThemeable.themeable)(_theme.default, styles), _dec(_cl
 
       if (this.props.onError) {
         this.props.getBank(this.props.bankId).catch(this.props.onError);
+
+        if (this.shouldRenderShareWithCourseCheckbox()) {
+          this.props.getSharedBank(this.props.bankId, this.props.scope.type, this.props.scope.uuid).catch(this.props.onError);
+        }
       } else {
         this.props.getBank(this.props.bankId);
+
+        if (this.shouldRenderShareWithCourseCheckbox()) {
+          this.props.getSharedBank(this.props.bankId, this.props.scope.type, this.props.scope.uuid);
+        }
+      } // when courseSharedBank is already loaded
+
+
+      if (this.props.courseSharedBank) {
+        this.setShareWithCourseCheckbox();
       }
     }
+  }, {
+    key: "componentDidUpdate",
+    value: function componentDidUpdate(prevProps) {
+      var _prevProps$courseShar, _this$props$courseSha;
+
+      var permissionChanged = ((_prevProps$courseShar = prevProps.courseSharedBank) === null || _prevProps$courseShar === void 0 ? void 0 : _prevProps$courseShar.get('permission')) !== ((_this$props$courseSha = this.props.courseSharedBank) === null || _this$props$courseSha === void 0 ? void 0 : _this$props$courseSha.get('permission'));
+
+      if (this.props.courseSharedBank && permissionChanged) {
+        this.setShareWithCourseCheckbox();
+      }
+    }
+  }, {
+    key: "setShareWithCourseCheckbox",
+    value: function setShareWithCourseCheckbox() {
+      if (this.props.courseSharedBank.get('permission') === _quizCommon.REMOVED_ACCESS) {
+        this.setState({
+          sharedWithCourse: false,
+          shareWithCourseCheckboxDisabled: false
+        });
+      } else {
+        this.setState({
+          sharedWithCourse: true,
+          shareWithCourseCheckboxDisabled: false
+        });
+      }
+    }
+  }, {
+    key: "componentWillUnmount",
+    value: function componentWillUnmount() {
+      this.props.removeSharedBank(this.placeholderCourseSharedBankKey());
+    }
+  }, {
+    key: "placeholderCourseSharedBankKey",
+    value: function placeholderCourseSharedBankKey() {
+      return "notshared_".concat(this.props.bankId, "_").concat(this.props.scope.uuid);
+    }
   }, {
     key: "renderNav",
     value: function renderNav() {
-      var _this$props2 = this.props,
-          scope = _this$props2.scope,
-          closeTray = _this$props2.closeTray,
-          navigateToBanks = _this$props2.navigateToBanks,
-          navigateToBuild = _this$props2.navigateToBuild,
-          returnToUrl = _this$props2.returnToUrl;
+      var _this$props3 = this.props,
+          scope = _this$props3.scope,
+          closeTray = _this$props3.closeTray,
+          navigateToBanks = _this$props3.navigateToBanks,
+          navigateToBuild = _this$props3.navigateToBuild,
+          returnToUrl = _this$props3.returnToUrl;
       var isScopeEmpty = !Object.keys(scope).length;
       return /*#__PURE__*/_react.default.createElement(_index7.default, {
         closeTray: closeTray,
@@ -255,6 +388,50 @@ var Bank = (_dec = (0, _uiThemeable.themeable)(_theme.default, styles), _dec(_cl
         });
       }
     }
+  }, {
+    key: "changeSharedPermissions",
+    value: function changeSharedPermissions() {
+      if (this.props.bank.canEdit()) {
+        if (!this.state.sharedWithCourse) {
+          var shareBank = {
+            entityId: this.props.scope.uuid,
+            entityType: this.props.scope.type,
+            title: this.props.scope.title,
+            permission: _quizCommon.READ_ONLY,
+            bankId: this.props.bankId
+          };
+          this.props.removeSharedBank(this.placeholderCourseSharedBankKey());
+          this.props.shareBank(shareBank);
+        } else {
+          this.confirmUnshareBankWithCourse();
+        }
+      }
+    }
+  }, {
+    key: "shouldRenderShareWithCourseCheckbox",
+    value: function shouldRenderShareWithCourseCheckbox() {
+      return this.props.showShareBankFromTray && this.props.scope.type === 'course' && this.props.scope.title && this.props.scope.uuid;
+    }
+  }, {
+    key: "renderCheckbox",
+    value: function renderCheckbox() {
+      if (!this.shouldRenderShareWithCourseCheckbox()) {
+        return null;
+      }
+
+      var label = (0, _formatMessage.default)('Share with { courseName }', {
+        courseName: this.props.scope.title
+      });
+      return /*#__PURE__*/_react.default.createElement(_uiView.View, {
+        margin: "small 0",
+        as: "div"
+      }, /*#__PURE__*/_react.default.createElement(_uiCheckbox.Checkbox, {
+        checked: this.state.sharedWithCourse,
+        label: label,
+        onChange: this.toggleCheckbox,
+        disabled: this.props.bank.canEdit() ? this.state.shareWithCourseCheckboxDisabled : true
+      }));
+    }
   }, {
     key: "renderModals",
     value: function renderModals() {
@@ -330,7 +507,7 @@ var Bank = (_dec = (0, _uiThemeable.themeable)(_theme.default, styles), _dec(_cl
     value: function render() {
       return /*#__PURE__*/_react.default.createElement(_index.default, null, this.renderModals(), this.renderNav(), /*#__PURE__*/_react.default.createElement("div", {
         className: styles.content
-      }, this.renderName(), /*#__PURE__*/_react.default.createElement("div", {
+      }, this.renderName(), this.renderCheckbox(), /*#__PURE__*/_react.default.createElement("div", {
         className: styles.topMenu
       }, this.renderTopLeftMenu(), this.renderTopRightMenu()), this.renderSearch(), /*#__PURE__*/_react.default.createElement(_index2.default, {
         empty: this.emptyLoadText(),
@@ -352,6 +529,7 @@ var Bank = (_dec = (0, _uiThemeable.themeable)(_theme.default, styles), _dec(_cl
   closeTray: _propTypes.default.func,
   getBank: _propTypes.default.func.isRequired,
   getBankEntries: _propTypes.default.func.isRequired,
+  getSharedBank: _propTypes.default.func.isRequired,
   isCompact: _propTypes.default.bool,
   isQuizContentLocked: _propTypes.default.bool.isRequired,
   navigateToBanks: _propTypes.default.func.isRequired,
@@ -360,20 +538,26 @@ var Bank = (_dec = (0, _uiThemeable.themeable)(_theme.default, styles), _dec(_cl
   // can be from consumer
   navigateToBuild: _propTypes.default.func,
   // from consumer
-  scope: _propTypes.default.objectOf(_propTypes.default.shape({
+  scope: _propTypes.default.shape({
     type: _propTypes.default.string,
     uuid: _propTypes.default.string,
     title: _propTypes.default.string
-  })),
+  }),
+  courseSharedBank: _reactImmutableProptypes.default.map,
   returnToUrl: _propTypes.default.string,
   // from consumer
   onError: _propTypes.default.func,
   openModal: _propTypes.default.func.isRequired,
   position: _propTypes.default.number,
+  removeSharedBank: _propTypes.default.func.isRequired,
   resetSearch: _propTypes.default.func.isRequired,
   screenreaderNotification: _propTypes.default.func.isRequired,
   search: _reactImmutableProptypes.default.map.isRequired,
-  stimulusId: _propTypes.default.string
+  shareBank: _propTypes.default.func.isRequired,
+  stimulusId: _propTypes.default.string,
+  showShareBankFromTray: _propTypes.default.bool,
+  updateSharedBankPermission: _propTypes.default.func.isRequired,
+  withConfirm: _propTypes.default.func.isRequired
 }, _class2.defaultProps = {
   activeQuizId: null,
   addEntryToQuiz: null,
@@ -387,7 +571,9 @@ var Bank = (_dec = (0, _uiThemeable.themeable)(_theme.default, styles), _dec(_cl
   stimulusId: null,
   scope: {},
   returnToUrl: null,
-  isQuizContentLocked: false
+  isQuizContentLocked: false,
+  showShareBankFromTray: false,
+  courseSharedBank: null
 }, _temp)) || _class);
 exports.Bank = Bank;
 var _default = Bank;

package/lib/building/components/layout/header/BuildingButtons/index.js

@@ -32,6 +32,8 @@ var _featureCheck = require("../../../../../common/util/featureCheck.js");
 
 var _quizExport = require("../../../../../common/actions/quizExport.js");
 
+var _alerts = require("../../../../../common/actions/alerts.js");
+
 function mapStateToProps(state) {
   var quiz = (0, _quizzes.getActiveQuiz)(state);
   return {
@@ -48,6 +50,7 @@ function mapStateToProps(state) {
 
 var mapDispatchToProps = function mapDispatchToProps(dispatch) {
   return {
+    addInfo: (0, _redux.bindActionCreators)(_alerts.addInfo, dispatch),
     openBanksTray: (0, _redux.bindActionCreators)(_ui.set.bind(void 0, _quizCommon.BUILD_TRAY_OPEN, true), dispatch),
     setBanksTrayButtonRef: (0, _redux.bindActionCreators)((0, _partial.default)(_ui.set, _quizCommon.BUILD_TRAY_BUTTON_REF), dispatch),
     startExport: (0, _redux.bindActionCreators)(_quizExport.startQuizExportJob, dispatch),

package/lib/building/components/layout/header/BuildingButtons/presenter.js

@@ -66,6 +66,10 @@ var BuildingButtons = (_dec = (0, _uiThemeable.themeable)(_theme.default, styles
 
     _this = _super.call.apply(_super, [this].concat(args));
 
+    _this.quizExportAlert = function () {
+      _this.props.addInfo((0, _formatMessage.default)("The export process has been started. This can take a while for larger quizzes.\n      You can leave the page and you'll get notified when the export is completed."));
+    };
+
     _this.openBanksTray = function () {
       _this.props.setBanksTrayButtonRef(_this.banksTrayButton);
 
@@ -87,6 +91,8 @@ var BuildingButtons = (_dec = (0, _uiThemeable.themeable)(_theme.default, styles
           quizzes: [activeQuizId]
         };
 
+        _this.quizExportAlert();
+
         _this.props.contentExport({
           contextUuid: contextUuid,
           exportSettings: exportSettings
@@ -220,6 +226,7 @@ var BuildingButtons = (_dec = (0, _uiThemeable.themeable)(_theme.default, styles
   return BuildingButtons;
 }(_react.Component), _class2.propTypes = {
   app: _propTypes.default.string,
+  addInfo: _propTypes.default.func,
   activeQuizId: _propTypes.default.string,
   canExport: _propTypes.default.bool.isRequired,
   canImport: _propTypes.default.bool.isRequired,
@@ -240,6 +247,7 @@ var BuildingButtons = (_dec = (0, _uiThemeable.themeable)(_theme.default, styles
   contextUuid: _propTypes.default.string
 }, _class2.defaultProps = {
   activeQuizId: null,
+  addInfo: function addInfo() {},
   app: null,
   contentExportEnabled: false,
   contentExport: null,

package/lib/building/components/resources/BanksTray/presenter.js

@@ -123,7 +123,8 @@ var BanksTray = /*#__PURE__*/function (_Component) {
             closeTray: this.closeTray,
             bankId: activeBankId,
             navigateToBanks: this.clearActiveBank,
-            navigateToBankEntry: this.props.newActiveBankEntry
+            navigateToBankEntry: this.props.newActiveBankEntry,
+            scope: this.props.itemBanksScope
           });
         }
       } else {

package/lib/common/actions/sharedBanks.js

@@ -28,10 +28,10 @@ var updateSharedBankPermission = function updateSharedBankPermission(sharedBankI
 
 exports.updateSharedBankPermission = updateSharedBankPermission;
 
-var removeSharedBank = function removeSharedBank(bankId) {
+var removeSharedBank = function removeSharedBank(sharedBankId) {
   return {
     type: _quizCommon.REMOVE_SHARED_BANK,
-    payload: bankId
+    payload: sharedBankId
   };
 };