@instructure/quiz-interactions/es/components/categorization/Edit/CategorizationPresenter.js

A React UI component Library for quiz interaction types.

import _classCallCheck from "@babel/runtime/helpers/esm/classCallCheck";
import _createClass from "@babel/runtime/helpers/esm/createClass";
import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
import update from 'immutability-helper';
import findIndex from 'lodash/findIndex';
import omit from 'lodash/omit';
import without from 'lodash/without';
var CategorizationPresenter = /*#__PURE__*/function () {
  function CategorizationPresenter(props) {
    var _this = this;
    _classCallCheck(this, CategorizationPresenter);
    // ===========
    //   ACTIONS - CATEGORIES
    // ===========
    _defineProperty(this, "onCategoryInputChange", function (itemId, e) {
      var categories = update(_this.props.interactionData.categories, _defineProperty({}, itemId, {
        itemBody: {
          $set: e.target.value
        }
      }));
      _this.updateInteractionData({
        categories: categories
      });
    });
    _defineProperty(this, "onCreateCategory", function () {
      var newItemId = _this.props.newId();
      var newItem = {
        id: newItemId,
        itemBody: ''
      };
      var newCategories = update(_this.props.interactionData.categories, _defineProperty({}, newItemId, {
        $set: newItem
      }));
      var newCategoryOrder = update(_this.getCategoryOrder(), {
        $push: [newItemId]
      });
      var newCategoryScoringData = {
        id: newItemId,
        scoringAlgorithm: 'AllOrNothing',
        scoringData: {
          value: []
        }
      };
      var interactionData = update(_this.props.interactionData, {
        categories: {
          $set: newCategories
        },
        categoryOrder: {
          $set: newCategoryOrder
        }
      });
      var scoringData = update(_this.props.scoringData, {
        value: {
          $push: [newCategoryScoringData]
        }
      });
      _this.props.changeItemState({
        interactionData: interactionData,
        scoringData: scoringData
      });
    });
    _defineProperty(this, "onRemoveCategory", function (categoryId) {
      var newCategories = omit(_this.props.interactionData.categories, categoryId);
      var newCategoryOrder = _this.getCategoryOrder().filter(function (c) {
        return c !== categoryId;
      });
      var newDistractors = omit(_this.props.interactionData.distractors, _this.props.scoringData.value.filter(function (item) {
        return item.id === categoryId;
      })[0].scoringData.value);
      var newScoringData = _this.props.scoringData.value.filter(function (item) {
        return item.id !== categoryId;
      });
      var interactionData = update(_this.props.interactionData, {
        categoryOrder: {
          $set: newCategoryOrder
        },
        categories: {
          $set: newCategories
        },
        distractors: {
          $set: newDistractors
        }
      });
      var scoringData = update(_this.props.scoringData, {
        value: {
          $set: newScoringData
        }
      });
      _this.props.changeItemState({
        interactionData: interactionData,
        scoringData: scoringData
      });
    });
    // ===========
    //   ACTIONS - ANSWERS
    // ===========
    _defineProperty(this, "onCreateAnswer", function (categoryId) {
      var newItemId = _this.props.newId();
      var newItem = {
        id: newItemId,
        itemBody: ''
      };
      var newDistractors = update(_this.props.interactionData.distractors, _defineProperty({}, newItemId, {
        $set: newItem
      }));
      var scoringDataCategoryIndex = findIndex(_this.props.scoringData.value, function (item) {
        return item.id === categoryId;
      });
      var interactionData = update(_this.props.interactionData, {
        distractors: {
          $set: newDistractors
        }
      });
      var scoringData = update(_this.props.scoringData, {
        value: _defineProperty({}, scoringDataCategoryIndex, {
          scoringData: {
            value: {
              // because kinesis does not save empty arrays well,
              // we need to guard against this being null
              $apply: function $apply(answersList) {
                return (answersList || []).concat([newItemId]);
              }
            }
          }
        })
      });
      _this.props.changeItemState({
        interactionData: interactionData,
        scoringData: scoringData
      });
    });
    _defineProperty(this, "onRemoveAnswer", function (itemId, categoryId) {
      var newDistractors = omit(_this.props.interactionData.distractors, itemId);
      var scoringDataCategoryIndex = findIndex(_this.props.scoringData.value, function (item) {
        return item.id === categoryId;
      });
      var scoringDataCategory = _this.props.scoringData.value[scoringDataCategoryIndex];
      var newCategScoringDataValues = without(scoringDataCategory.scoringData.value, itemId);
      var interactionData = update(_this.props.interactionData, {
        distractors: {
          $set: newDistractors
        }
      });
      var scoringData = update(_this.props.scoringData, {
        value: _defineProperty({}, scoringDataCategoryIndex, {
          scoringData: {
            value: {
              $set: newCategScoringDataValues
            }
          }
        })
      });
      _this.props.changeItemState({
        interactionData: interactionData,
        scoringData: scoringData
      });
    });
    // ===========
    //   ACTIONS - DISTRACTORS
    // ===========
    _defineProperty(this, "onDistractorInputChange", function (itemId, e) {
      var distractors = update(_this.props.interactionData.distractors, _defineProperty({}, itemId, {
        itemBody: {
          $set: e.target.value
        }
      }));
      _this.updateInteractionData({
        distractors: distractors
      });
    });
    _defineProperty(this, "onRemoveDistractor", function (itemId) {
      var newList = omit(_this.props.interactionData.distractors, itemId);
      var newInteractionData = update(_this.props.interactionData, {
        distractors: {
          $set: newList
        }
      });
      _this.props.changeItemState({
        interactionData: newInteractionData
      });
    });
    this.props = props;
  }
  return _createClass(CategorizationPresenter, [{
    key: "UNSAFE_componentWillReceiveProps",
    value: function UNSAFE_componentWillReceiveProps(props) {
      this.props = props;
    }

    // =============
    //    HELPERS
    // =============
  }, {
    key: "getCategoryOrder",
    value: function getCategoryOrder() {
      // This is to protect against quizzes which were
      // created before categoryOrder was introduced
      var intData = this.props.interactionData;
      return intData.categoryOrder || Object.keys(intData.categories);
    }
  }, {
    key: "updateInteractionData",
    value: function updateInteractionData(updates) {
      this.props.changeItemState({
        interactionData: Object.assign({}, this.props.interactionData || {}, updates)
      });
    }
  }]);
}();
export { CategorizationPresenter as default };