project-booster-vue 10.7.12 → 10.8.0

package/package.json

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

package/src/components/configurations/list/PbConfigurationsList.vue

@@ -31,7 +31,7 @@
             />
             <pb-card
               v-else
-              class="pb-configurations-list__card"
+              class="pb-configurations-list__card js-cdl"
               :flag-label="configuration.type"
               :hero="configuration.label"
               :flattened="readOnly"
@@ -43,6 +43,10 @@
               :text="`Réalisée le ${formatDate(configuration.creationDate)}`"
               :selected="configuration.selected"
               @click="emitConfigurationClickEvent(configuration)"
+              data-cdl-click-type="cdl_event"
+              :data-cdl-click-data="
+                formatEvent({ button_name: configuration.label, button_location: stepLocation }, EventTypeEnum.BUTTON)
+              "
             />
           </div>
         </m-flexy-col>
@@ -81,6 +85,7 @@ import PbAnimableLoader from '../../loader/PbAnimableLoader.vue';
 import PbCard from '../../cards/PbCard.vue';
 import { format } from 'date-fns';
 import Velocity from 'velocity-animate';
+import { EventTypeEnum, formatEvent } from '../../rework/services/event';
 
 export const CONFIGURATION_ANIMATION_DURATION = 50;
 
@@ -134,10 +139,18 @@ export default defineComponent({
       type: Boolean,
       default: false,
     },
+    /**
+     * Step location
+     */
+    stepLocation: {
+      type: String,
+      default: '',
+    },
   },
 
   data: () => ({
     showMoreButtonAnimationDelay: 0,
+    EventTypeEnum,
   }),
 
   methods: {
@@ -196,6 +209,7 @@ export default defineComponent({
        */
       this.$emit('refresh-configuration', configuration);
     },
+    formatEvent,
   },
 });
 </script>

package/src/components/rework/question/MPbQuestion.vue

@@ -216,13 +216,20 @@
             <m-button
               label="Précédent"
               theme="bordered-neutral"
-              class="pb-question__actions-buttons-button"
+              class="pb-question__actions-buttons-button js-cdl"
               size="m"
               size-from-l="l"
               @click="$emit('go-back')"
               v-if="!payload.viewModel.hideBackButton"
               icon="ArrowBack48"
               :data-cerberus="sanitizeCerberusAttribut('MPB-QUESTION', 'Etape precedente')"
+              data-cdl-click-type="cdl_event"
+              :data-cdl-click-data="
+                formatEvent(
+                  { button_name: 'Etape precedente', button_location: payload.viewModel.analytics.funnel_name },
+                  EventTypeEnum.BUTTON,
+                )
+              "
             >
             </m-button>
           </div>
