feat(drag-in-the-blank): remove lodash where possible to improve bundle size PD-5076

Author: PatriciaRomaniuc

packages/drag-in-the-blank/configure/src/__tests__/choice.test.jsx

@@ -1,6 +1,6 @@
 import { shallow } from 'enzyme';
 import React from 'react';
-import Choice, { BlankContent, tileSource } from '../choice';
+import Choice, { tileSource } from '../choice';
 
 describe('Choice', () => {
   let onClick;

packages/drag-in-the-blank/configure/src/choices.jsx

@@ -3,12 +3,12 @@ import ReactDOM from 'react-dom';
 import PropTypes from 'prop-types';
 import { EditableHtml } from '@pie-lib/pie-toolbox/editable-html';
 import { renderMath } from '@pie-lib/pie-toolbox/math-rendering';
-import find from 'lodash/find';
+import { AlertDialog } from '@pie-lib/pie-toolbox/config-ui';
 import Button from '@material-ui/core/Button';
+import { withStyles } from '@material-ui/core/styles';
+
 import Choice from './choice';
 import { choiceIsEmpty } from './markupUtils';
-import { withStyles } from '@material-ui/core/styles';
-import { AlertDialog } from '@pie-lib/pie-toolbox/config-ui';
 
 const styles = (theme) => ({
   design: {
@@ -201,7 +201,7 @@ export class Choices extends React.Component {
     }
 
     // if duplicates not allowed, remove the choices that are used to define the correct response
-    return choices.filter((choice) => !find(correctResponse, (v) => v === choice.id));
+    return choices.filter((choice) => !Object.values(correctResponse).includes(choice.id));
   };
 
   render() {

packages/drag-in-the-blank/configure/src/markupUtils.js

@@ -1,5 +1,4 @@
 import escape from 'lodash/escape';
-import isUndefined from 'lodash/isUndefined';
 
 export const createElementFromHTML = (htmlString) => {
   const div = document.createElement('div');
@@ -47,7 +46,7 @@ export const processMarkup = (markup) => {
     markup: slateMarkup.innerHTML,
     choices: choices,
     correctResponse: choices.reduce((obj, c, index) => {
-      obj[index] = (!isUndefined(c.id) && c.id) || '';
+      obj[index] = (c.id !== undefined  && c.id) || '';
 
       return obj;
     }, {}),

packages/drag-in-the-blank/controller/src/index.js

@@ -1,4 +1,3 @@
-import reduce from 'lodash/reduce';
 import isEmpty from 'lodash/isEmpty';
 import { getAllCorrectResponses, choiceIsEmpty } from './utils';
 import { lockChoices, getShuffledChoices, partialScoring } from '@pie-lib/pie-toolbox/controller-utils';
@@ -29,9 +28,9 @@ export function model(question, session, env, updateSession) {
       const { value } = session || {};
 
       for (let i = 0; i < numberOfPossibleResponses; i++) {
-        const result = reduce(
-          allCorrectResponses,
-          (obj, choices, key) => {
+        const result = Object.keys(allCorrectResponses).reduce(
+          (obj, key) => {
+            const choices = allCorrectResponses[key];
             const answer = (value && value[key]) || '';
 
             obj.feedback[key] = choices[i] === answer;
@@ -96,9 +95,9 @@ export const getScore = (config, session) => {
   const { value } = session || {};
 
   for (let i = 0; i < numberOfPossibleResponses; i++) {
-    const result = reduce(
-      allCorrectResponses,
-      (total, choices, key) => {
+    const result = Object.keys(allCorrectResponses).reduce(
+      (total, key) => {
+        const choices = allCorrectResponses[key];
         const answer = (value && value[key]) || '';
 
         if (choices[i] === answer) {

packages/drag-in-the-blank/controller/src/utils.js

@@ -1,33 +1,24 @@
 import cloneDeep from 'lodash/cloneDeep';
-import reduce from 'lodash/reduce';
 
 const replaceHtmlRegex = /<(?!img)[^>]*>?/gm;
 
-export const getAllCorrectResponses = ({ correctResponse, alternateResponses }) => {
-  return reduce(
-    correctResponse || {},
-    (obj, val, key) => {
-      obj.possibleResponses[key] = [val];
+export const getAllCorrectResponses = ({ correctResponse = {}, alternateResponses = {} }) =>
+  Object.entries(correctResponse).reduce(
+    (acc, [key, val]) => {
+      acc.possibleResponses[key] = [val, ...(alternateResponses[key] ? cloneDeep(alternateResponses[key]) : [])];
 
-      if (alternateResponses && alternateResponses[key]) {
-        obj.possibleResponses[key] = [...obj.possibleResponses[key], ...cloneDeep(alternateResponses[key])];
-      }
+      const length = acc.possibleResponses[key].length;
+      acc.numberOfPossibleResponses = acc.numberOfPossibleResponses === undefined
+        ? length
+        : Math.min(acc.numberOfPossibleResponses, length);
 
-      if (
-        obj.numberOfPossibleResponses === undefined ||
-        obj.numberOfPossibleResponses > obj.possibleResponses[key].length
-      ) {
-        obj.numberOfPossibleResponses = obj.possibleResponses[key].length;
-      }
-
-      return obj;
+      return acc;
     },
     {
       possibleResponses: {},
       numberOfPossibleResponses: undefined,
     },
   );
-};
 
 export const choiceIsEmpty = (choice) => {
   if (choice) {