project-booster-vue 9.41.0 → 9.41.1

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "project-booster-vue",
-  "version": "9.41.0",
+  "version": "9.41.1",
   "private": false,
   "scripts": {
     "serve": "vue-cli-service serve",

package/src/components/question/PbQuestion.vue

@@ -352,7 +352,6 @@
 
 <script lang="ts">
 import { defineComponent, PropType } from 'vue';
-import objectPath from 'object-path';
 import MButton from '../mozaic/buttons/MButton.vue';
 import MContainer from '../mozaic/grid/MContainer.vue';
 import MDialog from '../mozaic/dialog/MDialog.vue';
@@ -366,6 +365,7 @@ import PbCard from '../cards/PbCard.vue';
 import PbStickyFooter from '../sticky-footer/PbStickyFooter.vue';
 import { sortAnswers } from './sortAnswers';
 import { areConditionsValid } from '../../services/scenarioConditionals';
+import { decorate } from '@/services/decorate';
 import {
   ScenarioStepAnswer,
   ScenarioStepAnswerDialog,
@@ -383,54 +383,6 @@ const BACK_ICON =
 const INFO_ICON =
   'https://storage.googleapis.com/project-booster-media/mozaic-icons/svg/Navigation_Notification_Information_24px.svg';
 
-// Function used by the scenario conditions
-const getAnswerValue = (answers: Map<string, ScenarioStepAnswer[]>) => {
-  return (answerCode: string, path: string) => {
-    let answerValue: ScenarioStepAnswer | undefined = undefined;
-    if (answers?.get(answerCode)) {
-      const answerValues = answers.get(answerCode) ?? [];
-      answerValue = objectPath.get(answerValues[0], path);
-    }
-    return answerValue;
-  };
-};
-
-export const doEval = (
-  answers: Map<string, ScenarioStepAnswer[]>,
-  valueToEval: string,
-  defaultValue: string,
-  runtimeOptions: any,
-) => {
-  return new Function('getAnswerValue', 'answers', 'defaultValue', 'runtimeOptions', `return ${valueToEval}`).call(
-    this,
-    getAnswerValue(answers),
-    Object.fromEntries(answers),
-    defaultValue,
-    runtimeOptions,
-  );
-};
-
-//TODO Think to move this kind of function in something like "helpers" or "tools"
-// because this is use in multiple components (as PbIncrementalAmountInput.vue),
-// and it shouldn't be in a component.
-export const decorate = (
-  answers: Map<string, ScenarioStepAnswer[]>,
-  runtimeOptions = {},
-  valueToDecorate: string,
-  defaultValue = '',
-): string => {
-  let decoratedValue = valueToDecorate;
-  if (valueToDecorate) {
-    const stringToEval = `\`${valueToDecorate}\``;
-    try {
-      decoratedValue = doEval(answers, stringToEval, defaultValue, runtimeOptions);
-    } catch (error) {
-      decoratedValue = valueToDecorate || defaultValue;
-    }
-  }
-  return decoratedValue;
-};
-
 export default defineComponent({
   name: 'PbQuestion',
 

package/src/components/question/amount-input/PbAmountInput.vue

@@ -63,7 +63,7 @@ import MTextInput from './../../mozaic/text-input/MTextInput.vue';
 import DEFAULT_PAYLOAD from './default-payload.json';
 import { AmountInputPayload } from '@/components/question/amount-input/AmountInput';
 import { ScenarioStepAnswer } from '@/types/pb/Scenario';
-import { decorate } from '@/components/question/PbQuestion.vue';
+import { decorate } from '@/services/decorate';
 
 const BACK_ICON =
   'https://storage.googleapis.com/project-booster-media/mozaic-icons/svg/Navigation_Arrow_Arrow--Left_16px.svg';

package/src/components/question/city-search/PbCitySearch.vue

@@ -106,14 +106,13 @@ import debounce from 'lodash.debounce';
 import merge from 'lodash.merge';
 import initGoogleMapsApi from './google-maps-api';
 import axios from 'axios';
-import objectPath from 'object-path';
 import MFlex from '../../mozaic/flex/MFlex.vue';
 import MButton from '../../mozaic/buttons/MButton.vue';
 import MLink from '../../mozaic/link/MLink.vue';
 import MTextInput from '../../mozaic/text-input/MTextInput.vue';
 import DEFAULT_PAYLOAD from './default-payload.json';
 import { DebouncedFunc } from 'lodash-es';
-import { decorate } from '@/components/question/PbQuestion.vue';
+import { decorate } from '@/services/decorate';
 import { ScenarioStepAnswer } from '@/types/pb/Scenario';
 
 const BACK_ICON =

package/src/components/question/configurations-import/PbConfigurationsImport.vue

@@ -165,7 +165,6 @@ import MLink from '../../../components/mozaic/link/MLink.vue';
 import MNotification from '../../../components/mozaic/notifications/MNotification.vue';
 import PbCard from '../../../components/cards/PbCard.vue';
 import { format } from 'date-fns';
-import objectPath from 'object-path';
 import {
   ConfigurationsImportMultiSelectAction,
   ConfigurationsImportPayload,
@@ -174,7 +173,7 @@ import {
 } from '@/components/question/configurations-import/ConfigurationsImport';
 import { ScenarioStepAnswer } from '@/types/pb/Scenario';
 import { Configuration } from '@/types/pb/Configuration';
-import { decorate } from '@/components/question/PbQuestion.vue';
+import { decorate } from '@/services/decorate';
 
 const BACK_ICON =
   'https://storage.googleapis.com/project-booster-media/mozaic-icons/svg/Navigation_Arrow_Arrow--Left_16px.svg';

package/src/components/question/dimensions-input/PbDimensionsInput.vue

@@ -101,7 +101,7 @@ import MIcon from '../../mozaic/icon/MIcon.vue';
 import { ref } from 'vue';
 import { ScenarioStepAnswer } from '@/types/pb/Scenario';
 import { DimensionsInputPayload } from '@/components/question/dimensions-input/DimensionsInput';
-import { decorate } from '@/components/question/PbQuestion.vue';
+import { decorate } from '@/services/decorate';
 
 const BACK_ICON =
   'https://storage.googleapis.com/project-booster-media/mozaic-icons/svg/Navigation_Arrow_Arrow--Left_16px.svg';

package/src/components/question/incremental-amount-input/PbIncrementalAmountInput.vue

@@ -72,7 +72,7 @@ import MLink from '../../mozaic/link/MLink.vue';
 import MButton from '../../mozaic/buttons/MButton.vue';
 import { ref } from 'vue';
 import { ScenarioStepAnswer } from '@/types/pb/Scenario';
-import { decorate } from '@/components/question/PbQuestion.vue';
+import { decorate } from '@/services/decorate';
 import MQuantitySelector from '../../mozaic/quantityselector/MQuantitySelector.vue';
 import { IncrementalAmountPayload } from '@/components/question/incremental-amount-input/IncrementalAmount';
 
@@ -169,9 +169,6 @@ export default defineComponent({
       let tempPayload = cloneDeep(DEFAULT_PAYLOAD);
       tempPayload = merge(tempPayload, props.payload);
 
-      // This will doEval and decorate dynamically variables from JSON templates
-      // For instance:
-      // "${getAnswerValue('DEVELOPER', 'code') == 'YES' ? 'I'm developer' : 'I'm not developer'}"
       tempPayload.viewModel.label = decorate(props.answers!, props.runtimeOptions, tempPayload.viewModel.label);
       tempPayload.viewModel.subtitle = decorate(props.answers!, props.runtimeOptions, tempPayload.viewModel.subtitle);
 

package/src/components/question/list-select/PbListSelect.vue

@@ -75,15 +75,13 @@
 <script lang="ts">
 import { defineComponent, PropType } from 'vue';
 import { ref, computed, onMounted, Ref } from 'vue';
-import objectPath from 'object-path';
 import MFlex from '../../mozaic/flex/MFlex.vue';
 import MButton from '../../mozaic/buttons/MButton.vue';
 import MLink from '../../mozaic/link/MLink.vue';
 import PbItemsList from '../../items/PbItemsList.vue';
 import { sortAnswers } from '../sortAnswers';
 import { ScenarioStepAnswer } from '@/types/pb/Scenario';
-import { Item } from '@/types/pb/Item';
-import { decorate } from '@/components/question/PbQuestion.vue';
+import { decorate } from '@/services/decorate';
 
 const BACK_ICON =
   'https://storage.googleapis.com/project-booster-media/mozaic-icons/svg/Navigation_Arrow_Arrow--Left_16px.svg';

package/src/components/question/name-input/PbNameInput.vue

@@ -60,7 +60,7 @@ import MToggle from '../../mozaic/toggle/MToggle.vue';
 import DEFAULT_PAYLOAD from './default-payload.json';
 import { NameInputPayload } from '@/components/question/name-input/NameInput';
 import { ScenarioStepAnswer } from '@/types/pb/Scenario';
-import { decorate } from '@/components/question/PbQuestion.vue';
+import { decorate } from '@/services/decorate';
 
 const BACK_ICON =
   'https://storage.googleapis.com/project-booster-media/mozaic-icons/svg/Navigation_Arrow_Arrow--Left_16px.svg';

package/src/components/question/space-input/PbSpaceInput.vue

@@ -146,7 +146,7 @@ import MDialog from '../../mozaic/dialog/MDialog.vue';
 import DEFAULT_PAYLOAD from './default-payload.json';
 import { SpaceInputPayload } from '@/components/question/space-input/SpaceInput';
 import { ScenarioStepAnswer } from '@/types/pb/Scenario';
-import { decorate } from '@/components/question/PbQuestion.vue';
+import { decorate } from '@/services/decorate';
 
 const BACK_ICON =
   'https://storage.googleapis.com/project-booster-media/mozaic-icons/svg/Navigation_Arrow_Arrow--Left_16px.svg';

package/src/components/question/upload-document/PbUploadDocument.vue

@@ -139,7 +139,6 @@
 
 <script lang="ts">
 import { defineComponent, computed, onMounted, ref, PropType, Ref, ComponentCustomProperties } from 'vue';
-import objectPath from 'object-path';
 import MButton from '../../mozaic/buttons/MButton.vue';
 import MContainer from '../../mozaic/grid/MContainer.vue';
 import MFlex from '../../mozaic/flex/MFlex.vue';
@@ -156,7 +155,7 @@ import {
   UploadDocumentViewModel,
 } from '@/components/question/upload-document/UploadDocument';
 import { ScenarioStepAnswer } from '@/types/pb/Scenario';
-import { decorate, doEval } from '@/components/question/PbQuestion.vue';
+import { decorate, doEval } from '@/services/decorate';
 
 const BACK_ICON =
   'https://storage.googleapis.com/project-booster-media/mozaic-icons/svg/Navigation_Arrow_Arrow--Left_16px.svg';

package/src/services/decorate.ts

@@ -0,0 +1,65 @@
+import objectPath from 'object-path';
+
+import { ScenarioStepAnswer } from '@/types/pb/Scenario';
+
+/**
+ * This function will doEval and decorate dynamically variables from JSON templates.
+ *
+ * For instance:
+ * "${getAnswerValue('DEVELOPER', 'code') == 'YES' ? 'I'm developer' : 'I'm not developer'}".
+ *
+ * @param answers A map of string and an array of ScenarioStepAnswer.
+ * @param valueToDecorate Targeted value to decorate.
+ * @param defaultValue Empty string by default.
+ * @returns Decorated value.
+ */
+export function decorate(
+  answers: Map<string, ScenarioStepAnswer[]>,
+  runtimeOptions = {},
+  valueToDecorate: string,
+  defaultValue = '',
+): string {
+  let decoratedValue = valueToDecorate;
+  if (valueToDecorate) {
+    const stringToEval = `\`${valueToDecorate}\``;
+    try {
+      decoratedValue = doEval(answers, stringToEval, defaultValue, runtimeOptions);
+    } catch (error) {
+      decoratedValue = valueToDecorate || defaultValue;
+    }
+  }
+  return decoratedValue;
+}
+
+export function doEval(
+  this: any,
+  answers: Map<string, ScenarioStepAnswer[]>,
+  valueToEval: string,
+  defaultValue: string,
+  runtimeOptions: unknown,
+): any {
+  return new Function('getAnswerValue', 'answers', 'defaultValue', 'runtimeOptions', `return ${valueToEval}`).call(
+    this,
+    getAnswerValue(answers),
+    Object.fromEntries(answers),
+    defaultValue,
+    runtimeOptions,
+  );
+}
+
+/**
+ * Function used by the scenario conditions.
+ *
+ * @param answers A map of string and an array of ScenarioStepAnswer.
+ * @returns Answers values.
+ */
+function getAnswerValue(answers: Map<string, ScenarioStepAnswer[]>) {
+  return (answerCode: string, path: string) => {
+    let answerValue: ScenarioStepAnswer | undefined = undefined;
+    if (answers?.get(answerCode)) {
+      const answerValues = answers.get(answerCode) ?? [];
+      answerValue = objectPath.get(answerValues[0], path);
+    }
+    return answerValue;
+  };
+}