@instructure/quiz-core 21.1.1 → 22.0.0

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

@@ -1,16 +1,16 @@
 "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 _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
+exports["default"] = exports.Banks = void 0;
 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 _isEqual = _interopRequireDefault(require("lodash/isEqual"));
@@ -24,213 +24,229 @@ var _emotion = require("@instructure/emotion");
 var _uiGrid = require("@instructure/ui-grid");
 var _uiView = require("@instructure/ui-view");
 var _debounce = _interopRequireDefault(require("lodash/fp/debounce"));
-var _index = _interopRequireDefault(require("../../../common/components/layout/Page/index.js"));
-var _index2 = require("../HeaderBreadCrumb/index.js");
-var _index3 = _interopRequireDefault(require("../../../common/components/shared/PaginatedCollection/index.js"));
+var _Page = _interopRequireDefault(require("../../../common/components/layout/Page"));
+var _HeaderBreadCrumb = require("../HeaderBreadCrumb");
+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 _index4 = _interopRequireDefault(require("../../../banks/components/BanksList/index.js"));
-var _index5 = _interopRequireDefault(require("../../../banks/components/CreateBankModal/index.js"));
-var _index6 = _interopRequireDefault(require("../NavWrapper/index.js"));
+var _BanksList = _interopRequireDefault(require("../../../banks/components/BanksList"));
+var _CreateBankModal = _interopRequireDefault(require("../../../banks/components/CreateBankModal"));
+var _NavWrapper = _interopRequireDefault(require("../NavWrapper"));
 var _noResults = _interopRequireDefault(require("../noResults.svg"));