@@ -769,17 +776,21 @@ const nextStepHandler = () => {
 };
 
 const updateCdlValues = () => {
-  const answers: any = [];
+  let answers: any = [];
 
   for (const answerCode in Object.fromEntries(selectedAnswers.value)) {
-    answers.push(answerCode);
+    if (!answers.includes(answerCode)) {
+      answers.push(answerCode);
+    } else {
+      answers = answers.filter((item: any) => item !== answerCode);
+    }
   }
 
   eventData.value = formatEvent(
     {
-      field_name: props.payload.viewModel.label,
-      funnel_name: props.payload.viewModel.analytics.funnel_name,
-      field_value: answers,
+      field_name: props.payload.viewModel.label || '',
+      funnel_name: props.payload.viewModel.analytics.funnel_name || '',
+      field_value: answers || '',
     },
     EventTypeEnum.FIELD,
   );

package/src/components/rework/question/configurations-import/MPbConfigurationsImport.vue

@@ -61,15 +61,32 @@
 
         <div class="pb-configurations-import__redirect-link" v-if="payload.viewModel.redirectLink">
           <m-link
+            class="js-cdl"
             :label="payload.viewModel.redirectLink.label"
             @click="callAction(payload.viewModel.redirectLink.nextStep)"
             theme="primary"
+            data-cdl-click-type="cdl_event"
+            :data-cdl-click-data="
+              formatEvent(
+                { button_name: payload.viewModel.redirectLink.label, button_location: stepLocation },
+                EventTypeEnum.BUTTON,
+              )
+            "
           ></m-link>
         </div>
 
         <div class="pb-configurations-import__buttons row-flex" v-if="payload.callToActions">
           <div class="pb-configurations-import__buttons__button" v-for="button in payload.callToActions">
-            <m-button :label="button.label" @click="callAction(button.nextStep)" :theme="button.theme" />
+            <m-button
+              class="js-cdl"
+              :label="button.label"
+              @click="callAction(button.nextStep)"
+              :theme="button.theme"
+              data-cdl-click-type="cdl_event"
+              :data-cdl-click-data="
+                formatEvent({ button_name: button.label, button_location: stepLocation }, EventTypeEnum.BUTTON)
+              "
+            />
           </div>
         </div>
       </m-container>
@@ -123,6 +140,7 @@ import { ScenarioStepAnswer } from '@/types/pb/Scenario';
 import { Configuration } from '@/types/pb/Configuration';
 import { decorate } from '@/services/decorate';
 import { PayloadAction } from '../../types/genericPayload';
+import { EventTypeEnum, formatEvent } from '../../services/event';
 
 const BACK_ICON =
   'https://storage.googleapis.com/project-booster-media/mozaic-icons/svg/Navigation_Arrow_Arrow--Left_16px.svg';
@@ -192,6 +210,13 @@ export default defineComponent({
       type: String,
       default: '0px',
     },
+    /**
+     * Step location
+     */
+    stepLocation: {
+      type: String,
+      default: '',
+    },
   },
 
   setup(props, { emit }) {
@@ -280,6 +305,8 @@ export default defineComponent({
       configurationImportSuccess,
       configurationImportError,
       callAction,
+      EventTypeEnum,
+      formatEvent,
     };
   },
 });

package/src/components/rework/services/event.ts

@@ -33,7 +33,7 @@ export interface FormatEventInterface {
 export const formatEvent = (
   { button_name, button_location, funnel_name, field_name, field_value }: FormatEventInterface,
   type: EventTypeEnum,
-) => {
+): string => {
   let event_data = {};
 
   switch (type) {

package/src/components/scenario/PbScenario.vue

@@ -64,7 +64,7 @@
             :sticky-bottom-offset="stickyBottomOffset()"
             :min-height="minHeight"
             :is-collaborator="isCollaborator"
-            :step-location="state.currentStep?.slots?.beforeContent.label"
+            :step-location="state.currentStep?.slots?.beforeContent?.label || ''"
             @step-completed="handleStepCompleted"
             @update-selected="handleSemiUpdateSelected"
             @redirection="handleRedirection"

package/src/types/pb/Scenario.ts

@@ -190,7 +190,7 @@ export interface ScenarioStep {
   payload?: ScenarioStepPayload;
   stepCode?: ScenarioStepNextStep;
   meta?: any;
-  slots?: ScenarioNestedScenarioSlot[];
+  slots?: ScenarioNestedScenarioSlot;
   trackProgress?: boolean;
   // Step
   resetAnswersOnBack?: boolean;
@@ -204,6 +204,16 @@ export interface ScenarioNestedScenarioSlotPayload {
 export interface ScenarioNestedScenarioSlot {
   component?: string;
   payload?: ScenarioNestedScenarioSlotPayload;
+  beforeContent?: ScenarioNestedScenarioSlotBeforeContent;
+}
+
+export interface ScenarioNestedScenarioSlotBeforeContent {
+  label?: string;
+  display?: boolean;
+  sizeXlWidth?: boolean;
+  component?: string;
+  totalStep?: number;
+  currentStep?: number;
 }
 
 export interface ScenarioStepNextStep {