@instructure/outcomes-ui 3.1.0 → 3.2.0

package/es/components/Alignment/__tests__/index.test.js

@@ -4,8 +4,11 @@ import sinon from 'sinon';
 import { mount, shallow } from 'enzyme';
 import { IconOutcomesLine, IconTrashLine } from '@instructure/ui-icons';
 import { Link } from '@instructure/ui-link';
+import { Text } from '@instructure/ui-text';
 import Alignment from "../index.js";
 import checkA11y from "../../../test/checkA11y.js";
+import { Pill } from '@instructure/ui-pill';
+import { Tooltip } from '@instructure/ui-tooltip';
 describe('Alignment', function () {
   function makeProps() {
     var props = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : {};
@@ -19,29 +22,131 @@ describe('Alignment', function () {
       viewAlignment: sinon.spy(),
       removeAlignment: sinon.spy(),
       isOpen: false,
-      readOnly: false
+      readOnly: false,
+      scope: 'artifactType:artifactId',
+      index: 0
     }, props);
   }
-  it('includes an icon', function () {
-    var wrapper = mount( /*#__PURE__*/React.createElement(Alignment, makeProps()), {
+  it('shows source context name', function () {
+    var props = makeProps({
+      outcome: {
+        id: '1',
+        label: 'FOO',
+        title: 'User can foo a bar',
+        source_context_info: {
+          name: 'Source Context'
+        }
+      }
+    });
+    var wrapper = mount( /*#__PURE__*/React.createElement(Alignment, props), {
       disableLifecycleMethods: true
     });
+    var link = wrapper.find(Text).last();
+    expect(link.text()).to.equal('Source Context');
+  });
+  it('handles null source context name', function () {
+    var props = makeProps({
+      outcome: {
+        id: '1',
+        label: 'FOO',
+        title: 'User can foo a bar',
+        source_context_info: {
+          name: null
+        }
+      }
+    });
+    var wrapper = mount( /*#__PURE__*/React.createElement(Alignment, props));
+    var link = wrapper.find(Text).last();
+    expect(link.text()).to.equal('');
+  });
+  it('handles null source context info', function () {
+    var wrapper = mount( /*#__PURE__*/React.createElement(Alignment, makeProps()));
+    var link = wrapper.find(Text).last();
+    expect(link).to.have.length(1);
+    expect(link.text()).to.equal('User can foo a bar');
+  });
+  describe('renderOutcomeDecoration', function () {
+    function getDecoratedOutcome(decorator) {
+      return makeProps({
+        outcome: {
+          id: '1',
+          label: 'FOO',
+          title: 'User can foo a bar',
+          source_context_info: {
+            name: null
+          },
+          decorator: decorator
+        }
+      });
+    }
+    it('does not decorate if there is no decorator', function () {
+      var wrapper = mount( /*#__PURE__*/React.createElement(Alignment, makeProps()));
+      var pill = wrapper.find(Pill).last();
+      expect(pill).to.have.length(0);
+    });
+    it('does not decorate if decorator is HIDE', function () {
+      var props = getDecoratedOutcome('HIDE');
+      var wrapper = mount( /*#__PURE__*/React.createElement(Alignment, props));
+      var pill = wrapper.find(Pill).last();
+      expect(pill).to.have.length(0);
+    });
+    it('decorates if decorator is SUB_ACCOUNT_OUTCOME', function () {
+      var props = getDecoratedOutcome('SUB_ACCOUNT_OUTCOME');
+      var wrapper = mount( /*#__PURE__*/React.createElement(Alignment, props));
+      var pill = wrapper.find(Pill).last();
+      expect(pill).to.have.length(1);
+      expect(pill.props().color).to.equal('primary');
+      expect(pill.text()).to.equal('Sub-Account Outcome');
+      var tip = wrapper.find(Tooltip).last();
+      expect(tip).to.have.length(0);
+    });
+    it('decorates if decorator is NOT_IN_SUB_ACCOUNT', function () {
+      var props = getDecoratedOutcome('NOT_IN_SUB_ACCOUNT');
+      var wrapper = mount( /*#__PURE__*/React.createElement(Alignment, props));
+      var pill = wrapper.find(Pill).last();
+      expect(pill).to.have.length(1);
+      expect(pill.props().color).to.equal('danger');
+      expect(pill.text()).to.equal('Not in this Sub-Account');
+      var tip = wrapper.find(Tooltip).last();
+      expect(tip).to.have.length(1);
+      expect(tip.props().renderTip).to.equal('To add this outcome, navigate to the Outcomes Management page.');
+    });
+    it('decorates if decorator is COURSE_OUTCOME', function () {
+      var props = getDecoratedOutcome('COURSE_OUTCOME');
+      var wrapper = mount( /*#__PURE__*/React.createElement(Alignment, props));
+      var pill = wrapper.find(Pill).last();
+      expect(pill).to.have.length(1);
+      expect(pill.props().color).to.equal('primary');
+      expect(pill.text()).to.equal('Course Outcome');
+      var tip = wrapper.find(Tooltip).last();
+      expect(tip).to.have.length(0);
+    });
+    it('decorates if decorator is NOT_IN_COURSE', function () {
+      var props = getDecoratedOutcome('NOT_IN_COURSE');
+      var wrapper = mount( /*#__PURE__*/React.createElement(Alignment, props));
+      var pill = wrapper.find(Pill).last();
+      expect(pill).to.have.length(1);
+      expect(pill.props().color).to.equal('danger');
+      expect(pill.text()).to.equal('Not in this Course');
+      var tip = wrapper.find(Tooltip).last();
+      expect(tip).to.have.length(1);
+      expect(tip.props().renderTip).to.equal('To add this outcome, navigate to the Outcomes Management page.');
+    });
+  });
+  it('includes an icon', function () {
+    var wrapper = mount( /*#__PURE__*/React.createElement(Alignment, makeProps()));
     expect(wrapper.find(IconOutcomesLine)).to.have.length(1);
   });
   it('includes a delete button', function () {
     var props = makeProps();
-    var wrapper = mount( /*#__PURE__*/React.createElement(Alignment, props), {
-      disableLifecycleMethods: true
-    });
+    var wrapper = mount( /*#__PURE__*/React.createElement(Alignment, props));
     expect(wrapper.find(IconTrashLine)).to.have.length(1);
   });
   it('does not include a delete button if readOnly', function () {
     var props = makeProps({
       readOnly: true
     });
-    var wrapper = shallow( /*#__PURE__*/React.createElement(Alignment, props), {
-      disableLifecycleMethods: true
-    });
+    var wrapper = shallow( /*#__PURE__*/React.createElement(Alignment, props));
     expect(wrapper.find('Button')).to.have.length(0);
   });
   it('calls removeAlignment when delete is clicked', function () {

package/es/components/Alignment/index.js

@@ -10,29 +10,83 @@ import PropTypes from 'prop-types';
 import { IconButton } from '@instructure/ui-buttons';
 import { Text } from '@instructure/ui-text';
 import { Link } from '@instructure/ui-link';
-import { IconTrashLine, IconOutcomesLine } from '@instructure/ui-icons';
+import { IconTrashLine, IconOutcomesLine, IconSubaccountsLine, IconCoursesLine, IconWarningLine } from '@instructure/ui-icons';
 import { View } from '@instructure/ui-view';
 import { withStyle, jsx } from '@instructure/emotion';
 import OutcomeViewModal from "../OutcomeViewModal/index.js";
 import generateComponentTheme from "../theme.js";
 import generateStyle from "./styles.js";
 import { stylesShape } from "../../store/shapes.js";
+import { Pill } from '@instructure/ui-pill';
+import { Tooltip } from '@instructure/ui-tooltip';
 var Alignment = (_dec = withStyle(generateStyle, generateComponentTheme), _dec(_class = (_class2 = /*#__PURE__*/function (_React$Component) {
   _inherits(Alignment, _React$Component);
   var _super = _createSuper(Alignment);
   function Alignment() {
+    var _this;
     _classCallCheck(this, Alignment);
-    return _super.apply(this, arguments);
+    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.renderWithTooltip = function (Icon, color, text) {
+      return jsx("span", {
+        css: _this.props.styles.rightAligned
+      }, jsx(Tooltip, {
+        renderTip: t('To add this outcome, navigate to the Outcomes Management page.')
+      }, jsx(Pill, {
+        renderIcon: jsx(Icon, null),
+        color: color,
+        margin: "xxx-small"
+      }, text)));
+    };
+    _this.renderWithoutTooltip = function (Icon, color, text) {
+      return jsx("span", {
+        css: _this.props.styles.rightAligned
+      }, jsx(Pill, {
+        renderIcon: jsx(Icon, null),
+        color: color,
+        margin: "xxx-small"
+      }, text));
+    };
+    return _this;
   }
   _createClass(Alignment, [{
     key: "focus",
     value: function focus() {
       this.focusLink.focus();
     }
+  }, {
+    key: "getIcon",
+    value: function getIcon(decorator, color) {
+      if (color === 'danger') {
+        return IconWarningLine;
+      }
+      return decorator !== null && decorator !== void 0 && decorator.includes('ACCOUNT') ? IconSubaccountsLine : IconCoursesLine;
+    }
+  }, {
+    key: "getPillText",
+    value: function getPillText(decorator, color) {
+      if (color === 'danger') {
+        return decorator !== null && decorator !== void 0 && decorator.includes('ACCOUNT') ? t('Not in this Sub-Account') : t('Not in this Course');
+      }
+      return decorator !== null && decorator !== void 0 && decorator.includes('ACCOUNT') ? t('Sub-Account Outcome') : t('Course Outcome');
+    }
+  }, {
+    key: "renderOutcomeDecoration",
+    value: function renderOutcomeDecoration(index, outcome) {
+      var decorator = outcome.decorator;
+      var display = ['SUB_ACCOUNT_OUTCOME', 'NOT_IN_SUB_ACCOUNT', 'COURSE_OUTCOME', 'NOT_IN_COURSE'].includes(decorator);
+      var color = decorator !== null && decorator !== void 0 && decorator.startsWith('NOT_IN') ? 'danger' : 'primary';
+      var Icon = this.getIcon(decorator, color);
+      var text = this.getPillText(decorator, color);
+      var renderFunction = color === 'danger' ? this.renderWithTooltip : this.renderWithoutTooltip;
+      return display && renderFunction(Icon, color, text);
+    }
   }, {
     key: "render",
     value: function render() {
-      var _this = this;
+      var _this2 = this;
       var _this$props = this.props,
         index = _this$props.index,
         outcome = _this$props.outcome,
@@ -70,16 +124,22 @@ var Alignment = (_dec = withStyle(generateStyle, generateComponentTheme), _dec(_
         css: this.props.innerLinkText
       }, jsx(View, {
         as: "div",
-        margin: "xx-small"
+        margin: "none none none xx-small"
       }, jsx(Link, {
         onClick: viewAlignment,
         ref: function ref(link) {
-          _this.focusLink = link;
+          _this2.focusLink = link;
         } // eslint-disable-line immutable/no-mutation
       }, jsx(Text, {
-        weight: "bold"
-      }, outcome.title)))))), !readOnly && jsx("span", {
-        css: this.props.styles.delete,
+        weight: "bold",
+        lineHeight: "condensed"
+      }, outcome.title)), outcome.source_context_info && jsx(Text, {
+        as: "div",
+        weight: "light",
+        size: "x-small",
+        lineHeight: "condensed"
+      }, outcome.source_context_info.name))))), this.renderOutcomeDecoration(index, outcome), !readOnly && jsx("span", {
+        css: this.props.styles.rightAligned,
         "data-automation": "alignment-delete"
       }, jsx(IconButton, {
         screenReaderLabel: "",
@@ -104,7 +164,14 @@ var Alignment = (_dec = withStyle(generateStyle, generateComponentTheme), _dec(_
 }(React.Component), _class2.propTypes = {
   outcome: PropTypes.shape({
     label: PropTypes.string.isRequired,
-    title: PropTypes.string.isRequired
+    title: PropTypes.string.isRequired,
+    in_launch_context: PropTypes.bool,
+    launch_context_type: PropTypes.string,
+    source_context_info: PropTypes.shape({
+      name: PropTypes.string,
+      context_type: PropTypes.string,
+      uuid: PropTypes.string
+    })
   }).isRequired,
   removeAlignment: PropTypes.func.isRequired,
   viewAlignment: PropTypes.func.isRequired,

package/es/components/Alignment/index.stories.js

@@ -15,6 +15,8 @@ export var standard = function standard() {
     artifactTypeName: "Quiz",
     displayMasteryDescription: true,
     displayMasteryPercentText: true,
-    readOnly: boolean('Read Only', false)
+    readOnly: boolean('Read Only', false),
+    scope: "Quiz::QuizId",
+    index: 1
   });
 };

package/es/components/Alignment/styles.js

@@ -28,7 +28,7 @@ var generateStyle = function generateStyle() {
       overflow: 'hidden',
       textOverflow: 'ellipsis'
     },
-    delete: {
+    rightAligned: {
       flex: '0 0 1rem'
     }
   };

package/es/components/AlignmentItem/__tests__/index.test.js

@@ -136,7 +136,7 @@ describe('AlignmentItem', function () {
       disableLifecycleMethods: true
     });
     wrapper.find('Checkbox').simulate('change');
-    expect(props.selectOutcomeIds.calledWith([1]));
+    expect(props.selectOutcomeIds.calledWith(['1'])).to.be.true;
   });
   it('calls deselectOutcomeIds when selected and user clicks', function () {
     var isOutcomeSelected = sinon.stub().withArgs(1).returns(true);
@@ -148,7 +148,7 @@ describe('AlignmentItem', function () {
       disableLifecycleMethods: true
     });
     wrapper.find('Checkbox').simulate('change');
-    expect(props.deselectOutcomeIds.calledWith([1]));
+    expect(props.deselectOutcomeIds.calledWith(['1'])).to.be.true;
   });
   it('displays the popover when the outcome title is truncated', function () {
     var widget = shallow( /*#__PURE__*/React.createElement(AlignmentItem, makeProps()), {

package/es/components/AlignmentList/index.js

@@ -274,7 +274,7 @@ var AlignmentList = (_dec = withStyle(generateStyle, generateComponentTheme), _d
         onModalOpen = _this$props3.onModalOpen,
         onModalClose = _this$props3.onModalClose,
         scope = _this$props3.scope,
-        sharedContexts = _this$props3.sharedContexts,
+        launchContexts = _this$props3.launchContexts,
         artifactTypeName = _this$props3.artifactTypeName,
         displayMasteryDescription = _this$props3.displayMasteryDescription,
         displayMasteryPercentText = _this$props3.displayMasteryPercentText,
@@ -287,7 +287,7 @@ var AlignmentList = (_dec = withStyle(generateStyle, generateComponentTheme), _d
         onUpdate: onUpdate,
         trigger: this,
         scope: scope,
-        sharedContexts: sharedContexts,
+        launchContexts: launchContexts,
         artifactTypeName: artifactTypeName,
         displayMasteryDescription: displayMasteryDescription,
         displayMasteryPercentText: displayMasteryPercentText,

package/es/components/AlignmentWidget/index.js

@@ -88,7 +88,7 @@ var AlignmentWidget = (_dec = withStyle(generateStyle, generateComponentTheme),
         margin: "small 0"
       }, alignedOutcomes.length > 0 && jsx(List.Item, {
         key: "delimiter-0"
-      }), alignedOutcomes.map(function (outcome, index) {
+      }, jsx("div", null)), alignedOutcomes.map(function (outcome, index) {
         return jsx(List.Item, {
           padding: "0 small 0 medium",
           key: outcome.id
@@ -103,7 +103,7 @@ var AlignmentWidget = (_dec = withStyle(generateStyle, generateComponentTheme),
         }));
       }), alignedOutcomes.length > 0 && jsx(List.Item, {
         key: "delimiter-1"
-      }));
+      }, jsx("div", null)));
     };
     _this.renderTray = function () {
       var _this$props3 = _this.props,

package/es/components/FlashAlert/index.test.js

@@ -82,7 +82,7 @@ describe('FlashAlert', function () {
   });
   describe('showFlashSuccess', function () {
     it('calls render', function () {
-      var showAlert = showFlashSuccess();
+      var showAlert = showFlashSuccess('showFlashSuccess');
       showAlert();
       expect(renderSpy).to.have.been.called;
     });

package/es/components/OutcomeCheckbox/__tests__/index.test.js

@@ -98,7 +98,7 @@ describe('OutcomeCheckbox', function () {
     });
     var change = wrapper.find(Checkbox).prop('onChange');
     change();
-    expect(props.selectOutcomeIds.calledWith([101]));
+    expect(props.selectOutcomeIds.calledWith(['101'])).to.be.true;
   });
   it('calls deselectOutcomeIds when selected and user clicks', function () {
     var isOutcomeSelected = sinon.stub().withArgs(101).returns(true);
@@ -110,7 +110,7 @@ describe('OutcomeCheckbox', function () {
     });
     var change = wrapper.find(Checkbox).prop('onChange');
     change();
-    expect(props.deselectOutcomeIds.calledWith([101]));
+    expect(props.deselectOutcomeIds.calledWith(['101'])).to.be.true;
   });
   it('meets a11y standards', function () {
     return checkA11y( /*#__PURE__*/React.createElement(OutcomeCheckbox, makeProps()));

package/es/components/OutcomeDescription/__tests__/index.test.js

@@ -13,7 +13,7 @@ describe('OutcomeDescription', function () {
       truncated: true,
       ratings: ratings,
       calculationMethod: 'latest',
-      calculationInt: {}
+      calculationInt: null
     }, props);
   }
   it('renders outcome description', function () {

package/es/components/OutcomeDescription/index.js

@@ -120,6 +120,8 @@ var OutcomeDescription = function OutcomeDescription(_ref) {
     }, friendlyDescription)));
   };
   var renderRatingsAndCalculation = function renderRatingsAndCalculation() {
+    var calculationMethodRequiringCalculationInt = [N_MASTERY, STANDARD_DECAYING_AVERAGE, WEIGHTED_AVERAGE, DECAYING_AVERAGE];
+    var hasRequireData = calculationMethodRequiringCalculationInt.includes(calculationMethod) ? calculationInt : true;
     return /*#__PURE__*/React.createElement(View, null, ratings.length > 0 && /*#__PURE__*/React.createElement(View, {
       as: "div",
       margin: "small none"
@@ -128,7 +130,7 @@ var OutcomeDescription = function OutcomeDescription(_ref) {
       masteryPercent: masteryPercent,
       pointsPossible: pointsPossible,
       isTray: isTray
-    })), calculationMethod && calculationInt && /*#__PURE__*/React.createElement(Flex, {
+    })), calculationMethod && hasRequireData && /*#__PURE__*/React.createElement(Flex, {
       wrap: "wrap",
       padding: "none small small none"
     }, /*#__PURE__*/React.createElement(Flex.Item, {

package/es/components/OutcomeFolderList/__tests__/index.test.js

@@ -24,7 +24,8 @@ describe('OutcomeFolderList', function () {
     return Object.assign({
       outcomes: outcomes,
       getOutcomeSummary: sinon.spy(),
-      setActiveCollection: sinon.spy()
+      setActiveCollection: sinon.spy(),
+      toggleExpandedIds: sinon.spy()
     }, props);
   }
   it('renders an empty div if there are no ids', function () {

package/es/components/OutcomeLabels/__tests__/index.test.js

@@ -21,7 +21,8 @@ describe('OutcomeLabels', function () {
       title: 'Title3'
     }];
     return Object.assign({
-      outcomes: outcomes
+      outcomes: outcomes,
+      emptyText: 'No Outcomes are currently selected'
     }, props);
   }
   it('renders an icon', function () {

package/es/components/OutcomeLabels/index.js

@@ -28,8 +28,8 @@ var OutcomeLabels = (_dec = withStyle(generateStyle, generateComponentTheme), _d
       }, jsx("span", {
         css: _this.props.styles.pill
       }, str), includeComma && jsx("span", {
-        css: _this.props.styles.comma
-      }, ","));
+        css: _this.props.styles.pill
+      }, ",\xA0"));
     };
     return _this;
   }

package/es/components/OutcomeLabels/styles.js

@@ -13,10 +13,6 @@ var generateStyle = function generateStyle(componentTheme) {
       overflow: 'hidden',
       textOverflow: 'ellipsis',
       whiteSpace: 'nowrap'
-    },
-    comma: {
-      cssFloat: 'left',
-      width: '0.5rem'
     }
   };
 };

package/es/components/OutcomePicker/__tests__/index.test.js

@@ -34,7 +34,10 @@ describe('OutcomePicker', function () {
       treeView: OutcomeTree,
       scope: 'scopeForTest',
       artifactTypeName: '',
-      isSearchLoading: false
+      isSearchLoading: false,
+      toggleExpandedIds: function toggleExpandedIds() {
+        return null;
+      }
     }, props);
   }
   it('passes correct params to OutcomeTags component', function () {
@@ -95,7 +98,7 @@ describe('OutcomePicker', function () {
   it('shows NoResults billboard when there are no outcomes present and single shared context', function () {
     var props = makeProps({
       hasOutcomes: false,
-      sharedContexts: [{
+      launchContexts: [{
         uuid: 'uuid',
         name: 'name'
       }]
@@ -108,7 +111,7 @@ describe('OutcomePicker', function () {
   it('does not display billboard when there are no outcomes present but user can select another context', function () {
     var props = makeProps({
       hasOutcomes: false,
-      sharedContexts: [{
+      launchContexts: [{
         uuid: 'uuid1',
         name: 'name1'
       }, {
@@ -124,7 +127,7 @@ describe('OutcomePicker', function () {
   it('shows the NoResults billboard when there are no outcomes present and single shared context', function () {
     var props = makeProps({
       hasOutcomes: false,
-      sharedContexts: [{
+      launchContexts: [{
         uuid: 'uuid',
         name: 'name'
       }]
@@ -137,7 +140,7 @@ describe('OutcomePicker', function () {
   it('does not display billboard when there are no outcomes present but user can select another context', function () {
     var props = makeProps({
       hasOutcomes: false,
-      sharedContexts: [{
+      launchContexts: [{
         uuid: 'uuid1',
         name: 'name1'
       }, {

package/es/components/OutcomePicker/index.js

@@ -12,7 +12,7 @@ import OutcomeTags from "../OutcomeTags/index.js";
 import OutcomeViewModal from "../OutcomeViewModal/index.js";
 import SearchInput from "../SearchInput/index.js";
 import SearchResults from "../SearchResults/index.js";
-import { outcomeShape, sharedContextsShape } from "../../store/shapes.js";
+import { outcomeShape, launchContextsShape } from "../../store/shapes.js";
 import NoResults from "../NoResults/index.js";
 var OutcomePicker = /*#__PURE__*/function (_React$Component) {
   _inherits(OutcomePicker, _React$Component);
@@ -124,11 +124,11 @@ var OutcomePicker = /*#__PURE__*/function (_React$Component) {
       var _this$props5 = this.props,
         hasOutcomes = _this$props5.hasOutcomes,
         searchText = _this$props5.searchText,
-        sharedContexts = _this$props5.sharedContexts;
-      // If there are shared contexts, we cannot render this billboard because hasOutcomes is evaluated only for
+        launchContexts = _this$props5.launchContexts;
+      // If there are launch contexts, we cannot render this billboard because hasOutcomes is evaluated only for
       // the currently selected context. This would prevent users from selecting another context if the first
-      // context failed to be retrieved OR had no contexts.
-      var hasMultipleContexts = (sharedContexts === null || sharedContexts === void 0 ? void 0 : sharedContexts.length) > 1;
+      // context failed to be retrieved OR had no outcomes.
+      var hasMultipleContexts = (launchContexts === null || launchContexts === void 0 ? void 0 : launchContexts.length) > 1;
       if (!hasOutcomes && !hasMultipleContexts) {
         return /*#__PURE__*/React.createElement(NoResults, null);
       }
@@ -171,12 +171,12 @@ OutcomePicker.propTypes = {
   updateSearchPage: PropTypes.func.isRequired,
   hasOutcomes: PropTypes.bool.isRequired,
   scope: PropTypes.string.isRequired,
-  sharedContexts: sharedContextsShape,
+  launchContexts: launchContextsShape,
   treeView: PropTypes.func.isRequired
 };
 OutcomePicker.defaultProps = {
   focusedOutcome: null,
-  sharedContexts: null,
+  launchContexts: null,
   artifactTypeName: null,
   displayMasteryDescription: false,
   displayMasteryPercentText: false,

package/es/components/OutcomePicker/index.stories.js

@@ -36,6 +36,7 @@ export var collapsed = function collapsed() {
     treeView: function treeView() {
       return /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("br", null), " OutcomeTree Placeholder ");
     },
-    hasOutcomes: true
+    hasOutcomes: true,
+    scope: "outcomePicker::story"
   })));
 };

package/es/components/OutcomePickerLoader/__tests__/index.test.js

@@ -26,21 +26,6 @@ describe('OutcomePickerLoader', function () {
     expect(props.loadOutcomePicker.calledOnce).to.be.true;
     expect(props.loadOutcomePicker.calledWith()).to.be.true;
   });
-  it('calls loadOutcomePicker with sharedContexts on mount', function () {
-    var sharedContexts = [{
-      uuid: 'foo',
-      name: 'bar'
-    }, {
-      uuid: 'fuz',
-      name: 'baz'
-    }];
-    var props = makeProps({
-      sharedContexts: sharedContexts
-    });
-    shallow( /*#__PURE__*/React.createElement(OutcomePickerLoader, props));
-    expect(props.loadOutcomePicker.calledOnce).to.be.true;
-    expect(props.loadOutcomePicker.calledWith(sharedContexts)).to.be.true;
-  });
   it('displays nothing when closed', function () {
     var wrapper = shallow( /*#__PURE__*/React.createElement(OutcomePickerLoader, makeProps()));
     expect(wrapper.equals( /*#__PURE__*/React.createElement("div", null))).to.be.true;

package/es/components/OutcomePickerLoader/index.js

@@ -7,7 +7,7 @@ import PropTypes from 'prop-types';
 import { Spinner } from '@instructure/ui-spinner';
 import { Flex } from '@instructure/ui-flex';
 import t from 'format-message';
-import { sharedContextsShape } from "../../store/shapes.js";
+import { launchContextsShape } from "../../store/shapes.js";
 var OutcomePickerLoader = /*#__PURE__*/function (_React$Component) {
   _inherits(OutcomePickerLoader, _React$Component);
   var _super = _createSuper(OutcomePickerLoader);
@@ -18,10 +18,8 @@ var OutcomePickerLoader = /*#__PURE__*/function (_React$Component) {
   _createClass(OutcomePickerLoader, [{
     key: "componentWillMount",
     value: function componentWillMount() {
-      var _this$props = this.props,
-        loadOutcomePicker = _this$props.loadOutcomePicker,
-        sharedContexts = _this$props.sharedContexts;
-      loadOutcomePicker(sharedContexts);
+      var loadOutcomePicker = this.props.loadOutcomePicker;
+      loadOutcomePicker();
     }
   }, {
     key: "render",
@@ -40,7 +38,7 @@ var OutcomePickerLoader = /*#__PURE__*/function (_React$Component) {
             var OutcomePicker = this.props.outcomePicker;
             return /*#__PURE__*/React.createElement(OutcomePicker, {
               scope: this.props.scope,
-              sharedContexts: this.props.sharedContexts,
+              launchContexts: this.props.launchContexts,
               artifactTypeName: this.props.artifactTypeName,
               displayMasteryDescription: this.props.displayMasteryDescription,
               displayMasteryPercentText: this.props.displayMasteryPercentText,
@@ -73,14 +71,14 @@ OutcomePickerLoader.propTypes = {
   outcomePickerState: PropTypes.string.isRequired,
   outcomePicker: PropTypes.func.isRequired,
   scope: PropTypes.string.isRequired,
-  sharedContexts: sharedContextsShape,
+  launchContexts: launchContextsShape,
   artifactTypeName: PropTypes.string,
   displayMasteryDescription: PropTypes.bool,
   displayMasteryPercentText: PropTypes.bool,
   screenreaderNotification: PropTypes.func
 };
 OutcomePickerLoader.defaultProps = {
-  sharedContexts: null,
+  launchContexts: null,
   artifactTypeName: null,
   displayMasteryDescription: false,
   displayMasteryPercentText: false,