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

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

@@ -1,480 +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.Banks = void 0;
-
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-
-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 _uiHeading = require("@instructure/ui-heading");
-
-var _uiImg = require("@instructure/ui-img");
-
-var _uiA11yContent = require("@instructure/ui-a11y-content");
-
-var _uiIcons = require("@instructure/ui-icons");
-
-var _uiBillboard = require("@instructure/ui-billboard");
-
-var _uiButtons = require("@instructure/ui-buttons");
-
-var _uiTextInput = require("@instructure/ui-text-input");
-
-var _uiSimpleSelect = require("@instructure/ui-simple-select");
-
-var _uiThemeable = require("@instructure/ui-themeable");
-
-var _debounce = _interopRequireDefault(require("lodash/fp/debounce"));
-
-var _classnames = _interopRequireDefault(require("classnames"));
-
-var _Page = _interopRequireDefault(require("../../../common/components/layout/Page"));
-
-var _PaginatedCollection = _interopRequireDefault(require("../../../common/components/shared/PaginatedCollection"));
-
-var _formatMessage = _interopRequireDefault(require("@instructure/quiz-i18n/es/format-message"));
-
-var _quizCommon = require("@instructure/quiz-common");
-
-var _BanksList = _interopRequireDefault(require("../../../banks/components/BanksList"));
-
-var _CreateBankModal = _interopRequireDefault(require("../../../banks/components/CreateBankModal"));
-
-var _NavWrapper = _interopRequireDefault(require("../NavWrapper"));
-
-var _theme = _interopRequireDefault(require("./theme"));
-
-var _dec, _class, _class2, _temp;
-
-var styles = {
-  componentId: 'cYUUC',
-  template: function template(theme) {
-    return "\n\n.cYUUC_caGd{background-color:".concat(theme.contentBackgroundColor || 'inherit', ";padding:").concat(theme.contentPaddingTopBottom || 'inherit', " ").concat(theme.contentPaddingLeftRight || 'inherit', "}\n\n.cYUUC_fsuY{display:flex;flex-direction:row;justify-content:space-between;padding-bottom:").concat(theme.headerPadding || 'inherit', "}\n\n.cYUUC_cyFt{border-bottom:").concat(theme.headerBorderWidth || 'inherit', " solid ").concat(theme.headerBorderColor || 'inherit', "}\n\n.cYUUC_ECfi{padding-bottom:2rem}\n\n.cYUUC_djgO{display:flex;flex-direction:row;margin-top:1.5rem}\n\n.cYUUC_bYSL{flex-grow:0.25;padding:0 1rem}");
-  },
-  'content': 'cYUUC_caGd',
-  'header': 'cYUUC_fsuY',
-  'borderedBottom': 'cYUUC_cyFt',
-  'filters': 'cYUUC_ECfi',
-  'filtersRow': 'cYUUC_djgO',
-  'searchBarContainer': 'cYUUC_bYSL'
-};
-var sortOrderIcons = {
-  ASC: _uiIcons.IconArrowUpLine,
-  DESC: _uiIcons.IconArrowDownLine
-};
-
-var _ref4 = /*#__PURE__*/_react.default.createElement(_CreateBankModal.default, null);
-
-var Banks = (_dec = (0, _uiThemeable.themeable)(_theme.default, styles), _dec(_class = (_temp = _class2 = /*#__PURE__*/function (_Component) {
-  (0, _inherits2.default)(Banks, _Component);
-
-  var _super = (0, _createSuper2.default)(Banks);
-
-  function Banks(props) {
-    var _this;
-
-    (0, _classCallCheck2.default)(this, Banks);
-    _this = _super.apply(this, arguments);
-
-    _this.onCreateBank = function () {
-      _this.props.createBank({
-        language: _this.context.locale
-      });
-
-      _this.props.openModal(_quizCommon.CREATE_BANK_MODAL, {
-        modalTrigger: _this.createBankButton,
-        onCreateBank: _this.handleBankCreated
-      });
-    };
-
-    _this.handleBankCreated = function () {
-      _this.props.merge(_quizCommon.BANKS_BANK_FILTERS, {
-        scopeType: 'user'
-      });
-    };
-
-    _this.getBanksParams = function () {
-      var scope = _this.props.scope;
-      var params = {};
-
-      if (_this.props.scopeType === 'course' && scope.uuid) {
-        params['course_id'] = scope.uuid;
-      } else if (_this.props.scopeType && _this.props.scopeType != 'user') {
-        params['scope'] = _this.props.scopeType;
-      }
-
-      if (_this.props.sortBy !== 'name') {
-        params['sort_by'] = _this.props.sortBy;
-      }
-
-      if (_this.props.sortOrder === 'DESC') {
-        params['sort_order'] = _this.props.sortOrder;
-      }
-
-      if (_this.props.searchTerms) {
-        params['search'] = _this.props.searchTerms;
-      }
-
-      return params;
-    };
-
-    _this.getPage = function (page) {
-      var params = _this.getBanksParams();
-
-      return _this.props.getBanks((0, _objectSpread2.default)({
-        page: page
-      }, params));
-    };
-
-    _this.focusCreateBankButton = function () {
-      _this.createBankButton && _this.createBankButton.focus();
-    };
-
-    _this.handleCreateBankButtonRef = function (node) {
-      _this.createBankButton = node;
-    };
-
-    _this.handleBanksParentChange = function (event, _ref) {
-      var scopeType = _ref.value;
-
-      _this.props.merge(_quizCommon.BANKS_BANK_FILTERS, {
-        scopeType: scopeType
-      });
-    };
-
-    _this.getSortingOrderIcon = function () {
-      return sortOrderIcons[_this.props.sortOrder];
-    };
-
-    _this.getSortAssistiveText = function () {
-      return (0, _formatMessage.default)('Change sort direction. Direction is currently { sortDirection }', {
-        sortDirection: _this.props.sortOrder === 'ASC' ? (0, _formatMessage.default)('ascending') : (0, _formatMessage.default)('descending')
-      });
-    };
-
-    _this.handleSortingButtonClick = function () {
-      _this.props.merge(_quizCommon.BANKS_BANK_FILTERS, {
-        sortOrder: _this.props.sortOrder === 'ASC' ? 'DESC' : 'ASC'
-      });
-    };
-
-    _this.handleSortByChange = function (event, _ref2) {
-      var sortBy = _ref2.value;
-
-      _this.props.merge(_quizCommon.BANKS_BANK_FILTERS, {
-        sortBy: sortBy
-      });
-    };
-
-    _this.handleSearchInputChange = function (_ref3) {
-      var value = _ref3.target.value;
-
-      _this.setState({
-        searchTerms: value
-      });
-
-      _this.search(value);
-    };
-
-    _this.renderRecords = function (recordIds) {
-      return /*#__PURE__*/_react.default.createElement(_BanksList.default, {
-        focusCreateBankButton: _this.focusCreateBankButton,
-        createBankButton: _this.createBankButton,
-        currentUser: _this.props.currentUser,
-        getCourseInfo: _this.props.getCourseInfo,
-        getUserInfo: _this.props.getUserInfo,
-        getShareableCourses: _this.props.getShareableCourses,
-        getShareableUsers: _this.props.getShareableUsers,
-        minChars: _this.props.minChars,
-        navigateToBank: _this.props.navigateToBank,
-        onShare: _this.props.onShare,
-        recordIds: recordIds
-      });
-    };
-
-    _this.emptyPage = function () {
-      if (_this.props.searchTerms) {
-        var noResultsImg = require('./noResults.svg');
-
-        var message;
-
-        if (_this.props.scopeType === 'course') {
-          message = (0, _formatMessage.default)("Your filter is set to \"Courses\" which will narrow what you can search for.\n          Try adjusting the filter to \"Institution\" or \"All My Banks\"");
-        } else if (_this.props.scopeType === 'account') {
-          message = (0, _formatMessage.default)("Your filter is set to \"Institution\" which will narrow what you can search for.\n          Try adjusting the filter to \"All My Banks\"");
-        }
-
-        return /*#__PURE__*/_react.default.createElement(_uiBillboard.Billboard, {
-          size: "medium",
-          heading: (0, _formatMessage.default)('No Results Found'),
-          message: message,
-          hero: /*#__PURE__*/_react.default.createElement(_uiImg.Img, {
-            src: noResultsImg
-          })
-        });
-      }
-
-      return (0, _formatMessage.default)('You don\'t have any banks yet');
-    };
-
-    _this.state = {
-      searchTerms: _this.props.searchTerms || ''
-    };
-    _this.search = (0, _debounce.default)(500, function (searchTerms) {
-      _this.props.merge(_quizCommon.BANKS_BANK_FILTERS, {
-        searchTerms: searchTerms
-      });
-    });
-    return _this;
-  }
-
-  (0, _createClass2.default)(Banks, [{
-    key: "componentDidUpdate",
-    value: function componentDidUpdate(prevProps, prevState) {
-      if (prevProps.sortBy !== this.props.sortBy || prevProps.sortOrder !== this.props.sortOrder || prevProps.searchTerms !== this.props.searchTerms || prevProps.scopeType !== this.props.scopeType) {
-        this.props.clear(_quizCommon.BANKS_BANK_PAGINATION);
-      }
-    }
-  }, {
-    key: "renderFilters",
-    value: function renderFilters() {
-      var scopeOptions = [{
-        slug: 'user',
-        translation: (0, _formatMessage.default)('All My Banks')
-      }, {
-        slug: 'account',
-        translation: (0, _formatMessage.default)('Institution Banks')
-      }, {
-        slug: 'courses',
-        translation: (0, _formatMessage.default)('All My Course Banks')
-      }];
-
-      if (this.props.scopeType == 'course') {
-        scopeOptions.push({
-          slug: 'course',
-          translation: (0, _formatMessage.default)('Course Banks')
-        });
-      }
-
-      var sortingCriteriaOptions = [{
-        slug: 'name',
-        translation: (0, _formatMessage.default)('Bank Name')
-      }, {
-        slug: 'last_used',
-        translation: (0, _formatMessage.default)('Last Used')
-      }, {
-        slug: 'updated_at',
-        translation: (0, _formatMessage.default)('Last Updated')
-      }];
-      var searchFiltersSelectOptionIdPrefix = 'banks-search-filters-select-option-';
-
-      var searchFilters = /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("div", {
-        display: "inline-block"
-      }, /*#__PURE__*/_react.default.createElement(_uiSimpleSelect.SimpleSelect, {
-        onChange: this.handleBanksParentChange,
-        value: this.props.scopeType,
-        renderLabel: /*#__PURE__*/_react.default.createElement(_uiA11yContent.ScreenReaderContent, null, (0, _formatMessage.default)('Bank scope')),
-        width: "13rem"
-      }, scopeOptions.map(function (option) {
-        return /*#__PURE__*/_react.default.createElement(_uiSimpleSelect.SimpleSelect.Option, {
-          id: searchFiltersSelectOptionIdPrefix + option.slug,
-          key: option.slug,
-          value: option.slug
-        }, option.translation);
-      }))), /*#__PURE__*/_react.default.createElement("div", {
-        display: "inline-block",
-        className: styles.searchBarContainer
-      }, /*#__PURE__*/_react.default.createElement(_uiTextInput.TextInput, {
-        renderLabel: /*#__PURE__*/_react.default.createElement(_uiA11yContent.ScreenReaderContent, null, (0, _formatMessage.default)('Search...')),
-        type: "search",
-        value: this.state.searchTerms,
-        onChange: this.handleSearchInputChange,
-        placeholder: (0, _formatMessage.default)('Search...'),
-        "data-automation": "sdk-search-bank-textinput"
-      })));
-
-      var sortingFiltersSelectOptionIdPrefix = 'banks-sorting-filters-select-option-';
-
-      var sortingFilters = /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("div", {
-        display: "inline-block",
-        style: {
-          margin: 'auto 0px auto auto'
-        }
-      }, /*#__PURE__*/_react.default.createElement(_uiSimpleSelect.SimpleSelect, {
-        renderLabel: /*#__PURE__*/_react.default.createElement(_uiA11yContent.ScreenReaderContent, null, (0, _formatMessage.default)('Sort by')),
-        value: this.props.sortBy,
-        width: "10rem",
-        onChange: this.handleSortByChange
-      }, sortingCriteriaOptions.map(function (option) {
-        return /*#__PURE__*/_react.default.createElement(_uiSimpleSelect.SimpleSelect.Option, {
-          id: sortingFiltersSelectOptionIdPrefix + option.slug,
-          key: option.slug,
-          value: option.slug
-        }, option.translation);
-      }))), /*#__PURE__*/_react.default.createElement("div", {
-        display: "inline-block",
-        style: {
-          marginLeft: '1rem'
-        }
-      }, /*#__PURE__*/_react.default.createElement(_uiButtons.Button, {
-        type: "button",
-        onClick: this.handleSortingButtonClick,
-        "data-automation": "sdk-sort-banks-button",
-        icon: this.getSortingOrderIcon()
-      }, /*#__PURE__*/_react.default.createElement(_uiA11yContent.AccessibleContent, {
-        alt: this.getSortAssistiveText()
-      }, (0, _formatMessage.default)('Sort')))));
-
-      if (this.props.closeTray) {
-        return /*#__PURE__*/_react.default.createElement("div", {
-          className: (0, _classnames.default)(styles.filters, styles.borderedBottom)
-        }, /*#__PURE__*/_react.default.createElement("div", {
-          className: styles.filtersRow
-        }, searchFilters), /*#__PURE__*/_react.default.createElement("div", {
-          className: styles.filtersRow
-        }, sortingFilters));
-      } else {
-        return /*#__PURE__*/_react.default.createElement("div", {
-          className: (0, _classnames.default)(styles.filters, styles.borderedBottom)
-        }, /*#__PURE__*/_react.default.createElement("div", {
-          className: styles.filtersRow
-        }, searchFilters, sortingFilters));
-      }
-    }
-  }, {
-    key: "renderHeader",
-    value: function renderHeader() {
-      return /*#__PURE__*/_react.default.createElement("div", {
-        className: (0, _classnames.default)(styles.header, (0, _defineProperty2.default)({}, styles.borderedBottom, !this.props.filtersEnabled))
-      }, /*#__PURE__*/_react.default.createElement(_uiHeading.Heading, {
-        as: this.props.isCompact ? 'h2' : 'h1',
-        level: "h1"
-      }, (0, _formatMessage.default)('Banks')), /*#__PURE__*/_react.default.createElement(_uiButtons.Button, {
-        ref: this.handleCreateBankButtonRef,
-        type: "button",
-        variant: "primary",
-        onClick: this.onCreateBank,
-        "data-automation": "sdk-create-new-bank-button",
-        icon: _uiIcons.IconPlusLine
-      }, /*#__PURE__*/_react.default.createElement(_uiA11yContent.AccessibleContent, {
-        alt: (0, _formatMessage.default)('Create Bank')
-      }, (0, _formatMessage.default)('Bank'))));
-    }
-  }, {
-    key: "renderNav",
-    value: function renderNav() {
-      var _this$props = this.props,
-          scope = _this$props.scope,
-          closeTray = _this$props.closeTray,
-          navigateToBuild = _this$props.navigateToBuild,
-          returnToUrl = _this$props.returnToUrl;
-      var isScopeEmpty = !Object.keys(scope).length;
-      return /*#__PURE__*/_react.default.createElement(_NavWrapper.default, {
-        closeTray: closeTray,
-        navigateToBuild: navigateToBuild,
-        returnToUrl: isScopeEmpty ? null : returnToUrl,
-        canvasReferrerLinkText: isScopeEmpty ? null : scope.title
-      });
-    }
-  }, {
-    key: "render",
-    value: function render() {
-      return /*#__PURE__*/_react.default.createElement(_Page.default, null, this.renderNav(), /*#__PURE__*/_react.default.createElement("div", {
-        className: styles.content
-      }, this.renderHeader(), this.props.filtersEnabled && this.renderFilters(), /*#__PURE__*/_react.default.createElement(_PaginatedCollection.default, {
-        empty: this.emptyPage(),
-        getPage: this.getPage,
-        renderRecords: this.renderRecords,
-        stateKey: _quizCommon.BANKS_BANK_PAGINATION
-      }), _ref4));
-    }
-  }]);
-  Banks.displayName = "Banks";
-  return Banks;
-}(_react.Component), _class2.propTypes = {
-  closeTray: _propTypes.default.func.isRequired,
-  createBank: _propTypes.default.func.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
-  }),
-  // from consumer
-  clear: _propTypes.default.func,
-  getBanks: _propTypes.default.func.isRequired,
-  getCourseInfo: _propTypes.default.func,
-  // from consumer
-  getUserInfo: _propTypes.default.func,
-  // from consumer
-  getShareableCourses: _propTypes.default.func,
-  // from consumer
-  getShareableUsers: _propTypes.default.func,
-  // from consumer
-  minChars: _propTypes.default.number,
-  isCompact: _propTypes.default.bool,
-  navigateToBank: _propTypes.default.func.isRequired,
-  // can be from consumer
-  navigateToBuild: _propTypes.default.func,
-  // from consumer
-  onShare: _propTypes.default.func,
-  // from consumer
-  openModal: _propTypes.default.func.isRequired,
-  scope: _propTypes.default.objectOf(_propTypes.default.shape({
-    type: _propTypes.default.string,
-    uuid: _propTypes.default.string,
-    title: _propTypes.default.string
-  })),
-  returnToUrl: _propTypes.default.string,
-  // from consumer
-  filtersEnabled: _propTypes.default.bool,
-  merge: _propTypes.default.func.isRequired,
-  scopeType: _propTypes.default.string,
-  sortBy: _propTypes.default.string,
-  sortOrder: _propTypes.default.string,
-  searchTerms: _propTypes.default.string
-}, _class2.defaultProps = {
-  currentUser: null,
-  getCourseInfo: null,
-  getUserInfo: null,
-  getShareableCourses: null,
-  getShareableUsers: null,
-  minChars: void 0,
-  isCompact: false,
-  navigateToBuild: null,
-  onShare: function onShare() {},
-  clear: function clear() {},
-  merge: function merge() {},
-  scope: {},
-  returnToUrl: null,
-  filtersEnabled: false,
-  scopeType: 'user',
-  sortBy: 'name',
-  sortOrder: 'ASC',
-  searchTerms: null
-}, _class2.contextTypes = {
-  locale: _propTypes.default.string
-}, _temp)) || _class);
-exports.Banks = Banks;
-var _default = Banks;
-exports.default = _default;

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

