project-booster-vue 9.3.0 → 9.5.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "project-booster-vue",
-  "version": "9.3.0",
+  "version": "9.5.0",
   "private": false,
   "scripts": {
     "serve": "vue-cli-service serve",
@@ -81,21 +81,21 @@
     "@mswjs/interceptors": "0.12.7",
     "@semantic-release/changelog": "5.0.1",
     "@semantic-release/git": "9.0.0",
-    "@storybook/addon-a11y": "6.4.21",
-    "@storybook/addon-essentials": "6.4.21",
+    "@storybook/addon-a11y": "6.4.22",
+    "@storybook/addon-essentials": "6.4.22",
     "@storybook/addon-knobs": "6.3.1",
-    "@storybook/addon-links": "6.4.21",
+    "@storybook/addon-links": "6.4.22",
     "@storybook/addon-postcss": "2.0.0",
-    "@storybook/addon-storyshots": "6.4.21",
-    "@storybook/addon-storyshots-puppeteer": "6.4.21",
-    "@storybook/addon-storysource": "6.4.21",
-    "@storybook/addons": "6.4.21",
-    "@storybook/builder-webpack5": "6.4.21",
-    "@storybook/manager-webpack5": "6.4.21",
-    "@storybook/source-loader": "6.4.21",
+    "@storybook/addon-storyshots": "6.4.22",
+    "@storybook/addon-storyshots-puppeteer": "6.4.22",
+    "@storybook/addon-storysource": "6.4.22",
+    "@storybook/addons": "6.4.22",
+    "@storybook/builder-webpack5": "6.4.22",
+    "@storybook/manager-webpack5": "6.4.22",
+    "@storybook/source-loader": "6.4.22",
     "@storybook/storybook-deployer": "2.8.11",
-    "@storybook/theming": "6.4.21",
-    "@storybook/vue3": "6.4.21",
+    "@storybook/theming": "6.4.22",
+    "@storybook/vue3": "6.4.22",
     "@testing-library/jest-dom": "5.16.2",
     "@testing-library/vue": "6.5.1",
     "@types/axios": "0.14.0",
@@ -147,7 +147,7 @@
     "eslint-plugin-import": "2.25.4",
     "eslint-plugin-mdx": "1.16.0",
     "eslint-plugin-prettier": "4.0.0",
-    "eslint-plugin-storybook": "0.5.8",
+    "eslint-plugin-storybook": "0.5.10",
     "eslint-plugin-vue": "7.11.1",
     "fluent-json-schema": "3.0.1",
     "husky": "6.0.0",

package/src/components/media/upload/document-upload-payload.json

@@ -25,9 +25,14 @@
           "label": "Un plan d’architecte"
         },
         {
-          "type": "PLAN",
-          "subtype": "KITCHEN_DESIGNER_PLAN",
-          "label": "Un plan d’un autre cuisiniste"
+          "type": "PHOTO",
+          "subtype": "ANY",
+          "label": "Une photo"
+        },
+        {
+          "type": "OTHER",
+          "subtype": "ANY",
+          "label": "Autre"
         }
       ]
     }

package/src/components/projects/project-hub/PbProjectHub.vue

@@ -83,7 +83,17 @@
             </m-flex>
             <m-flex v-if="isDocumentsDisplayed" class="pb-project-hub__section" direction="column" full-width>
               <div class="pb-project-hub__section-header">
-                <div class="pb-project-hub__section-title">{{ titleDocument }}</div>
+                <div class="pb-project-hub__section-title-container">
+                  <div class="pb-project-hub__section-title">{{ titleDocument }}</div>
+                  <pb-media-upload
+                    v-if="displayedDocuments && displayedDocuments.length > 0"
+                    storeModuleName="documents"
+                    :payload="DOCUMENT_UPLOAD_PAYLOAD"
+                    acceptedFileTypes="image jpeg, image png, image heif, image heic, image/heif-sequence, image/heic-sequence, application
+                pdf"
+                    @media-uploaded="handleDocumentUploaded"
+                  />
+                </div>
               </div>
               <div class="pb-project-hub__section-content">
                 <m-flex
