@instructure/quiz-core 17.17.1-rc.2 → 17.17.3-rc.0

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

@@ -1,530 +0,0 @@
-"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"));
-
-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 _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 _immutable = require("immutable");
-
-var _reactImmutableProptypes = _interopRequireDefault(require("react-immutable-proptypes"));
-
-var _quizCommon = require("@instructure/quiz-common");
-
-var _uiHeading = require("@instructure/ui-heading");
-
-var _uiButtons = require("@instructure/ui-buttons");
-
-var _uiIcons = require("@instructure/ui-icons");
-
-var _uiCheckbox = require("@instructure/ui-checkbox");
-
-var _uiView = require("@instructure/ui-view");
-
-var _uiGrid = require("@instructure/ui-grid");
-
-var _uiA11yContent = require("@instructure/ui-a11y-content");
-
-var _uiSimpleSelect = require("@instructure/ui-simple-select");
-
-var _uiThemeable = require("@instructure/ui-themeable");
-
-var _ElementsForSelectors = _interopRequireDefault(require("../../../common/util/ElementsForSelectors"));
-
-var _CustomPropTypes = _interopRequireDefault(require("../../../common/util/CustomPropTypes"));
-
-var _ShareList = _interopRequireDefault(require("./ShareList"));
-
-var _asyncSearch = _interopRequireDefault(require("./asyncSearch"));
-
-var _Spinner = _interopRequireDefault(require("../../../common/components/shared/spinner/Spinner"));
-
-var _theme = _interopRequireDefault(require("./theme"));
-
-var _formatMessage = _interopRequireDefault(require("@instructure/quiz-i18n/es/format-message"));
-
-var _dec, _class, _class2, _temp;
-
-var styles = {
-  componentId: 'ccksF',
-  template: function template(theme) {
-    return "\n\n.ccksF_fatK{border-bottom:solid ".concat(theme.separatorBorderWidth || 'inherit', ";border-color:").concat(theme.separatorColor || 'inherit', ";margin:").concat(theme.separatorMargin || 'inherit', " 0;padding:0;width:100%}");
-  },
-  'separator': 'ccksF_fatK'
-};
-
-var noop = function noop() {};
-
-var _ref5 = /*#__PURE__*/_react.default.createElement(_uiGrid.Grid.Col, {
-  width: "auto"
-}, /*#__PURE__*/_react.default.createElement(_uiIcons.IconAdminLine, {
-  size: "medium"
-}));
-
-var _ref6 = /*#__PURE__*/_react.default.createElement(_Spinner.default, null);
-
-var SharingModalPresenter = (_dec = (0, _uiThemeable.themeable)(_theme.default, styles), _dec(_class = (_temp = _class2 = /*#__PURE__*/function (_Component) {
-  (0, _inherits2.default)(SharingModalPresenter, _Component);
-
-  var _super = (0, _createSuper2.default)(SharingModalPresenter);
-
-  function SharingModalPresenter() {
-    var _this;
-
-    (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 = {
-      accountPermission: null,
-      shares: (0, _immutable.List)(),
-      newEntities: (0, _immutable.List)(),
-      searchSelection: [],
-      searchPermission: _quizCommon.READ_ONLY,
-      entitiesWithChangedPermission: {}
-    };
-    _this.shareListRef = null;
-    _this.shareButtonRef = null;
-
-    _this.applicationElement = function () {
-      return (0, _ElementsForSelectors.default)(_this.props.appContainer);
-    };
-
-    _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);
-      } else {
-        // eslint-disable-next-line react/no-did-mount-set-state
-        _this.setState({
-          shares: _this.props.sharedBanks
-        });
-      }
-    };
-
-    _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();
-      } else {
-        setTimeout(_this.props.focusCreateBankButton, 100);
-      } // removes the creator's temporary sharedBank record
-
-
-      _this.props.removeSharedBank('-1');
-    };
-
-    _this.numEntitiesToRemove = function () {
-      var permissions = Object.values(_this.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;
-      }); // 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'];
-
-      if (newCreatorPerm && newCreatorPerm !== _quizCommon.CAN_EDIT) {
-        var creatorSharedBank = _this.props.sharedBanks.find(function (sharedBank) {
-          return sharedBank.get('id') == '-1';
-        });
-
-        newEntities = newEntities.push((0, _immutable.Map)((0, _objectSpread2.default)((0, _objectSpread2.default)({}, creatorSharedBank.toJS()), {}, {
-          permission: newCreatorPerm
-        })));
-      }
-
-      return newEntities;
-    };
-
-    _this.isSharedWithAccount = function () {
-      var state = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : _this.state;
-      return [_quizCommon.READ_ONLY, _quizCommon.CAN_EDIT].includes(state.accountPermission);
-    };
-
-    _this.handleDismiss = function (e) {
-      _this.props.updateSharedCount(null);
-
-      _this.modalDismissCleanup();
-    };
-
-    _this.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));
-      }
-
-      _this.newEntitiesToSubmit().forEach(function (entity) {
-        _this.props.onShare(entity.toJS());
-
-        var sharedBank = {
-          entityType: entity.get('entityType'),
-          entityId: entity.get('entityId'),
-          title: entity.get('title'),
-          bankId: _this.props.bank.id,
-          permission: entity.get('permission')
-        };
-        promises.push(_this.props.shareBank(sharedBank, _this.props.getUserInfo));
-      }); // call the update api if any shared bank permission was updated
-
-
-      Object.entries(_this.state.entitiesWithChangedPermission).forEach(function (_ref) {
-        var _ref2 = (0, _slicedToArray2.default)(_ref, 2),
-            sharedBankId = _ref2[0],
-            permission = _ref2[1];
-
-        var sharedBank = _this.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));
-        }
-      }); // 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);
-      });
-
-      _this.setState({
-        newEntities: (0, _immutable.List)()
-      });
-
-      _this.modalDismissCleanup(!!_this.numEntitiesToRemove());
-    };
-
-    _this.handleSearchSelectionChange = function (searchSelection) {
-      _this.setState({
-        searchSelection: searchSelection
-      });
-    };
-
-    _this.updateEntitiesCount = function () {
-      // state.shares is a list containing everyone in the list,
-      _this.props.updateSharedCount(_this.state.shares.size - _this.numEntitiesToRemove());
-    };
-
-    _this.handleEntityRemove = function (id, undoRemove) {
-      var originalEntity = _this.props.sharedBanks.find(function (sb) {
-        return sb.get('id') == id;
-      }) || (0, _immutable.Map)();
-      var originalPermission = originalEntity.get('permission', _quizCommon.CAN_EDIT);
-      var permission = undoRemove ? originalPermission : _quizCommon.REMOVED_ACCESS;
-
-      _this.setState(function (prevState) {
-        var sharesIndex = prevState.shares.findIndex(function (entity) {
-          return entity.get('id') == id;
-        });
-        var newEntitiesIndex = prevState.newEntities.findIndex(function (entity) {
-          return entity.get('id') == id;
-        });
-        var removedNewEntity = newEntitiesIndex > -1;
-        var newShares = removedNewEntity ? prevState.shares.delete(sharesIndex) : prevState.shares.setIn([sharesIndex, 'permission'], permission);
-        return {
-          shares: newShares,
-          newEntities: prevState.newEntities.delete(newEntitiesIndex),
-          entitiesWithChangedPermission: Object.assign({}, prevState.entitiesWithChangedPermission, (0, _defineProperty2.default)({}, id, permission))
-        };
-      }, _this.updateEntitiesCount);
-    };
-
-    _this.handleSearchPermissionChange = function (e, _ref3) {
-      var value = _ref3.value;
-      return _this.setState({
-        searchPermission: value
-      });
-    };
-
-    _this.handleSearchFilter = function (searchResults) {
-      return searchResults.filter(function (result) {
-        return !_this.state.shares.some(function (entity) {
-          return entity.get('entityId') === result.uuid;
-        }) && (result.uuid !== _this.props.bank.creator || _this.props.bank.sharedCount > 0);
-      });
-    };
-
-    _this.handleShare = function () {
-      var newEntities = (0, _immutable.List)(_this.state.searchSelection.map(function (entity) {
-        return (0, _immutable.Map)({
-          id: entity.uuid,
-          entityType: entity.entityType,
-          entityId: entity.uuid,
-          title: entity.fullName || entity.title,
-          avatar: entity.avatar,
-          email: entity.email,
-          permission: _this.state.searchPermission
-        });
-      }));
-
-      _this.setState({
-        searchSelection: [],
-        shares: newEntities.concat(_this.state.shares),
-        newEntities: newEntities.concat(_this.state.newEntities)
-      }, _this.updateEntitiesCount);
-    };
-
-    _this.handleEntityPermissionChange = function (entity, permission) {
-      _this.setState(function (prevState) {
-        var index = prevState.shares.findIndex(function (share) {
-          return share.get('id') === entity.get('id');
-        });
-        return {
-          shares: prevState.shares.setIn([index, 'permission'], permission),
-          entitiesWithChangedPermission: Object.assign({}, prevState.entitiesWithChangedPermission, (0, _defineProperty2.default)({}, entity.get('id'), permission))
-        };
-      });
-    };
-
-    _this.toggleAccountShare = function (event) {
-      _this.setState(function (prevState) {
-        return {
-          accountPermission: _this.isSharedWithAccount(prevState) ? _quizCommon.REMOVED_ACCESS : _quizCommon.READ_ONLY
-        };
-      });
-    };
-
-    _this.handleAccountPermissionChange = function (e, _ref4) {
-      var value = _ref4.value;
-      return _this.setState({
-        accountPermission: value
-      });
-    };
-
-    _this.handleShareListRef = function (node) {
-      _this.shareListRef = node;
-    };
-
-    _this.handleShareButtonRef = function (node) {
-      _this.shareButtonRef = node;
-    };
-
-    return _this;
-  }
-
-  (0, _createClass2.default)(SharingModalPresenter, [{
-    key: "componentDidMount",
-    value: function componentDidMount() {
-      this.setState({
-        accountPermission: this.props.bank.accountPermission,
-        shares: this.props.sharedBanks
-      });
-    }
-  }, {
-    key: "componentWillReceiveProps",
-    value: function componentWillReceiveProps(nextProps) {
-      this.setState({
-        accountPermission: nextProps.bank.accountPermission,
-        shares: nextProps.sharedBanks
-      });
-    } // =============
-    //   HELPERS
-    // =============
-
-  }, {
-    key: "renderAccountPermissions",
-    // =============
-    //   RENDERING
-    // =============
-    value: function renderAccountPermissions() {
-      var _this$props = this.props,
-          currentUser = _this$props.currentUser,
-          improvedBankSharingEnabled = _this$props.improvedBankSharingEnabled;
-      var roles = currentUser && currentUser.enrollment_names || [];
-
-      if (improvedBankSharingEnabled && roles.includes('admin')) {
-        return /*#__PURE__*/_react.default.createElement(_uiView.View, {
-          as: "div",
-          margin: "0 0 medium 0"
-        }, /*#__PURE__*/_react.default.createElement(_uiGrid.Grid, {
-          colSpacing: "small"
-        }, /*#__PURE__*/_react.default.createElement(_uiGrid.Grid.Row, null, _ref5, /*#__PURE__*/_react.default.createElement(_uiGrid.Grid.Col, null, /*#__PURE__*/_react.default.createElement(_uiView.View, {
-          as: "div",
-          padding: "0 0 x-small 0"
-        }, currentUser && currentUser.account_name || (0, _formatMessage.default)('Account')), /*#__PURE__*/_react.default.createElement(_uiCheckbox.Checkbox, {
-          label: (0, _formatMessage.default)('Share with Institution'),
-          variant: "toggle",
-          value: "accountPermission",
-          checked: this.isSharedWithAccount(),
-          onChange: this.toggleAccountShare
-        })), this.isSharedWithAccount() && /*#__PURE__*/_react.default.createElement(_uiGrid.Grid.Col, {
-          width: "auto"
-        }, /*#__PURE__*/_react.default.createElement(_uiSimpleSelect.SimpleSelect, {
-          onChange: this.handleAccountPermissionChange,
-          value: this.state.accountPermission,
-          renderLabel: /*#__PURE__*/_react.default.createElement(_uiA11yContent.ScreenReaderContent, null, (0, _formatMessage.default)('Access for account'))
-        }, /*#__PURE__*/_react.default.createElement(_uiSimpleSelect.SimpleSelect.Option, {
-          id: "sharing-modal-account-perm-select-option-can-view",
-          value: _quizCommon.READ_ONLY
-        }, (0, _formatMessage.default)('Can view')), /*#__PURE__*/_react.default.createElement(_uiSimpleSelect.SimpleSelect.Option, {
-          id: "sharing-modal-account-perm-select-option-can-edit",
-          value: _quizCommon.CAN_EDIT
-        }, (0, _formatMessage.default)('Can edit')))))));
-      }
-    }
-  }, {
-    key: "renderSearchSection",
-    value: function renderSearchSection() {
-      return /*#__PURE__*/_react.default.createElement(_uiGrid.Grid, {
-        vAlign: "bottom",
-        colSpacing: "small"
-      }, /*#__PURE__*/_react.default.createElement(_uiGrid.Grid.Row, null, /*#__PURE__*/_react.default.createElement(_uiGrid.Grid.Col, null, /*#__PURE__*/_react.default.createElement(_asyncSearch.default, {
-        getShareableCourses: this.props.getShareableCourses,
-        getShareableUsers: this.props.getShareableUsers,
-        improvedBankSharingEnabled: this.props.improvedBankSharingEnabled,
-        minChars: this.props.minChars,
-        onSelectionChange: this.handleSearchSelectionChange,
-        selectedOption: this.state.searchSelection,
-        selectionFilter: this.handleSearchFilter
-      })), this.props.improvedBankSharingEnabled && /*#__PURE__*/_react.default.createElement(_uiGrid.Grid.Col, {
-        width: "auto"
-      }, /*#__PURE__*/_react.default.createElement(_uiSimpleSelect.SimpleSelect, {
-        onChange: this.handleSearchPermissionChange,
-        value: this.state.searchPermission,
-        renderLabel: (0, _formatMessage.default)('Access')
-      }, /*#__PURE__*/_react.default.createElement(_uiSimpleSelect.SimpleSelect.Option, {
-        id: "sharing-modal-search-section-select-option-can-view",
-        value: _quizCommon.READ_ONLY
-      }, (0, _formatMessage.default)('Can view')), /*#__PURE__*/_react.default.createElement(_uiSimpleSelect.SimpleSelect.Option, {
-        id: "sharing-modal-search-section-select-option-can-edit",
-        value: _quizCommon.CAN_EDIT
-      }, (0, _formatMessage.default)('Can edit')))), /*#__PURE__*/_react.default.createElement(_uiGrid.Grid.Col, {
-        width: "auto"
-      }, /*#__PURE__*/_react.default.createElement(_uiButtons.Button, {
-        "data-automation": "sdk-shared-bank-add-user-button",
-        ref: this.handleShareButtonRef,
-        onClick: this.handleShare,
-        variant: this.state.searchSelection.length ? 'success' : 'default'
-      }, (0, _formatMessage.default)('Add')))));
-    }
-  }, {
-    key: "renderEntitiesSection",
-    value: function renderEntitiesSection() {
-      return /*#__PURE__*/_react.default.createElement(_ShareList.default, {
-        ref: this.handleShareListRef,
-        improvedBankSharingEnabled: this.props.improvedBankSharingEnabled,
-        canEdit: this.props.bank.canEdit(),
-        newEntities: this.state.newEntities,
-        sharedBanks: this.props.sharedBanks,
-        shares: this.state.shares,
-        onPermissionChange: this.handleEntityPermissionChange,
-        onEntityRemove: this.handleEntityRemove,
-        entitiesWithChangedPermission: this.state.entitiesWithChangedPermission
-      });
-    }
-  }, {
-    key: "render",
-    value: function render() {
-      return /*#__PURE__*/_react.default.createElement(_quizCommon.Modal, {
-        open: this.props.isOpen,
-        onDismiss: this.handleDismiss,
-        size: "medium",
-        label: (0, _formatMessage.default)('Sharing'),
-        shouldCloseOnDocumentClick: true,
-        onOpen: this.checkForSharedBanks
-      }, /*#__PURE__*/_react.default.createElement(_quizCommon.ModalHeader, null, /*#__PURE__*/_react.default.createElement(_uiHeading.Heading, null, this.props.bank.title), /*#__PURE__*/_react.default.createElement(_uiButtons.CloseButton, {
-        onClick: this.handleDismiss,
-        placement: "end",
-        offset: "medium",
-        screenReaderLabel: (0, _formatMessage.default)('Close')
-      })), /*#__PURE__*/_react.default.createElement(_quizCommon.ModalBody, null, this.renderAccountPermissions(), this.props.bank.canEdit() && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, this.renderSearchSection(), /*#__PURE__*/_react.default.createElement("div", {
-        className: styles.separator
-      })), this.state.shares.size > 0 ? this.renderEntitiesSection() : _ref6), /*#__PURE__*/_react.default.createElement(_quizCommon.ModalFooter, null, /*#__PURE__*/_react.default.createElement(_uiButtons.Button, {
-        "data-automation": "sdk-shared-bank-cancel-button",
-        variant: "light",
-        onClick: this.handleDismiss,
-        margin: "0 x-small 0 0"
-      }, (0, _formatMessage.default)('Cancel')), /*#__PURE__*/_react.default.createElement(_uiButtons.Button, {
-        "data-automation": "sdk-shared-bank-done-button",
-        variant: "primary",
-        onClick: this.handleSubmit,
-        margin: "0 x-small 0 0"
-      }, (0, _formatMessage.default)('Done'))));
-    }
-  }]);
-  SharingModalPresenter.displayName = "SharingModalPresenter";
-  return SharingModalPresenter;
-}(_react.Component), _class2.propTypes = {
-  appContainer: _CustomPropTypes.default.selectors.isRequired,
-  bank: _reactImmutableProptypes.default.record.isRequired,
-  currentUser: _propTypes.default.shape({
-    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,
-  improvedBankSharingEnabled: _propTypes.default.bool,
-  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
-}, _class2.defaultProps = {
-  bank: null,
-  currentUser: null,
-  improvedBankSharingEnabled: false,
-  isOpen: false,
-  minChars: void 0,
-  modalTrigger: null,
-  onDismiss: noop,
-  onShare: function onShare() {},
-  sharedBanks: (0, _immutable.List)(),
-  updateSharedCount: Function.prototype
-}, _temp)) || _class);
-exports.SharingModalPresenter = SharingModalPresenter;
-var _default = SharingModalPresenter;
-exports.default = _default;

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

@@ -1,17 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = generator;
-
-function generator(_ref) {
-  var colors = _ref.colors,
-      borders = _ref.borders,
-      spacing = _ref.spacing;
-  return {
-    separatorColor: colors.tiara,
-    separatorBorderWidth: borders.widthSmall,
-    separatorMargin: spacing.medium
-  };
-}