@@ -1,20 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = generator;
-
-function generator(_ref) {
-  var colors = _ref.colors,
-      spacing = _ref.spacing,
-      borders = _ref.borders;
-  return {
-    contentBackgroundColor: colors.white,
-    contentPaddingTopBottom: spacing.small,
-    contentPaddingLeftRight: spacing.xLarge,
-    headerPadding: spacing.small,
-    headerBorderWidth: borders.widthSmall,
-    headerBorderColor: colors.tiara
-  };
-}

package/lib/banks/components/BanksList/index.js

@@ -1,38 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.mapStateToProps = mapStateToProps;
-exports.default = void 0;
-
-var _immutable = require("immutable");
-
-var _reactRedux = require("../../../common/react-redux");
-
-var _presenter = _interopRequireDefault(require("./presenter"));
-
-var _Bank = _interopRequireDefault(require("../../../common/records/Bank"));
-
-var _modal = require("../../../common/actions/modal");
-
-var _banks = require("../../api/banks");
-
-function mapStateToProps(state, props) {
-  return {
-    appContainer: state.getIn(['ui', 'appContainer']),
-    banks: (0, _immutable.List)(props.recordIds).map(function (id) {
-      return _Bank.default.create(state.getIn(['banks', id]));
-    })
-  };
-}
-
-var _default = (0, _reactRedux.connect)(mapStateToProps, {
-  openModal: _modal.openModal,
-  deleteBank: _banks.deleteBank,
-  withConfirm: _modal.withConfirm
-})(_presenter.default);
-
-exports.default = _default;