@@ -383,7 +393,15 @@
             </m-flex>
             <m-flex v-if="isMediaDisplayed" class="pb-project-hub__section" direction="column" full-width>
               <div class="pb-project-hub__section-header">
-                <div class="pb-project-hub__section-title">{{ titlePhotoInspiration }}</div>
+                <div class="pb-project-hub__section-title-container">
+                  <div class="pb-project-hub__section-title">{{ titlePhotoInspiration }}</div>
+                  <pb-media-upload
+                    v-if="displayedInspirations && displayedInspirations.length > 0"
+                    storeModuleName="documents"
+                    :payload="MEDIA_UPLOAD_PAYLOAD"
+                    @media-uploaded="handleMediaUploaded"
+                  />
+                </div>
               </div>
               <div class="pb-project-hub__section-content">
                 <m-flex
@@ -789,6 +807,9 @@ import { Tool } from '@/types/pb/Tool';
 import { Configuration } from '@/types/pb/Configuration';
 import { Estimate } from '@/types/pb/Estimate';
 import { Task } from '@/types/pb/Task';
+import PbMediaUpload from '@/components/media/upload/PbMediaUpload.vue';
+import DOCUMENT_UPLOAD_PAYLOAD from '@/components/media/upload/document-upload-payload.json';
+import MEDIA_UPLOAD_PAYLOAD from '@/components/media/upload/media-upload-payload.json';
 
 const BACK_ICON =
   'https://storage.googleapis.com/project-booster-media/mozaic-icons/svg/Navigation_Arrow_Arrow--Left_16px.svg';
@@ -830,6 +851,7 @@ export default defineComponent({
   name: 'PbProjectHub',
 
   components: {
+    PbMediaUpload,
     MAccordion,
     MButton,
     MContainer,
@@ -917,6 +939,8 @@ export default defineComponent({
     showMoreButtonAnimationDelay: 0,
     BACK_ICON,
     TASK_MODEL,
+    DOCUMENT_UPLOAD_PAYLOAD,
+    MEDIA_UPLOAD_PAYLOAD,
     displayCategoriesDialog: false,
   }),
 
@@ -1338,6 +1362,14 @@ export default defineComponent({
         behavior: 'smooth',
       });
     },
+
+    handleDocumentUploaded() {
+      this.$store.dispatch('documents/refreshMediaList');
+    },
+
+    handleMediaUploaded() {
+      this.$store.dispatch('media/refreshMediaList');
+    },
   },
 });
 </script>
