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

package/es/banks/api/banks.js

@@ -10,7 +10,7 @@ import { removeSharedBank, updateSharedBankPermission as updateSharedBankPermiss
 import { clear, newActiveBankEntry, newActiveBank } from "../../common/actions/ui.js";
 import t from '@instructure/quiz-i18n/es/format-message';
 import { handleError } from "../../common/api/helpers.js";
-import { BANKS_BANK_PAGINATION, BANKS_BANK_ENTRY_PAGINATION, DELETE_BANK_CALL, UPDATE_BANK_CALL, CAN_EDIT, REMOVED_ACCESS, SHARED_WITH_USER, SHARED_WITH_COURSE } from '@instructure/quiz-common';
+import { BANKS_BANK_PAGINATION, BANKS_BANK_ENTRY_PAGINATION, DELETE_BANK_CALL, UPDATE_BANK_CALL, CAN_EDIT, READ_ONLY, REMOVED_ACCESS, SHARED_WITH_USER, SHARED_WITH_COURSE } from '@instructure/quiz-common';
 var banksApiEndpoint = '/api/banks';
 var DEFAULT_PAGE_SIZE = 100;
 
@@ -71,7 +71,7 @@ export var getBank = function getBank(bankId) {
     });
   };
 };
-export var createBank = function createBank(newBank) {
+export var createBank = function createBank(newBank, shareWithCourseUuid) {
   return function (dispatch, getState) {
     var newBankData = JSON.stringify({
       bank: {
@@ -84,10 +84,34 @@ export var createBank = function createBank(newBank) {
       body: newBankData
     }).then(function (bankData) {
       dispatch([handleBankResponse(bankData), clear(BANKS_BANK_PAGINATION)]);
+
+      if (shareWithCourseUuid) {
+        simpleShareWithCourse(dispatch, bankData.id, shareWithCourseUuid);
+      }
+
       return bankData;
     });
   };
+}; // not an action creator
+
+var simpleShareWithCourse = function simpleShareWithCourse(dispatch, bankId, courseUuid) {
+  var url = "".concat(banksApiEndpoint, "/").concat(bankId, "/shared_banks");
+  var shareBankData = JSON.stringify({
+    shared_bank: {
+      entity_id: courseUuid,
+      entityType: SHARED_WITH_COURSE,
+      bank_id: bankId,
+      permission: READ_ONLY
+    }
+  });
+  var fetcher = new Fetcher({
+    onError: handleError(dispatch, t('Failed to share bank.'))
+  });
+  return fetcher.post(url, {
+    body: shareBankData
+  });
 };
+
 export function getExistingBankAndEntries(bankId) {
   return function (dispatch, getState) {
     return dispatch([clear("".concat(BANKS_BANK_ENTRY_PAGINATION, ":").concat(bankId)), getBank(bankId)]);

package/es/banks/components/AddToBankModal/presenter.js

@@ -310,7 +310,8 @@ AddToBankModal.propTypes = {
   entryType: PropTypes.string.isRequired,
   // Resolve to the bank entry's entry, or create it if it does not yet exist.
   getEntry: PropTypes.func.isRequired,
-  handleValidationErrorsFromApi: PropTypes.func.isRequired,
+  handleValidationErrorsFromApi: PropTypes.func,
+  // not required for stimuli
   label: PropTypes.string.isRequired,
   modalOpen: PropTypes.bool.isRequired,
   onAdd: PropTypes.func,
@@ -322,6 +323,7 @@ AddToBankModal.propTypes = {
 AddToBankModal.defaultProps = {
   canvasOrigin: '',
   checkBankedContentShareabilityEnabled: false,
+  handleValidationErrorsFromApi: function handleValidationErrorsFromApi() {},
   onAdd: function onAdd() {},
   onContinue: function onContinue() {},
   selectedBank: null

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

@@ -205,7 +205,7 @@ export var Bank = (_dec = themeable(theme, styles), _dec(_class = (_temp = _clas
         className: styles.bankName
       }, /*#__PURE__*/React.createElement(Heading, {
         level: "h1"
-      }, this.props.bank.title));
+      }, this.props.bank.title || t('Bank')));
     }
   }, {
     key: "renderAddBankEntryModal",
@@ -312,7 +312,7 @@ export var Bank = (_dec = themeable(theme, styles), _dec(_class = (_temp = _clas
   bankId: PropTypes.string.isRequired,
   bank: PropTypes.instanceOf(BankRecord).isRequired,
   useBankSearch: PropTypes.bool,
-  closeTray: PropTypes.func.isRequired,
+  closeTray: PropTypes.func,
   getBank: PropTypes.func.isRequired,
   getBankEntries: PropTypes.func.isRequired,
   isCompact: PropTypes.bool,
@@ -340,6 +340,7 @@ export var Bank = (_dec = themeable(theme, styles), _dec(_class = (_temp = _clas
 }, _class2.defaultProps = {
   activeQuizId: null,
   addEntryToQuiz: null,
+  closeTray: function closeTray() {},
   useBankSearch: false,
   isCompact: false,
   minSearchRefreshInterval: 100,

package/es/banks/components/BankEntry/presenter.js

@@ -663,7 +663,7 @@ export var BankEntry = (_dec = themeable(theme, styles), _dec(_class = (_temp =
   clearModifications: PropTypes.func.isRequired,
   clearTemporaryBankItem: PropTypes.func.isRequired,
   createEntryAndBankEntry: PropTypes.func.isRequired,
-  closeTray: PropTypes.func.isRequired,
+  closeTray: PropTypes.func,
   createTagAssociations: PropTypes.func.isRequired,
   deleteTagAssociations: PropTypes.func.isRequired,
   getBankEntry: PropTypes.func.isRequired,
@@ -697,6 +697,7 @@ export var BankEntry = (_dec = themeable(theme, styles), _dec(_class = (_temp =
   updateStimulus: PropTypes.func.isRequired,
   useBankTags: PropTypes.bool
 }, _class2.defaultProps = {
+  closeTray: function closeTray() {},
   entry: null,
   isCompact: false,
   navigateToBuild: null,

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

@@ -44,9 +44,6 @@ var sortOrderIcons = {
   ASC: IconArrowUpLine,
   DESC: IconArrowDownLine
 };
-
-var _ref4 = /*#__PURE__*/React.createElement(CreateBankModal, null);
-
 export var Banks = (_dec = themeable(theme, styles), _dec(_class = (_temp = _class2 = /*#__PURE__*/function (_Component) {
   _inherits(Banks, _Component);
 
@@ -366,14 +363,16 @@ export var Banks = (_dec = themeable(theme, styles), _dec(_class = (_temp = _cla
         getPage: this.getPage,
         renderRecords: this.renderRecords,
         stateKey: BANKS_BANK_PAGINATION
-      }), _ref4));
+      }), /*#__PURE__*/React.createElement(CreateBankModal, {
+        itemBanksScope: this.props.scope
+      })));
     }
   }]);
 
   Banks.displayName = "Banks";
   return Banks;
 }(Component), _class2.propTypes = {
-  closeTray: PropTypes.func.isRequired,
+  closeTray: PropTypes.func,
   createBank: PropTypes.func.isRequired,
   currentUser: PropTypes.shape({
     email: PropTypes.string,
@@ -420,6 +419,7 @@ export var Banks = (_dec = themeable(theme, styles), _dec(_class = (_temp = _cla
   newItemBankFilterNamesEnabled: PropTypes.bool,
   usedByCourseEnabled: PropTypes.bool
 }, _class2.defaultProps = {
+  closeTray: function closeTray() {},
   currentUser: null,
   getCourseInfo: null,
   getUserInfo: null,

package/es/banks/components/CreateBankModal/index.js

@@ -10,6 +10,7 @@ import Bank from "../../../common/records/Bank.js";
 import { showError, hideError } from "../../../common/actions/errorsShowing.js";
 import { getModalTrigger } from "../../../common/util/modalHelpers.js";
 import { screenreaderNotification } from "../../../common/actions/alerts.js";
+import { featureOn } from "../../../common/util/featureCheck.js";
 
 function mapStateToProps(state) {
   var temporaryBank = new Bank(state.getIn(['modifications', 'banks', TEMPORARY_BANK_ID]));
@@ -21,7 +22,8 @@ function mapStateToProps(state) {
     onCreateBank: state.getIn(['modal', 'options', 'onCreateBank']),
     temporaryBank: temporaryBank,
     errorKey: errorKey,
-    displayError: errorsMap.get(errorKey)
+    displayError: errorsMap.get(errorKey),
+    showShareBankOnCreate: featureOn('share_bank_on_create')
   };
 }
 

package/es/banks/components/CreateBankModal/presenter.js

@@ -8,6 +8,8 @@ var _dec, _class, _class2, _temp;
 import React, { Component } from 'react';
 import PropTypes from 'prop-types';
 import { Button, CloseButton } from '@instructure/ui-buttons';
+import { Checkbox } from '@instructure/ui-checkbox';
+import { View } from '@instructure/ui-view';
 import { TextInput } from '@instructure/ui-text-input';
 import { Heading } from '@instructure/ui-heading';
 import { themeable } from '@instructure/ui-themeable';
@@ -39,12 +41,17 @@ export var CreateBankModal = (_dec = themeable(theme, styles), _dec(_class = (_t
     }
 
     _this = _super.call.apply(_super, [this].concat(args));
+    _this.state = {
+      shareWithCourse: false
+    };
 
     _this.continueAction = function () {
       _this.props.showError(_this.props.errorKey);
 
       if (_this.props.temporaryBank.isValid()) {
-        _this.props.createBank(_this.props.temporaryBank);
+        var courseUuid = _this.state.shareWithCourse ? _this.props.itemBanksScope.uuid : null;
+
+        _this.props.createBank(_this.props.temporaryBank, courseUuid);
 
         _this.props.onCreateBank();
 
@@ -57,6 +64,10 @@ export var CreateBankModal = (_dec = themeable(theme, styles), _dec(_class = (_t
     _this.closeAction = function () {
       _this.props.hideError(_this.props.errorKey);
 
+      _this.setState({
+        shareWithCourse: false
+      });
+
       _this.props.clearModifications('banks', _this.props.temporaryBank.id);
 
       if (_this.props.modalTrigger) {
@@ -80,6 +91,12 @@ export var CreateBankModal = (_dec = themeable(theme, styles), _dec(_class = (_t
       }
     };
 
+    _this.toggleCheckbox = function (event) {
+      _this.setState({
+        shareWithCourse: event.target.checked
+      });
+    };
+
     return _this;
   }
 
@@ -117,6 +134,27 @@ export var CreateBankModal = (_dec = themeable(theme, styles), _dec(_class = (_t
         type: "text",
         placeholder: t('Enter a name...'),
         "data-automation": "sdk-create-bank-name-textinput"
+      }), this.renderCheckbox());
+    }
+  }, {
+    key: "renderCheckbox",
+    value: function renderCheckbox() {
+      var hide = !this.props.showShareBankOnCreate || this.props.itemBanksScope.type !== 'course' || !this.props.itemBanksScope.title || !this.props.itemBanksScope.uuid;
+
+      if (hide) {
+        return null;
+      }
+
+      var label = t('Share with { courseName }', {
+        courseName: this.props.itemBanksScope.title
+      });
+      return /*#__PURE__*/React.createElement(View, {
+        margin: "medium 0 0 0",
+        as: "div"
+      }, /*#__PURE__*/React.createElement(Checkbox, {
+        label: label,
+        checked: this.state.shareWithCourse,
+        onChange: this.toggleCheckbox
       }));
     }
   }, {
@@ -155,10 +193,18 @@ export var CreateBankModal = (_dec = themeable(theme, styles), _dec(_class = (_t
   hideError: PropTypes.func.isRequired,
   closeModal: PropTypes.func.isRequired,
   screenreaderNotification: PropTypes.func.isRequired,
-  onCreateBank: PropTypes.func
+  onCreateBank: PropTypes.func,
+  showShareBankOnCreate: PropTypes.bool,
+  itemBanksScope: PropTypes.shape({
+    type: PropTypes.string,
+    uuid: PropTypes.string,
+    title: PropTypes.string
+  })
 }, _class2.defaultProps = {
   displayError: false,
   modalTrigger: null,
+  showShareBankOnCreate: false,
+  itemBanksScope: {},
   onCreateBank: function onCreateBank() {}
 }, _temp)) || _class);
 export default CreateBankModal;

package/es/building/components/resources/quiz/instructions/Show/index.js

@@ -71,10 +71,11 @@ export var QuizInstructionsShow = (_dec = themeable(theme, styles), _dec(_class
   QuizInstructionsShow.displayName = "QuizInstructionsShow";
   return QuizInstructionsShow;
 }(Component), _class2.propTypes = {
-  instructions: PropTypes.string.isRequired,
+  instructions: PropTypes.string,
   switchOnEditing: PropTypes.func.isRequired,
   contentLocked: PropTypes.bool
 }, _class2.defaultProps = {
-  contentLocked: false
+  contentLocked: false,
+  instructions: null
 }, _temp)) || _class);
 export default makeScrollable(QuizInstructionsShow);

package/es/building/components/resources/quizEntry/QuizEntryBank/QuizEntryBankEdit/presenter.js

@@ -252,9 +252,11 @@ export var QuizEntryBankEdit = (_dec = themeable(theme, styles), _dec(_class = (
   questionSelection: PropTypes.string.isRequired,
   quizEntry: PropTypes.instanceOf(QuizEntry).isRequired,
   quizId: PropTypes.string.isRequired,
-  sampleNum: PropTypes.string.isRequired,
+  sampleNum: PropTypes.string,
   updateQuizEntry: PropTypes.func.isRequired,
   workingBank: PropTypes.instanceOf(Bank).isRequired,
   workingQuizEntry: PropTypes.instanceOf(QuizEntry).isRequired
+}, _class2.defaultProps = {
+  sampleNum: void 0
 }, _temp)) || _class);
 export default QuizEntryBankEdit;

package/es/building/components/resources/quizEntry/QuizEntryBank/QuizEntryBankShow/index.js

@@ -100,7 +100,7 @@ export var QuizEntryBank = (_dec = themeable(theme, styles), _dec(_class = (_tem
       }, /*#__PURE__*/React.createElement(View, {
         size: "medium",
         textAlign: "center",
-        margin: "large auto",
+        margin: "0 auto",
         padding: "small"
       }, this.renderErrors(), this.renderContent()));
     }

package/es/common/actions/grading.js

@@ -0,0 +1,13 @@
+import { GRADE_BY_QUESTION_ENABLED, GBQ_SET_ACTIVE_ITEM } from '@instructure/quiz-common';
+export function setGradeByQuestionEnabled(enabled) {
+  return {
+    type: GRADE_BY_QUESTION_ENABLED,
+    payload: enabled
+  };
+}
+export function setActiveItem(itemId) {
+  return {
+    type: GBQ_SET_ACTIVE_ITEM,
+    payload: itemId
+  };
+}

package/es/common/components/RceConfigProvider/presenter.js

@@ -67,6 +67,7 @@ var RceConfigProviderComponent = function RceConfigProviderComponent(_ref2) {
       contextId = _ref2.contextId,
       contextType = _ref2.contextType,
       canvasUserId = _ref2.canvasUserId,
+      canvasToolId = _ref2.canvasToolId,
       rcsHost = _ref2.rcsHost,
       rcsJwt = _ref2.rcsJwt,
       rcsJwtRefreshFn = _ref2.rcsJwtRefreshFn,
@@ -101,6 +102,9 @@ var RceConfigProviderComponent = function RceConfigProviderComponent(_ref2) {
     isNewRCERendererEnabled: isNewRCERendererEnabled,
     isNewRCEAppsEnabled: isNewRCEAppsEnabled
   };
+  var ltiAppParams = {
+    canvasToolId: canvasToolId
+  };
   var rendererParams = {
     canvasOrigin: canvasOrigin
   };
@@ -169,7 +173,7 @@ var RceConfigProviderComponent = function RceConfigProviderComponent(_ref2) {
   }
 
   return /*#__PURE__*/React.createElement(RceConfigContext.Provider, {
-    value: mapParamsToRceConfigContext(flags, rcsParams, rendererParams, canvasConfig)
+    value: mapParamsToRceConfigContext(flags, rcsParams, rendererParams, canvasConfig, ltiAppParams)
   }, children);
 };
 
@@ -181,6 +185,7 @@ RceConfigProviderComponent.propTypes = {
   contextId: PropTypes.string,
   contextType: PropTypes.string,
   canvasUserId: PropTypes.string,
+  canvasToolId: PropTypes.string,
   rcsHost: PropTypes.string,
   rcsJwt: PropTypes.string,
   rcsJwtRefreshFn: PropTypes.func,
@@ -190,6 +195,7 @@ RceConfigProviderComponent.defaultProps = {
   contextId: null,
   contextType: null,
   canvasUserId: null,
+  canvasToolId: null,
   rcsHost: null,
   rcsJwt: null,
   rcsJwtRefreshFn: null,

package/es/common/components/RceConfigProvider/rceConfigMapper.js

@@ -1,6 +1,6 @@
 import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
 import { RceConfigKeys } from '@instructure/quiz-common';
-import { hasAllPropsForRcs } from "./rceConfigUtils.js";
+import { hasAllPropsForRcs, areLtiAppsConfigured } from "./rceConfigUtils.js";
 
 var mapFeatureFlags = function mapFeatureFlags(flags) {
   var _ref;
@@ -18,14 +18,22 @@ var mapRcs = function mapRcs(rcsParams, canvasConfig) {
   }
 };
 
+var mapLtiApps = function mapLtiApps(flags, canvasConfig, ltiAppParams) {
+  var _ref3;
+
+  if (!areLtiAppsConfigured(flags, canvasConfig, ltiAppParams)) return null;
+  return _ref3 = {}, _defineProperty(_ref3, RceConfigKeys.canvasToolId, ltiAppParams.canvasToolId), _defineProperty(_ref3, RceConfigKeys.editorButtons, canvasConfig.editorButtons), _ref3;
+};
+
 var rendererEnhancement = function rendererEnhancement(rendererParams) {
   return _defineProperty({}, RceConfigKeys.canvasOrigin, (rendererParams === null || rendererParams === void 0 ? void 0 : rendererParams.canvasOrigin) || null);
 };
 
-export var mapParamsToRceConfigContext = function mapParamsToRceConfigContext(flags, rcsParams, rendererParams, canvasConfig) {
+export var mapParamsToRceConfigContext = function mapParamsToRceConfigContext(flags, rcsParams, rendererParams, canvasConfig, ltiAppParams) {
   return {
     featureFlags: mapFeatureFlags(flags),
     rcs: mapRcs(rcsParams, canvasConfig),
-    rendererEnhancement: rendererEnhancement(rendererParams)
+    rendererEnhancement: rendererEnhancement(rendererParams),
+    ltiApps: mapLtiApps(flags, canvasConfig, ltiAppParams)
   };
 };

package/es/common/components/RceConfigProvider/rceConfigUtils.js

@@ -1,6 +1,9 @@
 export var hasAllPropsForRcs = function hasAllPropsForRcs(rcsParams) {
   return !!((rcsParams === null || rcsParams === void 0 ? void 0 : rcsParams.contextId) && (rcsParams === null || rcsParams === void 0 ? void 0 : rcsParams.contextType) && (rcsParams === null || rcsParams === void 0 ? void 0 : rcsParams.canvasUserId) && (rcsParams === null || rcsParams === void 0 ? void 0 : rcsParams.rcsHost) && (rcsParams === null || rcsParams === void 0 ? void 0 : rcsParams.refreshToken) && (rcsParams === null || rcsParams === void 0 ? void 0 : rcsParams.jwt));
 };
+export var areLtiAppsConfigured = function areLtiAppsConfigured(flags, canvasConfig, ltiAppParams) {
+  return !!((flags === null || flags === void 0 ? void 0 : flags.isNewRCEAppsEnabled) && (ltiAppParams === null || ltiAppParams === void 0 ? void 0 : ltiAppParams.canvasToolId) && (canvasConfig === null || canvasConfig === void 0 ? void 0 : canvasConfig.editorButtons) && Array.isArray(canvasConfig.editorButtons) && canvasConfig.editorButtons.length > 0);
+};
 export var isRce5Disabled = function isRce5Disabled(flags) {
   return !(flags === null || flags === void 0 ? void 0 : flags.isNewRCEEnabled) && !(flags === null || flags === void 0 ? void 0 : flags.isNewRCERendererEnabled);
 };

package/es/common/components/SDKApp/index.js

@@ -21,6 +21,7 @@ import { set } from "../../actions/ui.js";
 import { setAPIEndpoint, setCanvasOrigin, setUserToken } from "../../actions/config.js";
 import { setContextUuid, setOutcomesEndpoint, setOutcomesToken } from "../../actions/outcomes.js";
 import { addFeatures, removeFeatures } from "../../actions/features.js";
+import { setGradeByQuestionEnabled } from "../../actions/grading.js";
 import renderAlerts from "../../util/renderAlerts.js";
 var styles = {
   componentId: 'fzweS',
@@ -85,6 +86,10 @@ export var SDKApp = (_dec = themeable(theme, styles), _dec(_class = (_temp = _cl
       if (this.props.itemBankSharingEnabled) {
         this.store.dispatch(addFeatures('item_bank_sharing'));
       }
+
+      if (this.props.gradeByQuestionEnabled !== null) {
+        this.store.dispatch(setGradeByQuestionEnabled(this.props.gradeByQuestionEnabled));
+      }
     }
   }, {
     key: "componentDidMount",
@@ -130,6 +135,10 @@ export var SDKApp = (_dec = themeable(theme, styles), _dec(_class = (_temp = _cl
         var toggleFeature = newProps.itemBankSharingEnabled ? addFeatures : removeFeatures;
         this.store.dispatch(toggleFeature('item_bank_sharing'));
       }
+
+      if (newProps.gradeByQuestionEnabled !== this.props.gradeByQuestionEnabled && this.props.gradeByQuestionEnabled !== null) {
+        this.store.dispatch(setGradeByQuestionEnabled(newProps.gradeByQuestionEnabled));
+      }
     }
   }, {
     key: "render",
@@ -156,6 +165,7 @@ export var SDKApp = (_dec = themeable(theme, styles), _dec(_class = (_temp = _cl
   appContainer: CustomPropTypes.selectors.isRequired,
   children: PropTypes.node.isRequired,
   contextUuid: PropTypes.string,
+  gradeByQuestionEnabled: PropTypes.bool,
   itemBankSharingEnabled: PropTypes.bool,
   // ESLint seems to this the "locale" prop is unused even though it definitely is
   locale: PropTypes.string,
@@ -182,6 +192,7 @@ export var SDKApp = (_dec = themeable(theme, styles), _dec(_class = (_temp = _cl
   locale: PropTypes.string
 }, _class2.defaultProps = {
   contextUuid: '',
+  gradeByQuestionEnabled: null,
   itemBankSharingEnabled: false,
   locale: null,
   outcomesEndpoint: null,

package/es/common/components/layout/sidebar/Sidebar/index.js

@@ -21,9 +21,9 @@ import { View } from '@instructure/ui-view';
 import { themeable } from '@instructure/ui-themeable';
 import { Heading } from '@instructure/ui-heading';
 import t from '@instructure/quiz-i18n/es/format-message';
+import { INSTRUCTIONS_SCROLL_KEY, RESULTS_SCROLL_KEY, SIDEBAR_NAV_ID, TITLE_SCROLL_KEY } from '@instructure/quiz-common';
 import { onPhone } from "../../../../util/windowChecks.js";
 import CustomPropTypes from "../../../../util/CustomPropTypes.js";
-import { SIDEBAR_NAV_ID } from '@instructure/quiz-common';
 import noop from "../../../../util/noop.js";
 import Pin from "./Pin.js";
 var styles = {
@@ -55,7 +55,11 @@ var _ref2 = /*#__PURE__*/React.createElement(IconQuizInstructionsLine, {
   color: "primary"
 });
 
-var _ref3 = /*#__PURE__*/React.createElement(IconPinSolid, null);
+var _ref3 = /*#__PURE__*/React.createElement(IconQuizInstructionsLine, {
+  color: "primary"
+});
+
+var _ref4 = /*#__PURE__*/React.createElement(IconPinSolid, null);
 
 export var Sidebar = (_dec = themeable(theme, styles), _dec(_class = (_temp = _class2 = /*#__PURE__*/function (_Component) {
   _inherits(Sidebar, _Component);
@@ -76,13 +80,19 @@ export var Sidebar = (_dec = themeable(theme, styles), _dec(_class = (_temp = _c
     _this.scrollToTitle = function (e) {
       e.preventDefault(); // prevent default link navigation
 
-      _this.props.scrollToItem(null)('title');
+      _this.props.scrollToItem(null)(TITLE_SCROLL_KEY);
     };
 
     _this.scrollToInfo = function (e) {
       e.preventDefault(); // prevent default link navigation
 
-      _this.props.scrollToItem(null)('instructions');
+      _this.props.scrollToItem(null)(INSTRUCTIONS_SCROLL_KEY);
+    };
+
+    _this.scrollToResults = function (e) {
+      e.preventDefault(); // prevent default link navigation
+
+      _this.props.scrollToItem(null)(RESULTS_SCROLL_KEY);
     };
 
     _this.toggleSidebar = function () {
@@ -126,6 +136,10 @@ export var Sidebar = (_dec = themeable(theme, styles), _dec(_class = (_temp = _c
   }, {
     key: "renderTitle",
     value: function renderTitle() {
+      if (this.props.grading) {
+        return;
+      }
+
       return /*#__PURE__*/React.createElement("div", {
         className: styles.actionableInfo
       }, /*#__PURE__*/React.createElement(Link, {
@@ -143,6 +157,10 @@ export var Sidebar = (_dec = themeable(theme, styles), _dec(_class = (_temp = _c
   }, {
     key: "renderInstructions",
     value: function renderInstructions() {
+      if (this.props.grading) {
+        return;
+      }
+
       return /*#__PURE__*/React.createElement("div", {
         className: styles.actionableInfo
       }, /*#__PURE__*/React.createElement(Link, {
@@ -159,6 +177,29 @@ export var Sidebar = (_dec = themeable(theme, styles), _dec(_class = (_temp = _c
         tabIndex: "-1"
       }, t('Instructions'))));
     }
+  }, {
+    key: "renderResults",
+    value: function renderResults() {
+      if (!this.props.grading) {
+        return;
+      }
+
+      return /*#__PURE__*/React.createElement("div", {
+        className: styles.actionableInfo
+      }, /*#__PURE__*/React.createElement(Link, {
+        href: "#",
+        margin: "small",
+        forceButtonRole: false,
+        onClick: this.scrollToResults,
+        renderIcon: _ref3,
+        "data-automation": "sidebar-results-button"
+      }, /*#__PURE__*/React.createElement(ScreenReaderContent, null, t('Navigate to results'))), /*#__PURE__*/React.createElement(PresentationContent, null, /*#__PURE__*/React.createElement("span", {
+        className: styles.description,
+        "data-automation": "sidebar-results-text",
+        onClick: this.scrollToResults,
+        tabIndex: "-1"
+      }, t('Results'))));
+    }
   }, {
     key: "renderSidebarHeader",
     value: function renderSidebarHeader() {
@@ -256,7 +297,7 @@ export var Sidebar = (_dec = themeable(theme, styles), _dec(_class = (_temp = _c
         size: "x-small",
         "aria-label": t('Pinned Questions'),
         role: "img"
-      }, _ref3))), /*#__PURE__*/React.createElement("div", {
+      }, _ref4))), /*#__PURE__*/React.createElement("div", {
         className: closedClasses
       }, pinnedItems.map(function (pin) {
         return /*#__PURE__*/React.createElement(Pin, {
@@ -286,7 +327,7 @@ export var Sidebar = (_dec = themeable(theme, styles), _dec(_class = (_temp = _c
         ,
         onClick: noop,
         id: SIDEBAR_NAV_ID
-      }, this.renderSidebarHeader(), this.renderTotalPointsPossible(), this.renderPinned(), this.renderTitle(), this.renderInstructions(), /*#__PURE__*/React.createElement("div", {
+      }, this.renderSidebarHeader(), this.renderTotalPointsPossible(), this.renderPinned(), this.renderTitle(), this.renderInstructions(), this.renderResults(), /*#__PURE__*/React.createElement("div", {
         className: styles.sidebarContent
       }, this.props.children)))));
     }
@@ -296,6 +337,7 @@ export var Sidebar = (_dec = themeable(theme, styles), _dec(_class = (_temp = _c
   return Sidebar;
 }(Component), _class2.propTypes = {
   children: PropTypes.oneOfType([PropTypes.element, PropTypes.arrayOf(PropTypes.element), PropTypes.node]).isRequired,
+  grading: PropTypes.bool,
   taking: PropTypes.bool,
   scrollToItem: CustomPropTypes.higherOrderFunction.isRequired,
   sidebarOpen: PropTypes.bool.isRequired,
@@ -310,6 +352,7 @@ export var Sidebar = (_dec = themeable(theme, styles), _dec(_class = (_temp = _c
   totalPointsPossible: PropTypes.number,
   shouldCloseOnBlur: PropTypes.bool
 }, _class2.defaultProps = {
+  grading: false,
   taking: false,
   title: null,
   pinnedItems: List(),

package/es/common/components/layout/sidebar/SidebarItem/presenter.js

@@ -110,7 +110,7 @@ export var SidebarItem = (_dec = themeable(theme, styles), _dec(_class = (_temp
       return /*#__PURE__*/React.createElement(Link, {
         href: "#",
         size: "small",
-        margin: "small",
+        margin: "0 small",
         isWithinText: false,
         forceButtonRole: false,
         onClick: this.scrollToItem,

package/es/common/components/resources/item/ItemEdit/presenter.js

@@ -174,7 +174,7 @@ ItemEdit.propTypes = {
   parentType: PropTypes.string.isRequired,
   partialDeepScoringEnabled: PropTypes.bool,
   partialScoringEnabled: PropTypes.bool,
-  quizId: PropTypes.string.isRequired,
+  quizId: PropTypes.string,
   screenreaderNotification: PropTypes.func.isRequired,
   setOneQuestionAtATime: PropTypes.func.isRequired,
   setUploadStatus: PropTypes.func.isRequired,
@@ -196,6 +196,7 @@ ItemEdit.defaultProps = {
   outcomesToken: null,
   partialDeepScoringEnabled: false,
   partialScoringEnabled: false,
+  quizId: null,
   initialFocusId: null,
   showCalculator: false,
   validationErrorsFromApi: {}

package/es/common/components/resources/quiz/info/QuizInfo.js

@@ -3,6 +3,7 @@ import _createClass from "@babel/runtime/helpers/esm/createClass";
 import _inherits from "@babel/runtime/helpers/esm/inherits";
 import _createSuper from "@babel/runtime/helpers/esm/createSuper";
 import React, { Component } from 'react';
+import { INSTRUCTIONS_SCROLL_KEY, TITLE_SCROLL_KEY } from '@instructure/quiz-common';
 import ScrollableQuizTitle from "../title/Title.js";
 import ScrollableQuizInstructions from "../instructions/Instructions.js";
 export var QuizInfo = /*#__PURE__*/function (_Component) {
@@ -20,9 +21,9 @@ export var QuizInfo = /*#__PURE__*/function (_Component) {
     key: "render",
     value: function render() {
       return /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(ScrollableQuizTitle, Object.assign({}, this.props, {
-        scrollKey: "title"
+        scrollKey: TITLE_SCROLL_KEY
       })), /*#__PURE__*/React.createElement(ScrollableQuizInstructions, Object.assign({}, this.props, {
-        scrollKey: "instructions"
+        scrollKey: INSTRUCTIONS_SCROLL_KEY
       })));
     }
   }]);

package/es/common/components/shared/PrintTrigger/presenter.js

@@ -128,7 +128,7 @@ export var PrintTrigger = /*#__PURE__*/function (_Component) {
   return PrintTrigger;
 }(Component);
 PrintTrigger.propTypes = {
-  activeQuizId: PropTypes.string.isRequired,
+  activeQuizId: PropTypes.string,
   appContainer: CustomPropTypes.selectors,
   asyncSampleItemsEnabled: PropTypes.bool,
   bankQuizEntryIds: PropTypes.arrayOf(PropTypes.string),
@@ -144,6 +144,7 @@ PrintTrigger.propTypes = {
   setPrintFontSize: PropTypes.func.isRequired
 };
 PrintTrigger.defaultProps = {
+  activeQuizId: null,
   appContainer: null,
   asyncSampleItemsEnabled: false,
   bankQuizEntryIds: [],