-var _styles = _interopRequireDefault(require("./styles.js"));
-var _theme = _interopRequireDefault(require("./theme.js"));
-var _index7 = _interopRequireDefault(require("../AsyncSearch/index.js"));
+var _styles = _interopRequireDefault(require("./styles"));
+var _theme = _interopRequireDefault(require("./theme"));
+var _AsyncSearch = _interopRequireDefault(require("../AsyncSearch"));
 var _dec, _class, _Banks;
 /** @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 sortOrderIcons = {
   ascending: _uiIcons.IconArrowUpLine,
   descending: _uiIcons.IconArrowDownLine
 };
-var _ref4 = (0, _emotion.jsx)(_uiImg.Img, {
-  src: _noResults.default
-});
-var Banks = (_dec = (0, _quizCommon.withStyleOverrides)(_styles.default, _theme.default), _dec(_class = (_Banks = /*#__PURE__*/function (_Component) {
-  (0, _inherits2.default)(Banks, _Component);
-  var _super = (0, _createSuper2.default)(Banks);
+var Banks = exports.Banks = (_dec = (0, _quizCommon.withStyleOverrides)(_styles["default"], _theme["default"]), _dec(_class = (_Banks = /*#__PURE__*/function (_Component) {
   function Banks(props) {
-    var _this;
-    (0, _classCallCheck2.default)(this, Banks);
-    _this = _super.apply(this, arguments);
+    var _this2;
+    (0, _classCallCheck2["default"])(this, Banks);
+    _this2 = _callSuper(this, Banks, arguments);
     // We only care about displaying the account search for the Institution Banks and Shared with Me filters
-    _this.hideAccountSearch = function () {
-      if (_this.props.scopeType === 'course' || _this.props.scopeType === 'courses' || _this.props.scopeType === 'this_account') {
+    (0, _defineProperty2["default"])(_this2, "hideAccountSearch", function () {
+      if (_this2.props.scopeType === 'course' || _this2.props.scopeType === 'courses' || _this2.props.scopeType === 'this_account') {
         return true;
       }
       return false;
-    };
-    _this.isSubAccountLaunch = function () {
-      return _this.props.scope.type === 'account' && _this.props.scope.launch_context_uuid && _this.props.rootAccountUuid && _this.props.scope.launch_context_uuid !== _this.props.rootAccountUuid;
-    };
-    _this.onCreateBank = function () {
-      _this.props.createBank({
-        language: _this.context.locale
+    });
+    (0, _defineProperty2["default"])(_this2, "isSubAccountLaunch", function () {
+      return _this2.props.scope.type === 'account' && _this2.props.scope.launch_context_uuid && _this2.props.rootAccountUuid && _this2.props.scope.launch_context_uuid !== _this2.props.rootAccountUuid;
+    });
+    (0, _defineProperty2["default"])(_this2, "onCreateBank", function () {
+      _this2.props.createBank({
+        language: _this2.context.locale
       });
-      _this.props.openModal(_quizCommon.CREATE_BANK_MODAL, {
-        modalTrigger: _this.createBankButton,
-        onCreateBank: _this.handleBankCreated
+      _this2.props.openModal(_quizCommon.CREATE_BANK_MODAL, {
+        modalTrigger: _this2.createBankButton,
+        onCreateBank: _this2.handleBankCreated
       });
-    };
-    _this.handleBankCreated = function () {
-      _this.props.merge(_quizCommon.BANKS_BANK_FILTERS, {
+    });
+    (0, _defineProperty2["default"])(_this2, "handleBankCreated", function () {
+      _this2.props.merge(_quizCommon.BANKS_BANK_FILTERS, {
         scopeType: 'user'
       });
-    };
-    _this.getBanksParams = function () {
-      var scope = _this.props.scope;
+    });
+    (0, _defineProperty2["default"])(_this2, "getBanksParams", function () {
+      var scope = _this2.props.scope;
       var params = {};
-      if (_this.props.scopeType === 'course' && scope.uuid) {
+      if (_this2.props.scopeType === 'course' && scope.uuid) {
         params['course_id'] = scope.uuid;
-      } else if (_this.props.scopeType && _this.props.scopeType != 'user') {
-        params['scope'] = _this.props.scopeType;
+      } else if (_this2.props.scopeType && _this2.props.scopeType != 'user') {
+        params['scope'] = _this2.props.scopeType;
       }
-      if (_this.props.sortBy !== 'name') {
-        params['sort_by'] = _this.props.sortBy;
+      if (_this2.props.sortBy !== 'name') {
+        params['sort_by'] = _this2.props.sortBy;
       }
-      if (_this.props.sortOrder === 'descending') {
+      if (_this2.props.sortOrder === 'descending') {
         params['sort_order'] = 'DESC';
       }
-      if (_this.props.searchTerms) {
-        params['search'] = _this.props.searchTerms;
+      if (_this2.props.searchTerms) {
+        params['search'] = _this2.props.searchTerms;
       }
-      if (_this.props.scopeType === 'this_account') {
-        params['account_uuids'] = [_this.props.scope.launch_context_uuid];
+      if (_this2.props.scopeType === 'this_account') {
+        params['account_uuids'] = [_this2.props.scope.launch_context_uuid];
         params['scope'] = 'account';
-      } else if (_this.props.searchSelection.length > 0) {
-        params['account_uuids'] = _this.props.searchSelection.map(function (account) {
+      } else if (_this2.props.searchSelection.length > 0) {
+        params['account_uuids'] = _this2.props.searchSelection.map(function (account) {
           return account.uuid;
         });
       }
       return params;
-    };
-    _this.getPage = function (page) {
-      var params = _this.getBanksParams();
-      return _this.props.getBanks((0, _objectSpread2.default)({
+    });
+    (0, _defineProperty2["default"])(_this2, "getPage", function (page) {
+      var params = _this2.getBanksParams();
+      return _this2.props.getBanks(_objectSpread({
         page: page
-      }, params), _this.props.usedByCourseEnabled, _this.props.getCourseAssignments);
-    };
-    _this.focusCreateBankButton = function () {
-      _this.createBankButton && _this.createBankButton.focus();
-    };
-    _this.handleCreateBankButtonRef = function (node) {
-      _this.createBankButton = node;
-    };
-    _this.handleBanksParentChange = function (event, _ref) {
+      }, params), _this2.props.usedByCourseEnabled, _this2.props.getCourseAssignments);
+    });
+    (0, _defineProperty2["default"])(_this2, "focusCreateBankButton", function () {
+      _this2.createBankButton && _this2.createBankButton.focus();
+    });
+    (0, _defineProperty2["default"])(_this2, "handleCreateBankButtonRef", function (node) {
+      _this2.createBankButton = node;
+    });
+    (0, _defineProperty2["default"])(_this2, "handleBanksParentChange", function (event, _ref) {
       var scopeType = _ref.value;
-      _this.props.merge(_quizCommon.BANKS_BANK_FILTERS, {
+      _this2.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 === 'ascending' ? (0, _formatMessage.default)('ascending') : (0, _formatMessage.default)('descending')
+    });
+    (0, _defineProperty2["default"])(_this2, "getSortingOrderIcon", function () {
+      return sortOrderIcons[_this2.props.sortOrder];
+    });
+    (0, _defineProperty2["default"])(_this2, "getSortAssistiveText", function () {
+      return (0, _formatMessage["default"])('Change sort direction. Direction is currently { sortDirection }', {
+        sortDirection: _this2.props.sortOrder === 'ascending' ? (0, _formatMessage["default"])('ascending') : (0, _formatMessage["default"])('descending')
       });
-    };
-    _this.handleSortingButtonClick = function () {
-      _this.props.merge(_quizCommon.BANKS_BANK_FILTERS, {
-        sortOrder: _this.props.sortOrder === 'ascending' ? 'descending' : 'ascending'
+    });
+    (0, _defineProperty2["default"])(_this2, "handleSortingButtonClick", function () {
+      _this2.props.merge(_quizCommon.BANKS_BANK_FILTERS, {
+        sortOrder: _this2.props.sortOrder === 'ascending' ? 'descending' : 'ascending'
       });
-    };
-    _this.handleSortByChange = function (event, _ref2) {
+    });
+    (0, _defineProperty2["default"])(_this2, "handleSortByChange", function (event, _ref2) {
       var sortBy = _ref2.value;
-      _this.props.merge(_quizCommon.BANKS_BANK_FILTERS, {
+      _this2.props.merge(_quizCommon.BANKS_BANK_FILTERS, {
         sortBy: sortBy
       });
-    };
-    _this.handleTableSortChange = function (sortBy, sortOrder) {
+    });
+    (0, _defineProperty2["default"])(_this2, "handleTableSortChange", function (sortBy, sortOrder) {
       return function () {
         var newSortOrder = sortOrder;
-        if (_this.props.sortBy === sortBy) {
+        if (_this2.props.sortBy === sortBy) {
           // toggle sort order
           sortOrder === 'ascending' ? newSortOrder = 'descending' : newSortOrder = 'ascending';
         }
-        _this.props.merge(_quizCommon.BANKS_BANK_FILTERS, {
+        _this2.props.merge(_quizCommon.BANKS_BANK_FILTERS, {
           sortOrder: newSortOrder,
           sortBy: sortBy
         });
       };
-    };
-    _this.handleSearchInputChange = function (_ref3) {
+    });
+    (0, _defineProperty2["default"])(_this2, "handleSearchInputChange", function (_ref3) {
       var value = _ref3.target.value;
-      _this.setState({
+      _this2.setState({
         searchTerms: value
       });
-      _this.search(value);
-    };
-    _this.handleSearchSelectionChange = function (searchSelection) {
-      _this.props.setUI([_quizCommon.BANKS_BANK_FILTERS, 'searchSelection'], searchSelection);
-    };
-    _this.renderRecords = function (recordIds) {
-      return (0, _emotion.jsx)(_index4.default, {
-        createBankButton: _this.createBankButton,
-        currentUser: _this.props.currentUser,
-        focusCreateBankButton: _this.focusCreateBankButton,
-        getCourseInfo: _this.props.getCourseInfo,
-        getUserInfo: _this.props.getUserInfo,
-        getSubaccountInfo: _this.props.getSubaccountInfo,
-        getShareableCourses: _this.props.getShareableCourses,
-        getShareableUsers: _this.props.getShareableUsers,
-        getShareableSubaccounts: _this.props.getShareableSubaccounts,
-        isCompact: _this.props.isCompact,
-        itemBankSearchTableEnabled: _this.props.itemBankSearchTableEnabled,
-        minChars: _this.props.minChars,
-        navigateToBank: _this.props.navigateToBank,
-        onChangeSort: _this.handleTableSortChange,
-        onShare: _this.props.onShare,
-        order: _this.props.sortOrder,
+      _this2.search(value);
+    });
+    (0, _defineProperty2["default"])(_this2, "handleSearchSelectionChange", function (searchSelection) {
+      _this2.props.setUI([_quizCommon.BANKS_BANK_FILTERS, 'searchSelection'], searchSelection);
+    });
+    (0, _defineProperty2["default"])(_this2, "renderRecords", function (recordIds) {
+      return (0, _emotion.jsx)(_BanksList["default"], {
+        createBankButton: _this2.createBankButton,
+        currentUser: _this2.props.currentUser,
+        focusCreateBankButton: _this2.focusCreateBankButton,
+        getCourseInfo: _this2.props.getCourseInfo,
+        getUserInfo: _this2.props.getUserInfo,
+        getSubaccountInfo: _this2.props.getSubaccountInfo,
+        getShareableCourses: _this2.props.getShareableCourses,
+        getShareableUsers: _this2.props.getShareableUsers,
+        getShareableSubaccounts: _this2.props.getShareableSubaccounts,
+        isCompact: _this2.props.isCompact,
+        itemBankSearchTableEnabled: _this2.props.itemBankSearchTableEnabled,
+        minChars: _this2.props.minChars,
+        navigateToBank: _this2.props.navigateToBank,
+        onChangeSort: _this2.handleTableSortChange,
+        onShare: _this2.props.onShare,
+        order: _this2.props.sortOrder,
         recordIds: recordIds,
-        sort: _this.props.sortBy
+        sort: _this2.props.sortBy
       });
-    };
-    _this.emptyPage = function () {
-      if (_this.props.searchTerms || _this.props.searchSelection.length > 0) {
+    });
+    (0, _defineProperty2["default"])(_this2, "emptyPage", function () {
+      if (_this2.props.searchTerms || _this2.props.searchSelection.length > 0) {
         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 \"{ topLevelBankFilter }\"", {
-            topLevelBankFilter: _this.topLevelBankFilterName()
+        if (_this2.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 \"{ topLevelBankFilter }\"", {
+            topLevelBankFilter: _this2.topLevelBankFilterName()
           });
-        } else if (_this.props.scopeType === 'this_account') {
-          message = (0, _formatMessage.default)("Your filter is set to \"This Account\" which will narrow what you can search for.\n            Try adjusting the filter to \"{ topLevelBankFilter }\"", {
-            topLevelBankFilter: _this.topLevelBankFilterName()
+        } else if (_this2.props.scopeType === 'this_account') {
+          message = (0, _formatMessage["default"])("Your filter is set to \"This Account\" which will narrow what you can search for.\n            Try adjusting the filter to \"{ topLevelBankFilter }\"", {
+            topLevelBankFilter: _this2.topLevelBankFilterName()
           });
-        } 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 \"{ topLevelBankFilter }\"", {
-            topLevelBankFilter: _this.topLevelBankFilterName()
+        } else if (_this2.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 \"{ topLevelBankFilter }\"", {
+            topLevelBankFilter: _this2.topLevelBankFilterName()
           });
         }
         return (0, _emotion.jsx)(_uiBillboard.Billboard, {
           size: "medium",
-          heading: (0, _formatMessage.default)('No Results Found'),
+          heading: (0, _formatMessage["default"])('No Results Found'),
           message: message,
-          hero: _ref4
+          hero: (0, _emotion.jsx)(_uiImg.Img, {
+            src: _noResults["default"]
+          })
         });
       }
-      return (0, _formatMessage.default)("You don't have any banks yet");
-    };
-    _this.state = {
-      searchTerms: _this.props.searchTerms || ''
+      return (0, _formatMessage["default"])("You don't have any banks yet");
+    });
+    _this2.state = {
+      searchTerms: _this2.props.searchTerms || ''
     };
-    _this.search = (0, _debounce.default)(500, function (searchTerms) {
-      _this.props.merge(_quizCommon.BANKS_BANK_FILTERS, {
+    _this2.search = (0, _debounce["default"])(500, function (searchTerms) {
+      _this2.props.merge(_quizCommon.BANKS_BANK_FILTERS, {
         searchTerms: searchTerms
       });
     });
-    return _this;
+    return _this2;
   }
-  (0, _createClass2.default)(Banks, [{
+  (0, _inherits2["default"])(Banks, _Component);
+  return (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 || !(0, _isEqual.default)(prevProps.searchSelection, this.props.searchSelection)) {
+      if (prevProps.sortBy !== this.props.sortBy || prevProps.sortOrder !== this.props.sortOrder || prevProps.searchTerms !== this.props.searchTerms || prevProps.scopeType !== this.props.scopeType || !(0, _isEqual["default"])(prevProps.searchSelection, this.props.searchSelection)) {
         this.props.clear(_quizCommon.BANKS_BANK_PAGINATION);
       }
     }
   }, {
     key: "topLevelBankFilterName",
     value: function topLevelBankFilterName() {
-      return (0, _formatMessage.default)('Shared with Me');
+      return (0, _formatMessage["default"])('Shared with Me');
     }
   }, {
     key: "renderFilters",
@@ -240,22 +256,22 @@ var Banks = (_dec = (0, _quizCommon.withStyleOverrides)(_styles.default, _theme.
         translation: this.topLevelBankFilterName()
       }, {
         slug: 'account',
-        translation: (0, _formatMessage.default)('Institution Banks')
+        translation: (0, _formatMessage["default"])('Institution Banks')
       }, {
         slug: 'courses',
-        translation: (0, _formatMessage.default)('Shared with Courses')
+        translation: (0, _formatMessage["default"])('Shared with Courses')
       }];
       if (this.props.scope.uuid) {
         scopeOptions.push({
           slug: 'course',
-          translation: (0, _formatMessage.default)('This Course')
+          translation: (0, _formatMessage["default"])('This Course')
         });
       }
       if (this.isSubAccountLaunch()) {
         // Put this option below "Insitution Banks"
         scopeOptions.splice(2, 0, {
           slug: 'this_account',
-          translation: (0, _formatMessage.default)('This Account')
+          translation: (0, _formatMessage["default"])('This Account')
         });
       }
 
@@ -263,19 +279,19 @@ var Banks = (_dec = (0, _quizCommon.withStyleOverrides)(_styles.default, _theme.
       // non-display options are used for sorting of banks table
       var sortingCriteriaOptions = [{
         slug: 'name',
-        translation: (0, _formatMessage.default)('Bank Name'),
+        translation: (0, _formatMessage["default"])('Bank Name'),
         display: true
       }, {
         slug: 'last_used',
-        translation: (0, _formatMessage.default)('Last Used'),
+        translation: (0, _formatMessage["default"])('Last Used'),
         display: true
       }, {
         slug: 'updated_at',
-        translation: (0, _formatMessage.default)('Last Updated'),
+        translation: (0, _formatMessage["default"])('Last Updated'),
         display: true
       }, {
         slug: 'created_at',
-        translation: (0, _formatMessage.default)('Created Date'),
+        translation: (0, _formatMessage["default"])('Created Date'),
         display: false
       }];
       var searchFiltersSelectOptionIdPrefix = 'banks-search-filters-select-option-';
@@ -292,7 +308,7 @@ var Banks = (_dec = (0, _quizCommon.withStyleOverrides)(_styles.default, _theme.
       }, (0, _emotion.jsx)(_quizCommon.SimpleSelect, {
         onChange: this.handleBanksParentChange,
         value: this.props.scopeType,
-        renderLabel: (0, _formatMessage.default)('Filter By'),
+        renderLabel: (0, _formatMessage["default"])('Filter By'),
         width: "13rem",
         "data-automation": "sdk-banks-filter-select"
       }, scopeOptions.map(function (option) {
@@ -304,31 +320,31 @@ var Banks = (_dec = (0, _quizCommon.withStyleOverrides)(_styles.default, _theme.
       }))), (0, _emotion.jsx)(_uiGrid.Grid.Col, {
         width: 4
       }, (0, _emotion.jsx)(_quizCommon.TextInput, {
-        renderLabel: (0, _formatMessage.default)('Bank'),
+        renderLabel: (0, _formatMessage["default"])('Bank'),
         type: "search",
         value: this.state.searchTerms,
         onChange: this.handleSearchInputChange,
-        placeholder: (0, _formatMessage.default)('Search Banks'),
+        placeholder: (0, _formatMessage["default"])('Search Banks'),
         "data-automation": "sdk-search-bank-textinput"
       })), !this.hideAccountSearch() && (0, _emotion.jsx)(_uiGrid.Grid.Col, {
         width: 4
-      }, (0, _emotion.jsx)(_index7.default, {
+      }, (0, _emotion.jsx)(_AsyncSearch["default"], {
         getShareableSubaccounts: this.props.getShareableSubaccounts,
         minChars: this.props.minChars,
         onSelectionChange: this.handleSearchSelectionChange,
         searchType: _quizCommon.SHARED_WITH_ACCOUNT,
         selectedOption: this.props.searchSelection,
-        searchLabel: (0, _formatMessage.default)('Account'),
-        placeholderLabel: (0, _formatMessage.default)('Search Accounts')
+        searchLabel: (0, _formatMessage["default"])('Account'),
+        placeholderLabel: (0, _formatMessage["default"])('Search Accounts')
       })))));
       var sortingFiltersSelectOptionIdPrefix = 'banks-sorting-filters-select-option-';
-      var sortingFilters = (0, _emotion.jsx)(_react.default.Fragment, null, (0, _emotion.jsx)("div", {
+      var sortingFilters = (0, _emotion.jsx)(_react["default"].Fragment, null, (0, _emotion.jsx)("div", {
         display: "inline-block",
         style: {
           margin: 'auto 0px auto auto'
         }
       }, (0, _emotion.jsx)(_quizCommon.SimpleSelect, {
-        renderLabel: (0, _emotion.jsx)(_uiA11yContent.ScreenReaderContent, null, (0, _formatMessage.default)('Sort by')),
+        renderLabel: (0, _emotion.jsx)(_uiA11yContent.ScreenReaderContent, null, (0, _formatMessage["default"])('Sort by')),
         value: this.props.sortBy,
         width: "10rem",
         onChange: this.handleSortByChange
@@ -352,7 +368,7 @@ var Banks = (_dec = (0, _quizCommon.withStyleOverrides)(_styles.default, _theme.
         renderIcon: this.getSortingOrderIcon()
       }, (0, _emotion.jsx)(_uiA11yContent.AccessibleContent, {
         alt: this.getSortAssistiveText()
-      }, (0, _formatMessage.default)('Sort')))));
+      }, (0, _formatMessage["default"])('Sort')))));
       if (this.props.closeTray) {
         return (0, _emotion.jsx)("div", {
           css: [this.props.styles.filters, this.props.styles.borderedBottom]
@@ -377,7 +393,7 @@ var Banks = (_dec = (0, _quizCommon.withStyleOverrides)(_styles.default, _theme.
       }, (0, _emotion.jsx)(_uiHeading.Heading, {
         as: this.props.isCompact ? 'h2' : 'h1',
         level: "h1"
-      }, (0, _formatMessage.default)('Banks')), (0, _emotion.jsx)(_uiButtons.Button, {
+      }, (0, _formatMessage["default"])('Banks')), (0, _emotion.jsx)(_uiButtons.Button, {
         ref: this.handleCreateBankButtonRef,
         type: "button",
         color: "primary",
@@ -385,8 +401,8 @@ var Banks = (_dec = (0, _quizCommon.withStyleOverrides)(_styles.default, _theme.
         "data-automation": "sdk-create-new-bank-button",
         renderIcon: _uiIcons.IconPlusLine
       }, (0, _emotion.jsx)(_uiA11yContent.AccessibleContent, {
-        alt: (0, _formatMessage.default)('Create Bank')
-      }, (0, _formatMessage.default)('Bank'))));
+        alt: (0, _formatMessage["default"])('Create Bank')
+      }, (0, _formatMessage["default"])('Bank'))));
     }
   }, {
     key: "renderNav",
@@ -397,7 +413,7 @@ var Banks = (_dec = (0, _quizCommon.withStyleOverrides)(_styles.default, _theme.
         navigateToBuild = _this$props.navigateToBuild,
         returnToUrl = _this$props.returnToUrl;
       var isScopeEmpty = !Object.keys(scope).length;
-      return (0, _emotion.jsx)(_index6.default, {
+      return (0, _emotion.jsx)(_NavWrapper["default"], {
         closeTray: closeTray,
         navigateToBuild: navigateToBuild,
         returnToUrl: isScopeEmpty ? null : returnToUrl,
@@ -410,7 +426,7 @@ var Banks = (_dec = (0, _quizCommon.withStyleOverrides)(_styles.default, _theme.
   }, {
     key: "renderBanksSearchResults",
     value: function renderBanksSearchResults() {
-      return (0, _emotion.jsx)(_index3.default, {
+      return (0, _emotion.jsx)(_PaginatedCollection["default"], {
         empty: this.emptyPage(),
         getPage: this.getPage,
         renderRecords: this.renderRecords,
@@ -420,86 +436,84 @@ var Banks = (_dec = (0, _quizCommon.withStyleOverrides)(_styles.default, _theme.
   }, {
     key: "render",
     value: function render() {
-      return (0, _emotion.jsx)(_index.default, null, this.renderNav(), (0, _emotion.jsx)("div", {
+      return (0, _emotion.jsx)(_Page["default"], null, this.renderNav(), (0, _emotion.jsx)("div", {
         css: this.props.styles.content
       }, this.props.iceTopNavBarEnabled && (0, _emotion.jsx)("div", {
         css: this.props.styles.breadcrumb
-      }, (0, _emotion.jsx)(_index2.HeaderBreadCrumb, {
+      }, (0, _emotion.jsx)(_HeaderBreadCrumb.HeaderBreadCrumb, {
         returnToUrl: this.props.returnToUrl,
         scope: this.props.scope,
         navigateToBuild: this.props.navigateToBuild
-      })), this.renderHeader(), this.renderFilters(), this.renderBanksSearchResults(), (0, _emotion.jsx)(_index5.default, {
+      })), this.renderHeader(), this.renderFilters(), this.renderBanksSearchResults(), (0, _emotion.jsx)(_CreateBankModal["default"], {
         itemBanksScope: this.props.scope
       })));
     }
   }]);
-  Banks.displayName = "Banks";
-  return Banks;
-}(_react.Component), _Banks.displayName = 'Banks', _Banks.componentId = "Quizzes".concat(_Banks.displayName), _Banks.propTypes = {
-  closeTray: _propTypes.default.func,
-  createBank: _propTypes.default.func.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"])(_Banks, "displayName", 'Banks'), (0, _defineProperty2["default"])(_Banks, "componentId", "Quizzes".concat(_Banks.displayName)), (0, _defineProperty2["default"])(_Banks, "propTypes", {
+  closeTray: _propTypes["default"].func,
+  createBank: _propTypes["default"].func.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
   }),
   // from consumer
-  clear: _propTypes.default.func.isRequired,
-  getBanks: _propTypes.default.func.isRequired,
-  getCourseInfo: _propTypes.default.func,
+  clear: _propTypes["default"].func.isRequired,
+  getBanks: _propTypes["default"].func.isRequired,
+  getCourseInfo: _propTypes["default"].func,
   // from consumer
-  getUserInfo: _propTypes.default.func,
+  getUserInfo: _propTypes["default"].func,
   // from consumer
-  getShareableCourses: _propTypes.default.func,
+  getShareableCourses: _propTypes["default"].func,
   // from consumer
-  getShareableUsers: _propTypes.default.func,
+  getShareableUsers: _propTypes["default"].func,
   // from consumer
-  getShareableSubaccounts: _propTypes.default.func,
+  getShareableSubaccounts: _propTypes["default"].func,
   // from consumer
-  getSubaccountInfo: _propTypes.default.func,
+  getSubaccountInfo: _propTypes["default"].func,
   // from consumer
-  getCourseAssignments: _propTypes.default.func,
+  getCourseAssignments: _propTypes["default"].func,
   // from consumer
-  isCompact: _propTypes.default.bool,
-  merge: _propTypes.default.func.isRequired,
-  minChars: _propTypes.default.number,
-  navigateToBank: _propTypes.default.func.isRequired,
+  isCompact: _propTypes["default"].bool,
+  merge: _propTypes["default"].func.isRequired,
+  minChars: _propTypes["default"].number,
+  navigateToBank: _propTypes["default"].func.isRequired,
   // can be from consumer
-  navigateToBuild: _propTypes.default.func,
+  navigateToBuild: _propTypes["default"].func,
   // from consumer
-  onShare: _propTypes.default.func,
+  onShare: _propTypes["default"].func,
   // from consumer
-  openModal: _propTypes.default.func.isRequired,
-  returnToUrl: _propTypes.default.string,
+  openModal: _propTypes["default"].func.isRequired,
+  returnToUrl: _propTypes["default"].string,
   // from consumer
-  scope: _propTypes.default.shape({
-    type: _propTypes.default.string,
-    uuid: _propTypes.default.string,
-    title: _propTypes.default.string,
-    launch_context_uuid: _propTypes.default.string,
-    root_account_name: _propTypes.default.string
+  scope: _propTypes["default"].shape({
+    type: _propTypes["default"].string,
+    uuid: _propTypes["default"].string,
+    title: _propTypes["default"].string,
+    launch_context_uuid: _propTypes["default"].string,
+    root_account_name: _propTypes["default"].string
   }).isRequired,
-  scopeType: _propTypes.default.string,
-  searchTerms: _propTypes.default.string,
-  searchSelection: _propTypes.default.arrayOf(_propTypes.default.shape({
-    avatar: _propTypes.default.string,
-    fullName: _propTypes.default.string,
-    title: _propTypes.default.string,
-    uuid: _propTypes.default.string.isRequired
+  scopeType: _propTypes["default"].string,
+  searchTerms: _propTypes["default"].string,
+  searchSelection: _propTypes["default"].arrayOf(_propTypes["default"].shape({
+    avatar: _propTypes["default"].string,
+    fullName: _propTypes["default"].string,
+    title: _propTypes["default"].string,
+    uuid: _propTypes["default"].string.isRequired
   })),
-  sortBy: _propTypes.default.string,
-  sortOrder: _propTypes.default.string,
-  usedByCourseEnabled: _propTypes.default.bool,
-  itemBankSearchTableEnabled: _propTypes.default.bool,
-  setUI: _propTypes.default.func.isRequired,
-  iceTopNavBarEnabled: _propTypes.default.bool,
-  styles: _propTypes.default.object,
-  rootAccountUuid: _propTypes.default.string
-}, _Banks.defaultProps = {
+  sortBy: _propTypes["default"].string,
+  sortOrder: _propTypes["default"].string,
+  usedByCourseEnabled: _propTypes["default"].bool,
+  itemBankSearchTableEnabled: _propTypes["default"].bool,
+  setUI: _propTypes["default"].func.isRequired,
+  iceTopNavBarEnabled: _propTypes["default"].bool,
+  styles: _propTypes["default"].object,
+  rootAccountUuid: _propTypes["default"].string
+}), (0, _defineProperty2["default"])(_Banks, "defaultProps", {
   closeTray: null,
   currentUser: null,
   getCourseInfo: null,
@@ -524,9 +538,7 @@ var Banks = (_dec = (0, _quizCommon.withStyleOverrides)(_styles.default, _theme.
   itemBankSearchTableEnabled: false,
   iceTopNavBarEnabled: false,
   rootAccountUuid: null
-}, _Banks.contextTypes = {
-  locale: _propTypes.default.string
-}, _Banks)) || _class);
-exports.Banks = Banks;
-var _default = Banks;
-exports.default = _default;
+}), (0, _defineProperty2["default"])(_Banks, "contextTypes", {
+  locale: _propTypes["default"].string
+}), _Banks)) || _class);
+var _default = exports["default"] = Banks;