@@ -1403,6 +1435,11 @@ $appear-duration: 100ms;
 
     &-header {
       padding-bottom: $mu150;
+      width: 100%;
+    }
+
+    &-title-container {
+      display: flex;
     }
 
     &-title {
@@ -1410,6 +1447,7 @@ $appear-duration: 100ms;
       @include set-font-scale('07', 'm');
 
       color: $color-grey-800;
+      flex-grow: 1;
     }
 
     &-subtitle {

package/src/components/question/PbQuestion.vue

@@ -427,19 +427,18 @@ export default defineComponent({
         this.pageSize = this.payload.viewModel.showMore.itemsPerPage;
       }
 
+      const answerValues = this.answers?.get(this.stepName ?? '') ?? [];
       for (const { code: answerCode } of Object.values(Object.fromEntries(this.questionPossibleAnswers))) {
-        const answerValues = this.answers?.get(this.stepName ?? '') ?? [];
         const questionPossibleAnswer = this.questionPossibleAnswers.get(answerCode);
         if (
           questionPossibleAnswer &&
-          (questionPossibleAnswer?.selected ||
-            answerValues.findIndex(
-              (answer: ScenarioStepAnswer | string) =>
-                (typeof answer === 'string' && answer === answerCode) ||
-                (typeof answer === 'object' &&
-                  (<ScenarioStepAnswer>answer)?.code === answerCode &&
-                  (<ScenarioStepAnswer>answer)?.selected),
-            ) >= 0) &&
+          answerValues.findIndex(
+            (answer: ScenarioStepAnswer | string) =>
+              (typeof answer === 'string' && answer === answerCode) ||
+              (typeof answer === 'object' &&
+                (<ScenarioStepAnswer>answer)?.code === answerCode &&
+                (<ScenarioStepAnswer>answer)?.selected),
+          ) >= 0 &&
           areConditionsValid(questionPossibleAnswer.conditions!, this.answers, this.runtimeOptions)
         ) {
           this.selectedAnswers.set(answerCode, true);
@@ -499,10 +498,9 @@ export default defineComponent({
       if (!this.payload.multiSelect) {
         this.initAnswersSelectedState(this.payload.answers);
       }
-      answer.selected = !answer.selected;
 
       if (this.payload.multiSelect) {
-        this.selectedAnswers.set(answer.code, answer.selected);
+        this.selectedAnswers.set(answer.code, !this.selectedAnswers.get(answer.code) ?? true);
 
         const selected = Object.fromEntries(Object.entries(this.selectedAnswers).filter(([, value]) => value === true));
         /**
@@ -514,7 +512,7 @@ export default defineComponent({
         Object.keys(Object.fromEntries(this.selectedAnswers)).forEach((answerCode) => {
           this.selectedAnswers.set(answerCode, false);
         });
-        this.selectedAnswers.set(answer.code, answer.selected);
+        this.selectedAnswers.set(answer.code, !this.selectedAnswers.get(answer.code) ?? true);
 
         /**
          * Emitted when step is completed

package/src/components/scenario/PbScenario.vue

@@ -195,6 +195,7 @@ export default defineComponent({
       remainingSteps: 0,
     });
     const reverseAnimation = ref(false);
+    const forceRefresh = ref(false);
     const noPointerEvents = ref(false);
     const stepAnimationTimeoutId = ref<ReturnType<typeof setTimeout>>();
     const progressUpdateTimeoutId = ref<ReturnType<typeof setTimeout>>();
@@ -288,7 +289,12 @@ export default defineComponent({
       let stepIndex = state.value.history.stepIndex - 1;
 
       const steps = state.value.history.steps ?? [];
-      while (stepIndex > 0 && steps[stepIndex - 1].step.type !== 'STEP') {
+      while (
+        stepIndex > 0 &&
+        steps[stepIndex - 1] &&
+        steps[stepIndex - 1].step &&
+        steps[stepIndex - 1].step.type !== 'STEP'
+      ) {
         stepIndex--;
       }
 
@@ -355,7 +361,13 @@ export default defineComponent({
       }
     };
     const goToStep = (stepIndex: number) => {
-      let requestedStep = state.value.history?.steps?.[stepIndex - 1];
+      let requestedStep = state.value.history?.steps ? state.value.history.steps[stepIndex - 1] : undefined;
+
+      if (!requestedStep) {
+        requestedStep = state.value.history?.steps
+          ? state.value.history.steps[state.value.history.stepIndex - 1]
+          : undefined;
+      }
 
       if (requestedStep) {
         if (requestedStep.step.resetAnswersOnBack) {
@@ -593,7 +605,8 @@ export default defineComponent({
     watch(route, () => {
       const requestedStepIndex = route.params?.stepCode as string;
 
-      if (requestedStepIndex && requestedStepIndex !== `${state.value.history.stepIndex}`) {
+      if ((requestedStepIndex && requestedStepIndex !== `${state.value.history.stepIndex}`) || forceRefresh.value) {
+        forceRefresh.value = false;
         goToStep(parseInt(requestedStepIndex));
       }
     });
@@ -623,6 +636,7 @@ export default defineComponent({
             state.value.answers = new Map<string, ScenarioStepAnswer[]>(Object.entries(state.value.answers));
           }
           const newRoute = `/steps/${state.value.history.stepIndex}/previous/${uuidv4()}`;
+          forceRefresh.value = true;
           router.replace(newRoute);
         }
       },