project-booster-vue 8.119.0 → 8.119.4

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "project-booster-vue",
-  "version": "8.119.0",
+  "version": "8.119.4",
   "private": false,
   "scripts": {
     "test:unit": "vue-cli-service test:unit --forceExit --detectOpenHandles",
@@ -24,6 +24,7 @@
     "dist/*",
     "src/*",
     "public/*",
+    "scenario-validator/*",
     "*.json"
   ],
   "dependencies": {
@@ -36,7 +37,7 @@
     "@vue/babel-preset-app": "4.5.13",
     "@vue/compat": "3.2.6",
     "ajv": "8.6.0",
-    "axios": "0.21.1",
+    "axios": "0.25.0",
     "contentful": "8.4.2",
     "core-js": "3.19.1",
     "date-fns": "2.22.1",
@@ -54,7 +55,6 @@
     "object-path": "0.11.5",
     "ramda": "0.26.1",
     "request": "2.88.0",
-    "superagent": "6.1.0",
     "svg-injector": "1.1.3",
     "uuid": "8.3.2",
     "vee-validate": "4.4.5",
@@ -117,7 +117,7 @@
     "eslint-plugin-prettier": "4.0.0",
     "eslint-plugin-storybook": "0.5.6",
     "eslint-plugin-vue": "7.11.1",
-    "fluent-schema": "1.1.0",
+    "fluent-json-schema": "3.0.1",
     "husky": "6.0.0",
     "msw": "0.35.0",
     "msw-storybook-addon": "1.6.0",

package/scenario-validator/index.js

@@ -0,0 +1,115 @@
+const R = require('ramda');
+const request = require('request');
+const axios = require('axios');
+const Ajv = require('ajv');
+const {
+  getAllStepName,
+  hasTemplates,
+  hasNoTemplates,
+  createDirectGraphForJson,
+  getAllConfigurationForTemplateLiteral,
+  getPictures,
+  getStepComponent,
+} = require('./jsonExplorer');
+
+const getUrlStatusCode = (url) => {
+  return new Promise((resolve, reject) => {
+    const r = request(url);
+    r.on('response', (response) => {
+      r.abort();
+      resolve(response.statusCode);
+    });
+    r.on('error', function (err) {
+      reject(err);
+    });
+  });
+};
+
+const isOffline = process.env.OFFLINE;
+
+const itOnline = isOffline ? it.skip : it;
+
+const testImage = (url) => {
+  describe(url, () => {
+    itOnline('should exist', async () => {
+      const status = await getUrlStatusCode(url);
+      expect(status).toBe(200);
+    });
+    it('should not be on a subproject bucket', () => {
+      const bucketRegex = /^https:\/\/storage.googleapis.com\/budget-estimate-[^\/]+subproject-forms\/.*/;
+      expect(bucketRegex.test(url)).toBeFalsy();
+    });
+  });
+};
+
+const validateSchema = (rawJson) => {
+  itOnline('should be valid according to json schema', async () => {
+    const jsonSchema = (await axios.get('https://adeo.github.io/project-booster-vue/jsonSchema/scenario.json')).data;
+    const ajv = new Ajv({ allErrors: true });
+    const validate = ajv.compile(jsonSchema);
+    const valid = validate(rawJson);
+    if (!valid) {
+      console.error(validate.errors);
+    }
+    expect(valid).toBeTruthy();
+  });
+};
+const sharedScenarioTests = (json) => {
+  validateSchema(json);
+  it('should have a __START__ step', () => {
+    expect(json['__START__']).toBeDefined();
+  });
+  it('should have keys same as code', () => {
+    R.toPairs(json).forEach(([key, { code }]) => {
+      expect(key).toEqual(code);
+    });
+  });
+  describe('images', () => {
+    describe('static images', () => {
+      const images = getPictures(json).filter(hasNoTemplates);
+      for (let url of images) {
+        testImage(url);
+      }
+    });
+    describe('dynamic images', () => {
+      const images = getPictures(json)
+        .filter(hasTemplates)
+        .filter((v, i, a) => a.indexOf(v) === i);
+      for (let template of images) {
+        describe(template, () => {
+          for (let url of getAllConfigurationForTemplateLiteral(json, template)) {
+            testImage(url);
+          }
+        });
+      }
+    });
+  });
+  describe('steps', () => {
+    const graph = createDirectGraphForJson(json);
+    const allSteps = getAllStepName(json);
+    Object.entries(graph).map(([key, val]) => {
+      describe(key, () => {
+        it('should have valid destination', () => {
+          val.forEach((destination) => {
+            expect(allSteps.indexOf(destination)).toBeGreaterThanOrEqual(0);
+          });
+        });
+
+        const stepComponentName = getStepComponent(json[key]);
+
+        if (stepComponentName === 'PbSpaceInput' || stepComponentName === 'PbAmountInput') {
+          it('should have a value for going back for a numeric input', () => {
+            expect(json[key].payload.value).toBeDefined();
+            expect(typeof json[key].payload.value).toBe('object');
+          });
+        }
+      });
+    });
+  });
+};
+
+module.exports.sharedScenarioTests = sharedScenarioTests;
+module.exports.validateSchema = validateSchema;
+module.exports.testImage = testImage;
+module.exports.getUrlStatusCode = getUrlStatusCode;
+module.exports.getPictures = getPictures;

package/scenario-validator/jsonExplorer.js

@@ -0,0 +1,165 @@
+const R = require('ramda');
+
+const getStepComponent = (step) => (step && step.component) || undefined;
+
+const getTemplates = R.match(/(\${.*?})/g);
+
+const hasTemplates = (string) => getTemplates(string).length > 0;
+const hasNoTemplates = (string) => getTemplates(string).length === 0;
+
+const getPictures = (json) => {
+  const polishArray = R.pipe(R.reject(R.isNil), R.flatten, R.reject(R.isNil), R.filter(R.reject(R.isNil)), R.uniq);
+  const getAnswersImages = R.pipe(
+    R.map(R.pipe(R.path(['payload', 'answers']), R.values, R.map(R.path(['viewModel', 'image'])))),
+    R.values,
+  );
+  const getStrips = R.pipe(R.values, R.map(R.path(['payload', 'viewModel', 'decoratorStripe'])));
+  const images = [...getStrips(json), ...getAnswersImages(json)];
+  return images.length > 0 ? polishArray(images) : images;
+};
+
+const getAllConfigurationForTemplateLiteral = (json, string) => {
+  const stepForString = R.pipe(
+    R.values,
+    R.filter(
+      R.compose(
+        R.includes(string),
+        R.pipe(R.path(['payload', 'answers']), R.values, R.map(R.path(['viewModel', 'image']))),
+      ),
+    ),
+  )(json)[0];
+
+  const defaultValuesData = R.path(['payload', 'defaultDecoratorValue'], stepForString);
+
+  const defaultValues = R.pipe(
+    R.match(/defaultValue\..+?[ }]/g),
+    R.map(
+      R.pipe(
+        R.split('.'),
+        R.nth(1),
+        (str) => str.substring(0, str.length - 1),
+        (val) => R.path([val], defaultValuesData),
+      ),
+    ),
+  );
+
+  const answersValues = R.pipe(
+    R.match(/(.+?)\[0]\.value/g),
+    R.map(
+      R.pipe(
+        R.split('.'),
+        R.nth(1),
+        R.split('['),
+        R.nth(0),
+        (val) => json[val],
+        R.path(['payload', 'answers']),
+        R.values,
+        R.map(R.path(['value'])),
+        R.flatten,
+      ),
+    ),
+    R.flatten,
+  );
+
+  const combinator = R.pipe(
+    getTemplates,
+    R.map((val) => R.concat(defaultValues(val), answersValues(val))),
+  );
+
+  let combined = combinator(string);
+
+  if (combined.length > 1) {
+    combined = R.reduce(R.xprod, [], combined);
+  } else {
+    combined = R.splitEvery(1, combined[0]);
+  }
+
+  const urls = R.map((pair) => {
+    const templates = getTemplates(string);
+    let newString = string;
+    pair.forEach((value, i) => {
+      newString = R.replace(templates[i], value, newString);
+    });
+    return newString;
+  }, combined);
+
+  return R.uniq(urls);
+};
+
+const isTypeScenario = R.propEq('type', 'SCENARIO');
+
+const getDestinationFromScenario = (step) => {
+  const direction = R.prop('stepCode');
+
+  return R.filter(R.is(String))([direction(step)]);
+};
+
+const getDestinationFromStep = (step) => {
+  const forPayload = R.pipe(
+    R.path(['payload', 'multiSelect', 'actions', 'VALIDATE', 'nextStep', 'code']),
+    R.ifElse(
+      R.is(String),
+      (val) => [val],
+      () => [],
+    ),
+  );
+
+  const baseForStep = R.ifElse(
+    R.has('nextStep'),
+    R.pipe(
+      R.prop('nextStep'),
+      R.ifElse(
+        R.has('code'),
+        R.pipe(R.prop('code'), (val) => [val]),
+        R.ifElse(
+          R.has('conditionals'),
+          R.pipe(R.prop('conditionals'), R.map(R.path(['nextStep', 'code']))),
+          R.pipe(() => []),
+        ),
+      ),
+      (val) => val || [],
+    ),
+    () => [],
+  );
+
+  const stepsInside = R.pipe(
+    R.ifElse(
+      R.propEq('component', 'PbQuestion'),
+      R.pipe(R.path(['payload', 'answers']), R.values, R.map(R.path(['nextStep', 'code']))),
+      R.ifElse(
+        R.propEq('component', 'PbRestitution'),
+        R.pipe(
+          R.path(['payload', 'callToActions']),
+          R.values,
+          R.map(R.prop('action')),
+          R.filter(R.is(Object)),
+          R.map(R.prop('code')),
+        ),
+        () => R.init([]),
+      ),
+    ),
+    (val) => val || [],
+  );
+
+  const ret = R.filter(R.is(String))(R.concat(stepsInside(step), R.concat(baseForStep(step), forPayload(step))));
+
+  return ret || [];
+};
+
+const getAllStepName = R.keys;
+
+const createDirectGraphForJson = (json) => {
+  const directGraph = R.pipe(
+    R.map(R.pipe(R.ifElse(isTypeScenario, getDestinationFromScenario, getDestinationFromStep), R.uniq())),
+  )(json);
+
+  return R.map(R.filter((val) => val !== 'null'))(directGraph);
+};
+
+module.exports.getPictures = getPictures;
+module.exports.getAllStepName = getAllStepName;
+module.exports.getStepComponent = getStepComponent;
+module.exports.createDirectGraphForJson = createDirectGraphForJson;
+module.exports.hasTemplates = hasTemplates;
+module.exports.hasNoTemplates = hasNoTemplates;
+module.exports.getAllConfigurationForTemplateLiteral = getAllConfigurationForTemplateLiteral;

package/src/components/projects/project-item-save/PbProjectItemSave.stories.mdx

@@ -33,6 +33,107 @@ The `PbProjectItemSave` component to save project item in existing project or ne
       components: { PbProjectItemSave },
       created() {
         this.$store.dispatch('projects/loadProjects');
+        this.$store.dispatch('estimates/setSummary', {
+          subprojectId: 'ae62d167-e02e-4744-81b1-102cc5816be2',
+          subprojectTemplateId: '22248ac3-9391-47f4-8a54-6fe280c2fa5b',
+          businessUnit: 'LMFR',
+          summaryDate: '2020-05-13T09:49:45.886602047Z',
+          cost: {
+            min: 691526.2,
+            max: 1443197.48,
+            currency: 'EURO',
+          },
+          components: [
+            {
+              componentId: 'LAND',
+              title: 'Terrain en lotissement',
+              cost: {
+                min: 20664,
+                max: 38523.6,
+                currency: 'EURO',
+              },
+              lines: [
+                {
+                  text: '- Terrain seul',
+                  details: 'Terrain constructible, délimité et viabilisé. La nature du sous-sol est garantie.',
+                  cost: {
+                    min: 19680,
+                    max: 35670,
+                    currency: 'EURO',
+                  },
+                },
+                {
+                  text: '- Frais de notaire',
+                  cost: {
+                    min: 984,
+                    max: 2853.6,
+                    currency: 'EURO',
+                  },
+                },
+              ],
+            },
+            {
+              componentId: 'HOUSE',
+              title: 'Maison contemporaine livrée prête à finir',
+              cost: {
+                min: 664562.5,
+                max: 1381050,
+                currency: 'EURO',
+              },
+              lines: [
+                {
+                  text: '- Budget construction maison',
+                  details:
+                    "Ce budget n'inclut pas : le terrain, la viabilisation, l'aménagement extérieur et la taxe d'aménagement.",
+                  cost: {
+                    min: 651000,
+                    max: 1255500,
+                    currency: 'EURO',
+                  },
+                },
+              ],
+            },
+            {
+              componentId: 'TAXES',
+              title: "Taxe d'aménagement",
+              details:
+                "Taxe qui s'applique pour les projets de construction, de reconstruction et d'agrandissement qui nécessitent des autorisations de travaux. Un abattement de 50% est prévu sur les 100 premiers m².",
+              cost: {
+                min: 6299.7,
+                max: 23623.88,
+                currency: 'EURO',
+              },
+            },
+          ],
+          subprojectAttributes: {
+            finish: 'PARTIALLY_BY_MYSELF',
+            houseType: 'CONTEMPORARY',
+            inseeCode: '59350',
+            land: 'NOT_YET',
+            landSurfaceInSquareMeters: 123,
+            landType: 'IN_A_LOT',
+            livingAreaInSquareMeters: 465,
+          },
+          suggestedTypologies: [
+            {
+              domesticSpaceLabel: 'Cuisine',
+              domesticSpaceHref: '/domestic-spaces/59405',
+              projectKindHref: '/project-kinds/34048',
+              projectTypeHref: '/project-types/29239',
+            },
+            {
+              domesticSpaceLabel: 'Tout le logement',
+              domesticSpaceHref: '/domestic-spaces/59461',
+              projectKindHref: '/project-kinds/34048',
+              projectTypeHref: '/project-types/61855',
+            },
+          ],
+          legalMentions: [
+            "Les prix ci-dessus ne sont proposés qu'à titre indicatif et sont basés sur les prix du marché.",
+            "L'outil d'estimation ne vaut pas offre de vente.",
+            "La disponibilité des produits au moment de l'achat n'est pas garantie.",
+          ],
+        });
         this.$store.dispatch('projects/loadTypologies');
       },
       template: `  <div style="flex-direction: column;display: flex;place-content: flex-start;align-items: stretch;min-height: 100vh;">

package/src/components/restitution/PbRestitutionBlock.vue

@@ -2,23 +2,16 @@
   <div :class="`pb-restitution-block`">
     <m-accordion :label="accordionLabel">
       <template #content>
-        <m-flex
+        <div
           direction="column"
           justify-content="space-between"
           align-items="baseline"
           class="pb-restitution-block__head"
-          full-width
         >
-          <m-flex
-            v-if="component.details"
-            class="pb-restitution-block__details"
-            direction="row"
-            align-items="stretch"
-            full-width
-          >
-            <m-flex class="pb-restitution-block__details-label" align-items="center">{{ component.details }}</m-flex>
-          </m-flex>
-        </m-flex>
+          <div v-if="component.details" class="pb-restitution-block__details">
+            {{ component.details }}
+          </div>
+        </div>
         <pb-restitution-line
           v-for="(line, index) in component.lines"
           :key="`${index}-${line.text}`"
@@ -31,7 +24,6 @@
 </template>
 
 <script>
-import MFlex from '../mozaic/flex/MFlex';
 import MAccordion from '../mozaic/accordions/MAccordion';
 import PbRestitutionLine from './PbRestitutionLine';
 
@@ -39,7 +31,6 @@ export default {
   name: 'PbRestitutionBlock',
 
   components: {
-    MFlex,
     MAccordion,
     PbRestitutionLine,
   },
@@ -75,15 +66,12 @@ export default {
 $responsive-breakpoint: 'm';
 
 .pb-restitution-block {
-  margin-bottom: $mu150;
   width: 100%;
 
   &__head {
     @include set-font-face('semi-bold');
     @include set-font-scale('06', 'm');
 
-    padding-bottom: $mu050;
-
     @include set-from-screen($responsive-breakpoint) {
       @include set-font-scale('07', 'm');
     }
@@ -94,26 +82,35 @@ $responsive-breakpoint: 'm';
     @include set-border-radius('m');
     @include set-font-scale('04', 'm');
 
+    background-color: $color-primary-01-100;
     box-sizing: border-box;
+    color: $color-font-dark;
     color: $color-font-darker;
-    margin-bottom: $mu050;
     padding: $mu100;
+    position: relative;
+    width: 100%;
 
-    @include set-from-screen($responsive-breakpoint) {
-      @include set-font-scale('05', 'l');
+    .a11y-high-contrast & {
+      background-color: $color-primary-01-300;
     }
 
-    &-label {
-      flex-grow: 1;
+    &::before {
+      border-bottom: $mu050 solid $color-primary-01-100;
+      border-left: $mu050 solid transparent;
+      border-right: $mu050 solid transparent;
+      content: '';
+      height: 0;
+      position: absolute;
+      top: -$mu050;
+      width: 0;
     }
-  }
 
-  &__details {
-    background-color: $color-primary-01-100;
-    color: $color-font-dark;
+    .a11y-high-contrast &::before {
+      border-bottom: $mu050 solid $color-primary-01-200;
+    }
 
-    .a11y-high-contrast & {
-      background-color: $color-primary-01-300;
+    @include set-from-screen($responsive-breakpoint) {
+      @include set-font-scale('05', 'l');
     }
   }
 }

package/src/components/restitution/PbRestitutionLine.vue

@@ -1,12 +1,7 @@
 <template>
   <m-flex :class="`pb-restitution-line`" direction="column">
     <m-flex full-width>
-      <m-flex class="pb-restitution-line__label">
-        <div>{{ line.text }}</div>
-        <div v-if="line.details" @click="displayDetails = !displayDetails" class="pb-restitution-line__label-icon">
-          <m-icon :icon="INFO_ICON" size="s" color="primary-01-600" />
-        </div>
-      </m-flex>
+      <div class="pb-restitution-line__label">{{ line.text }}</div>
       <m-flex class="pb-restitution-line__price" v-if="line.cost" justify-content="flex-end" wrap>
         <div v-if="line.cost.min !== line.cost.max" class="pb-restitution-line__price-min">
           {{ formatPriceRange(line.cost.min, line.cost.max).min }}&nbsp;-&nbsp;
@@ -16,12 +11,7 @@
         </div>
       </m-flex>
     </m-flex>
-    <m-flex v-if="displayDetails" class="pb-restitution-line__details" direction="row" align-items="stretch" full-width>
-      <m-flex class="pb-restitution-line__details-label" align-items="center">{{ line.details }}</m-flex>
-      <m-flex class="pb-restitution-line__details-cross" @click="displayDetails = false" justify-content="flex-start">
-        <m-icon :icon="CROSS_ICON" size="s" color="grey-600" />
-      </m-flex>
-    </m-flex>
+    <div v-if="line.details" class="pb-restitution-line__details">{{ line.details }}</div>
   </m-flex>
 </template>
 
@@ -39,7 +29,6 @@ export default {
 
   components: {
     MFlex,
-    MIcon,
   },
 
   props: {
@@ -54,7 +43,6 @@ export default {
   },
 
   data: () => ({
-    displayDetails: false,
     CROSS_ICON,
     INFO_ICON,
   }),
@@ -114,33 +102,35 @@ $responsive-breakpoint: 'm';
     @include set-border-radius('m');
     @include set-font-scale('04', 'm');
 
-    margin-bottom: $mu050;
+    background-color: $color-primary-01-100;
+    box-sizing: border-box;
+    color: $color-font-dark;
+    margin-top: $mu050;
     padding: $mu100;
+    position: relative;
+    width: 100%;
 
-    @include set-from-screen($responsive-breakpoint) {
-      @include set-font-scale('05', 'l');
+    .a11y-high-contrast & {
+      background-color: $color-primary-01-200;
     }
 
-    &-label {
-      flex-grow: 1;
+    &::before {
+      border-bottom: $mu050 solid $color-primary-01-100;
+      border-left: $mu050 solid transparent;
+      border-right: $mu050 solid transparent;
+      content: '';
+      height: 0;
+      position: absolute;
+      top: -$mu050;
+      width: 0;
     }
 
-    &-cross {
-      height: 100%;
-      padding-left: $mu150;
-
-      &:hover {
-        cursor: pointer;
-      }
+    .a11y-high-contrast &::before {
+      border-bottom: $mu050 solid $color-primary-01-200;
     }
-  }
-
-  &__details {
-    background-color: $color-primary-01-100;
-    color: $color-font-dark;
 
-    .a11y-high-contrast & {
-      background-color: $color-primary-01-200;
+    @include set-from-screen($responsive-breakpoint) {
+      @include set-font-scale('05', 'l');
     }
   }
 }

package/src/services/api/appointmentQualificationsApi.js

@@ -1,34 +1,35 @@
-import request from 'superagent';
+import axios from 'axios';
 import he from 'he';
 
 const getAppointmentQualification = async (start, end, inhabitantProjectId, groupId, appointmentId) => {
   var url = inhabitantProjectId
     ? `/api/appointment-qualifications?range=${start}-${end}&inhabitantProjectId=${inhabitantProjectId}`
     : `/api/appointment-qualifications?range=${start}-${end}&groupId=${groupId}&appointmentId=${appointmentId}`;
-  const response = await request.get(url);
+  const response = await axios.get(url);
 
   return JSON.parse(
-    JSON.stringify(response.body).replace(/:"([^"]+)"/g, (match, $1) => {
+    JSON.stringify(response.data).replace(/:"([^"]+)"/g, (match, $1) => {
       return `: "${he.escape($1)}"`;
     }),
   );
 };
 
 const saveAnswersByAppointmentQualificationId = async (appointmentQualificationId, data) => {
-  const response = await request
-    .put(`/api/appointment-qualifications/${appointmentQualificationId}/answers`)
-    .set('Content-Type', 'application/json')
-    .send(data);
+  const response = await axios.put(`/api/appointment-qualifications/${appointmentQualificationId}/answers`, data, {
+    headers: { 'Content-Type': 'application/json' },
+  });
 
   return JSON.parse(
-    JSON.stringify(response.body).replace(/:"([^"]+)"/g, (match, $1) => {
+    JSON.stringify(response.data).replace(/:"([^"]+)"/g, (match, $1) => {
       return `: "${he.escape($1)}"`;
     }),
   );
 };
 
 const declarationsWithAppointment = async (data) => {
-  return await request.post('/api/declarations-with-appointment').set('Content-Type', 'application/json').send(data);
+  return await axios.post('/api/declarations-with-appointment', data, {
+    headers: { 'Content-Type': 'application/json' },
+  });
 };
 
 export { declarationsWithAppointment, saveAnswersByAppointmentQualificationId, getAppointmentQualification };

package/src/services/api/configApi.js

@@ -1,11 +1,11 @@
-import request from 'superagent';
+import axios from 'axios';
 import he from 'he';
 
 const getConfiguration = async () => {
-  const response = await request.get('/configuration');
+  const response = await axios.get('/configuration');
 
   return JSON.parse(
-    JSON.stringify(response.body).replace(/:"([^"]+)"/g, (match, $1) => {
+    JSON.stringify(response.data).replace(/:"([^"]+)"/g, (match, $1) => {
       return `: "${he.escape($1)}"`;
     }),
   );

package/src/services/api/configurationsApi.js

@@ -1,16 +1,18 @@
-import request from 'superagent';
+import axios from 'axios';
 import he from 'he';
 
 const getProjectConfigurationsForProjectType = async (inhabitantProjectId, all) => {
   let response;
   if (all) {
-    response = await request.get('/api/simulations').query({ inhabitantProjectId }).query({ all });
+    response = await axios.get('/api/simulations', { params: { inhabitantProjectId, all } });
   } else {
-    response = await request.get('/api/simulations').query({ inhabitantProjectId });
+    response = await axios.get('/api/simulations', { params: { inhabitantProjectId } });
   }
 
+  console.log(response);
+
   return JSON.parse(
-    JSON.stringify(response.body).replace(/:"([^"]+)"/g, (match, $1) => {
+    JSON.stringify(response.data).replace(/:"([^"]+)"/g, (match, $1) => {
       return `: "${he.escape($1)}"`;
     }),
   );
@@ -19,25 +21,25 @@ const getProjectConfigurationsForProjectType = async (inhabitantProjectId, all)
 const getAllProjectConfigurations = async (inhabitantProjectId, forceNoPriceUpdate) => {
   let response;
   if (forceNoPriceUpdate) {
-    response = await request
-      .get(`/api/inhabitant-projects/${inhabitantProjectId}/simulations`)
-      .query({ forceNoPriceUpdate });
+    response = await axios.get(`/api/inhabitant-projects/${inhabitantProjectId}/simulations`, {
+      params: { forceNoPriceUpdate },
+    });
   } else {
-    response = await request.get(`/api/inhabitant-projects/${inhabitantProjectId}/simulations`);
+    response = await axios.get(`/api/inhabitant-projects/${inhabitantProjectId}/simulations`);
   }
 
   return JSON.parse(
-    JSON.stringify(response.body).replace(/:"([^"]+)"/g, (match, $1) => {
+    JSON.stringify(response.data).replace(/:"([^"]+)"/g, (match, $1) => {
       return `: "${he.escape($1)}"`;
     }),
   );
 };
 
 const linkConfiguration = async (id, inhabitantProjectId) => {
-  const response = await request.post(`/api/inhabitant-projects/${inhabitantProjectId}/simulations/${id}`);
+  const response = await axios.post(`/api/inhabitant-projects/${inhabitantProjectId}/simulations/${id}`);
 
   return JSON.parse(
-    JSON.stringify(response.body).replace(/:"([^"]+)"/g, (match, $1) => {
+    JSON.stringify(response.data).replace(/:"([^"]+)"/g, (match, $1) => {
       return `: "${he.escape($1)}"`;
     }),
   );

package/src/services/api/documentsApi.js

@@ -1,47 +1,48 @@
-import request from 'superagent';
+import axios from 'axios';
 import he from 'he';
 
 const uploadDocument = async (formData, inhabitantProjectId, correlationId, subType, trackProgress, fileName) => {
   const [name, file] = formData.entries().next().value;
-  return await request
-    .post(`/api/inhabitant-projects/${inhabitantProjectId}/documents`)
-    .attach('document', file)
-    .field('metadata', JSON.stringify({ type: 'PLAN', correlationId, subType, title: fileName }, null, '\t'))
-    .on('progress', trackProgress);
+  const data = new FormData();
+  data.append('document', file);
+  data.append('metadata', JSON.stringify({ type: 'PLAN', correlationId, subType, title: fileName }, null, '\t'));
+  return await axios.post(`/api/inhabitant-projects/${inhabitantProjectId}/documents`, data, {
+    onUploadProgress: trackProgress,
+  });
 };
 
 const getDocumentsByInhabitantProjectId = async (start, end, inhabitantProjectId) => {
-  const response = await request.get(`/api/inhabitant-projects/${inhabitantProjectId}/documents?range=${start}-${end}`);
+  const response = await axios.get(`/api/inhabitant-projects/${inhabitantProjectId}/documents?range=${start}-${end}`);
 
   return JSON.parse(
-    JSON.stringify(response.body).replace(/:"([^"]+)"/g, (match, $1) => {
+    JSON.stringify(response.data).replace(/:"([^"]+)"/g, (match, $1) => {
       return `: "${he.escape($1)}"`;
     }),
   );
 };
 
 const getDocumentById = async (inhabitantProjectId, documentId) => {
-  const response = await request.get(`/api/inhabitant-projects/${inhabitantProjectId}/documents/${documentId}`);
+  const response = await axios.get(`/api/inhabitant-projects/${inhabitantProjectId}/documents/${documentId}`);
 
   return JSON.parse(
-    JSON.stringify(response.body).replace(/:"([^"]+)"/g, (match, $1) => {
+    JSON.stringify(response.data).replace(/:"([^"]+)"/g, (match, $1) => {
       return `: "${he.escape($1)}"`;
     }),
   );
 };
 
 const getDocumentThumbnail = async (inhabitantProjectId, documentId) => {
-  return await request.get(`/api/inhabitant-projects/${inhabitantProjectId}/documents/${documentId}/thumbnail`);
+  return await axios.get(`/api/inhabitant-projects/${inhabitantProjectId}/documents/${documentId}/thumbnail`);
 };
 
 const updateDocumentName = async (inhabitantProjectId, documentId, documentName) => {
-  return await request
-    .patch(`/api/inhabitant-projects/${inhabitantProjectId}/documents/${documentId}`)
-    .send({ title: documentName });
+  return await axios.patch(`/api/inhabitant-projects/${inhabitantProjectId}/documents/${documentId}`, {
+    title: documentName,
+  });
 };
 
 const deleteDocument = async (inhabitantProjectId, documentId) => {
-  return await request.delete(`/api/inhabitant-projects/${inhabitantProjectId}/documents/${documentId}`);
+  return await axios.delete(`/api/inhabitant-projects/${inhabitantProjectId}/documents/${documentId}`);
 };
 
 export {

package/src/services/api/estimatesApi.js

@@ -1,56 +1,59 @@
-import request from 'superagent';
+import axios from 'axios';
 import he from 'he';
 
 export const getAllEstimates = async (currentEstimatesPage, estimatesPerPageCount, inhabitantProjectId) => {
   const start = currentEstimatesPage * estimatesPerPageCount;
   const end = start + estimatesPerPageCount - 1;
-  const response = await request.get(`/api/estimates?range=${start}-${end}&inhabitantProjectId=${inhabitantProjectId}`);
+  const response = await axios.get(`/api/estimates?range=${start}-${end}&inhabitantProjectId=${inhabitantProjectId}`);
 
   return JSON.parse(
-    JSON.stringify(response.body).replace(/:"([^"]+)"/g, (match, $1) => {
+    JSON.stringify(response.data).replace(/:"([^"]+)"/g, (match, $1) => {
       return `: "${he.escape($1)}"`;
     }),
   );
 };
 
 export const getEstimateById = async (id) => {
-  const response = await request.get(`/api/estimates/${id}`);
+  const response = await axios.get(`/api/estimates/${id}`);
 
   return JSON.parse(
-    JSON.stringify(response.body).replace(/:"([^"]+)"/g, (match, $1) => {
+    JSON.stringify(response.data).replace(/:"([^"]+)"/g, (match, $1) => {
       return `: "${he.escape($1)}"`;
     }),
   );
 };
 
 export const deleteEstimateById = async (id) => {
-  const response = await request.delete(`/api/estimates/${id}`);
+  const response = await axios.delete(`/api/estimates/${id}`);
 
   return JSON.parse(
-    JSON.stringify(response.body).replace(/:"([^"]+)"/g, (match, $1) => {
+    JSON.stringify(response.data).replace(/:"([^"]+)"/g, (match, $1) => {
       return `: "${he.escape($1)}"`;
     }),
   );
 };
 
 export const saveEstimate = async (estimate) => {
-  const response = await request.post('/api/estimates').set('Content-Type', 'application/json').send(estimate);
+  const response = await axios.post('/api/estimates', estimate, {
+    headers: {
+      'Content-Type': 'application/json',
+    },
+  });
 
   return JSON.parse(
-    JSON.stringify(response.body).replace(/:"([^"]+)"/g, (match, $1) => {
+    JSON.stringify(response.data).replace(/:"([^"]+)"/g, (match, $1) => {
       return `: "${he.escape($1)}"`;
     }),
   );
 };
 
 export const estimate = async (estimatorId, statelessEstimate) => {
-  const response = await request
-    .post(`/api/estimators/${estimatorId}:estimate`)
-    .set('Content-Type', 'application/json')
-    .send(statelessEstimate);
+  const response = await axios.post(`/api/estimators/${estimatorId}:estimate`, statelessEstimate, {
+    headers: { 'Content-Type': 'application/json' },
+  });
 
   return JSON.parse(
-    JSON.stringify(response.body).replace(/:"([^"]+)"/g, (match, $1) => {
+    JSON.stringify(response.data).replace(/:"([^"]+)"/g, (match, $1) => {
       return `: "${he.escape($1)}"`;
     }),
   );

package/src/services/api/eventsApi.js

@@ -1,63 +1,61 @@
-import request from 'superagent';
+import axios from 'axios';
 import he from 'he';
 
 export const sendAppointmentQualificationEvent = async (event) => {
-  const response = await request
-    .post('/api/events/appointment-qualification-events')
-    .set('Content-Type', 'application/json')
-    .send(event);
+  const response = await axios.post('/api/events/appointment-qualification-events', event, {
+    headers: { 'Content-Type': 'application/json' },
+  });
 
   return JSON.parse(
-    JSON.stringify(response.body).replace(/:"([^"]+)"/g, (match, $1) => {
+    JSON.stringify(response.data).replace(/:"([^"]+)"/g, (match, $1) => {
       return `: "${he.escape($1)}"`;
     }),
   );
 };
 
 export const sendAppointmentQualificationAnswers = async (event) => {
-  const response = await request
-    .post('/api/events/appointment-qualification-answers')
-    .set('Content-Type', 'application/json')
-    .send(event);
+  const response = await axios.post('/api/events/appointment-qualification-answers', event, {
+    headers: { 'Content-Type': 'application/json' },
+  });
 
   return JSON.parse(
-    JSON.stringify(response.body).replace(/:"([^"]+)"/g, (match, $1) => {
+    JSON.stringify(response.data).replace(/:"([^"]+)"/g, (match, $1) => {
       return `: "${he.escape($1)}"`;
     }),
   );
 };
 
 export const sendDocumentsEvent = async (event) => {
-  const response = await request.post('/api/events/documents').set('Content-Type', 'application/json').send(event);
+  const response = await axios.post('/api/events/documents', event, {
+    headers: { 'Content-Type': 'application/json' },
+  });
 
   return JSON.parse(
-    JSON.stringify(response.body).replace(/:"([^"]+)"/g, (match, $1) => {
+    JSON.stringify(response.data).replace(/:"([^"]+)"/g, (match, $1) => {
       return `: "${he.escape($1)}"`;
     }),
   );
 };
 
 export const sendCardClickEvent = async (event) => {
-  const response = await request
-    .post('/api/events/pushed-card-clicks')
-    .set('Content-Type', 'application/json')
-    .send(event);
+  const response = await axios.post('/api/events/pushed-card-clicks', event, {
+    headers: { 'Content-Type': 'application/json' },
+  });
 
   return JSON.parse(
-    JSON.stringify(response.body).replace(/:"([^"]+)"/g, (match, $1) => {
+    JSON.stringify(response.data).replace(/:"([^"]+)"/g, (match, $1) => {
       return `: "${he.escape($1)}"`;
     }),
   );
 };
 
 export const sendDeclarationEvent = async (event) => {
-  const response = await request
-    .post('/api/events/project-declarations')
-    .set('Content-Type', 'application/json')
-    .send(event);
+  const response = await axios.post('/api/events/project-declarations', event, {
+    headers: { 'Content-Type': 'application/json' },
+  });
 
   return JSON.parse(
-    JSON.stringify(response.body).replace(/:"([^"]+)"/g, (match, $1) => {
+    JSON.stringify(response.data).replace(/:"([^"]+)"/g, (match, $1) => {
       return `: "${he.escape($1)}"`;
     }),
   );

package/src/services/api/inhabitantsApi.js

@@ -1,11 +1,11 @@
-import request from 'superagent';
+import axios from 'axios';
 import he from 'he';
 
 export const getInhabitantById = async (inhabitantId, buId = '001') => {
-  const response = await request.get(`/api/inhabitant-api/users/${buId}/${inhabitantId}`);
+  const response = await axios.get(`/api/inhabitant-api/users/${buId}/${inhabitantId}`);
 
   return JSON.parse(
-    JSON.stringify(response.body).replace(/:"([^"]+)"/g, (match, $1) => {
+    JSON.stringify(response.data).replace(/:"([^"]+)"/g, (match, $1) => {
       return `: "${he.escape($1)}"`;
     }),
   );

package/src/services/api/mediaApi.js

@@ -1,21 +1,21 @@
-import request from 'superagent';
+import axios from 'axios';
 import he from 'he';
 
 const getAllMedia = async (start, end, inhabitantProjectId) => {
-  const response = await request.get(`/api/media?range=${start}-${end}&inhabitantProjectId=${inhabitantProjectId}`);
+  const response = await axios.get(`/api/media?range=${start}-${end}&inhabitantProjectId=${inhabitantProjectId}`);
 
   return JSON.parse(
-    JSON.stringify(response.body).replace(/:"([^"]+)"/g, (match, $1) => {
+    JSON.stringify(response.data).replace(/:"([^"]+)"/g, (match, $1) => {
       return `: "${he.escape($1)}"`;
     }),
   );
 };
 
 const getMediumById = async (mediumId) => {
-  const response = await request.get(`/api/media/${mediumId}`);
+  const response = await axios.get(`/api/media/${mediumId}`);
 
   return JSON.parse(
-    JSON.stringify(response.body).replace(/:"([^"]+)"/g, (match, $1) => {
+    JSON.stringify(response.data).replace(/:"([^"]+)"/g, (match, $1) => {
       return `: "${he.escape($1)}"`;
     }),
   );
@@ -23,27 +23,27 @@ const getMediumById = async (mediumId) => {
 
 const uploadMedia = async (formData, inhabitantProjectId, correlationId, fileName, isRoomPicture, trackProgress) => {
   const [name, file] = formData.entries().next().value;
-
-  return await request
-    .post('/api/media')
-    .attach(name, file)
-    .field(
-      'metadata',
-      JSON.stringify({ inhabitantProjectId, correlationId, title: fileName, roomPicture: isRoomPicture }, null, '\t'),
-    )
-    .on('progress', trackProgress);
+  const data = new FormData();
+  data.append(name, file);
+  data.append(
+    'metadata',
+    JSON.stringify({ inhabitantProjectId, correlationId, title: fileName, roomPicture: isRoomPicture }, null, '\t'),
+  );
+  return await axios.post('/api/media', data, {
+    onUploadProgress: trackProgress,
+  });
 };
 
 const updateMediaName = async (mediaId, mediaName) => {
-  return await request.patch(`/api/media/${mediaId}`).send({ title: mediaName });
+  return await axios.patch(`/api/media/${mediaId}`, { title: mediaName });
 };
 
 const makeMediaPublic = async (mediaId) => {
-  return await request.patch(`/api/media/${mediaId}`).send({ public: true });
+  return await axios.patch(`/api/media/${mediaId}`, { public: true });
 };
 
 const deleteMedia = async (mediaId) => {
-  return await request.delete(`/api/media/${mediaId}`);
+  return await axios.delete(`/api/media/${mediaId}`);
 };
 
 export { getAllMedia, getMediumById, uploadMedia, updateMediaName, makeMediaPublic, deleteMedia };

package/src/services/api/productsApi.js

@@ -1,54 +1,53 @@
-import request from 'superagent';
+import axios from 'axios';
 import he from 'he';
 
 export const getWorkKindsByProjectTypeId = async (projectTypeId) => {
-  const response = await request.get(`/api/project-types/${projectTypeId}/work-kinds`);
+  const response = await axios.get(`/api/project-types/${projectTypeId}/work-kinds`);
 
   return JSON.parse(
-    JSON.stringify(response.body).replace(/:"([^"]+)"/g, (match, $1) => {
+    JSON.stringify(response.data).replace(/:"([^"]+)"/g, (match, $1) => {
       return `: "${he.escape($1)}"`;
     }),
   );
 };
 
 export const getProductsByWorkKind = async (workKindId, storeId) => {
-  const response = await request.get(`/api/work-kinds/${workKindId}/products${storeId ? '?storeId=' + storeId : ''}`);
+  const response = await axios.get(`/api/work-kinds/${workKindId}/products${storeId ? '?storeId=' + storeId : ''}`);
 
   return JSON.parse(
-    JSON.stringify(response.body).replace(/:"([^"]+)"/g, (match, $1) => {
+    JSON.stringify(response.data).replace(/:"([^"]+)"/g, (match, $1) => {
       return `: "${he.escape($1)}"`;
     }),
   );
 };
 
 export const getProductsFeatureFlag = async (projectTypeId) => {
-  const response = await request.get(`/api/project-types/${projectTypeId}/products-feature-flag`);
+  const response = await axios.get(`/api/project-types/${projectTypeId}/products-feature-flag`);
 
   return JSON.parse(
-    JSON.stringify(response.body).replace(/:"([^"]+)"/g, (match, $1) => {
+    JSON.stringify(response.data).replace(/:"([^"]+)"/g, (match, $1) => {
       return `: "${he.escape($1)}"`;
     }),
   );
 };
 
 export const saveWorkKinds = async (inhabitantProjectId, workKinds) => {
-  const response = await request
-    .put(`/api/inhabitant-projects/${inhabitantProjectId}/work-kinds`)
-    .set('Content-Type', 'application/json')
-    .send(workKinds);
+  const response = await axios.put(`/api/inhabitant-projects/${inhabitantProjectId}/work-kinds`, workKinds, {
+    headers: { 'Content-Type': 'application/json' },
+  });
 
   return JSON.parse(
-    JSON.stringify(response.body).replace(/:"([^"]+)"/g, (match, $1) => {
+    JSON.stringify(response.data).replace(/:"([^"]+)"/g, (match, $1) => {
       return `: "${he.escape($1)}"`;
     }),
   );
 };
 
 export const getWorkKindsByProjectId = async (inhabitantProjectId) => {
-  const response = await request.get(`/api/inhabitant-projects/${inhabitantProjectId}/work-kinds`);
+  const response = await axios.get(`/api/inhabitant-projects/${inhabitantProjectId}/work-kinds`);
 
   return JSON.parse(
-    JSON.stringify(response.body).replace(/:"([^"]+)"/g, (match, $1) => {
+    JSON.stringify(response.data).replace(/:"([^"]+)"/g, (match, $1) => {
       return `: "${he.escape($1)}"`;
     }),
   );

package/src/services/api/projectsApi.js

@@ -1,13 +1,13 @@
-import request from 'superagent';
+import axios from 'axios';
 import he from 'he';
 
 export const getAllProjects = async (currentProjectsPage, projectsPerPageCount) => {
   const start = currentProjectsPage * projectsPerPageCount;
   const end = start + projectsPerPageCount - 1;
-  const response = await request.get(`/api/inhabitant-projects?range=${start}-${end}`);
+  const response = await axios.get(`/api/inhabitant-projects?range=${start}-${end}`);
 
   return JSON.parse(
-    JSON.stringify(response.body).replace(/:"([^"]+)"/g, (match, $1) => {
+    JSON.stringify(response.data).replace(/:"([^"]+)"/g, (match, $1) => {
       return `: "${he.escape($1)}"`;
     }),
   );
@@ -16,71 +16,69 @@ export const getAllProjects = async (currentProjectsPage, projectsPerPageCount)
 export const getAllProjectsForUserId = async (currentProjectsPage, projectsPerPageCount, userId) => {
   const start = currentProjectsPage * projectsPerPageCount;
   const end = start + projectsPerPageCount - 1;
-  const response = await request.get(`/api/inhabitant-projects?range=${start}-${end}&userId=${userId}`);
+  const response = await axios.get(`/api/inhabitant-projects?range=${start}-${end}&userId=${userId}`);
 
   return JSON.parse(
-    JSON.stringify(response.body).replace(/:"([^"]+)"/g, (match, $1) => {
+    JSON.stringify(response.data).replace(/:"([^"]+)"/g, (match, $1) => {
       return `: "${he.escape($1)}"`;
     }),
   );
 };
 
 export const getProjectById = async (id) => {
-  const response = await request.get(`/api/inhabitant-projects/${id}`);
+  const response = await axios.get(`/api/inhabitant-projects/${id}`);
 
   return JSON.parse(
-    JSON.stringify(response.body).replace(/:"([^"]+)"/g, (match, $1) => {
+    JSON.stringify(response.data).replace(/:"([^"]+)"/g, (match, $1) => {
       return `: "${he.escape($1)}"`;
     }),
   );
 };
 
 export const deleteProjectById = async (id) => {
-  const response = await request.delete(`/api/inhabitant-projects/${id}`);
+  const response = await axios.delete(`/api/inhabitant-projects/${id}`);
 
   return JSON.parse(
-    JSON.stringify(response.body).replace(/:"([^"]+)"/g, (match, $1) => {
+    JSON.stringify(response.data).replace(/:"([^"]+)"/g, (match, $1) => {
       return `: "${he.escape($1)}"`;
     }),
   );
 };
 
 export const saveInhabitantProject = async (inhabitantProject) => {
-  const response = await request
-    .post('/api/inhabitant-projects')
-    .set('Content-Type', 'application/json')
-    .send(inhabitantProject);
+  const response = await axios.post('/api/inhabitant-projects', inhabitantProject, {
+    headers: { 'Content-Type': 'application/json' },
+  });
   return response.headers.location;
 };
 
 export const saveProjectDeclaration = async (projectDeclaration) => {
-  const response = await request
-    .post('/api/declarations')
-    .set('Content-Type', 'application/json')
-    .send(projectDeclaration);
+  const response = await axios.post('/api/declarations', projectDeclaration, {
+    headers: { 'Content-Type': 'application/json' },
+  });
 
   return JSON.parse(
-    JSON.stringify(response.body).replace(/:"([^"]+)"/g, (match, $1) => {
+    JSON.stringify(response.data).replace(/:"([^"]+)"/g, (match, $1) => {
       return `: "${he.escape($1)}"`;
     }),
   );
 };
 
 export const getProjectAttributesById = async (id) => {
-  const response = await request.get(`/api/inhabitant-projects/${id}/attributes`);
+  const response = await axios.get(`/api/inhabitant-projects/${id}/attributes`);
 
   return JSON.parse(
-    JSON.stringify(response.body).replace(/:"([^"]+)"/g, (match, $1) => {
+    JSON.stringify(response.data).replace(/:"([^"]+)"/g, (match, $1) => {
       return `: "${he.escape($1)}"`;
     }),
   );
 };
 
 export const getAppointmentById = async (id) => {
-  const response = await request.get(`/api/inhabitant-projects/${id}/main-appointment`);
+  const response = await axios.get(`/api/inhabitant-projects/${id}/main-appointment`);
 
   return JSON.parse(
-    JSON.stringify(response.body).replace(/:"([^"]+)"/g, (match, $1) => {
+    JSON.stringify(response.data).replace(/:"([^"]+)"/g, (match, $1) => {
       return `: "${he.escape($1)}"`;
     }),
   );

package/src/services/api/toolsApi.js

@@ -1,11 +1,11 @@
-import request from 'superagent';
+import axios from 'axios';
 import he from 'he';
 
 export const getAllTools = async (projectType) => {
-  const response = await request.get(`${config.VUE_APP_TOOLS_CONFIGURATION_STORAGE}/${projectType}.json`);
+  const response = await axios.get(`${config.VUE_APP_TOOLS_CONFIGURATION_STORAGE}/${projectType}.json`);
 
   return JSON.parse(
-    JSON.stringify(response.body).replace(/:"([^"]+)"/g, (match, $1) => {
+    JSON.stringify(response.data).replace(/:"([^"]+)"/g, (match, $1) => {
       return `: "${he.escape($1)}"`;
     }),
   );

package/src/stores/modules/projectsStore.js

@@ -586,6 +586,9 @@ export const projectTypologiesStoreOptions = {
     setTypologies(state, typologies) {
       state.typologies = typologies;
     },
+    addTypologies(state, typologies) {
+      state.typologies.push(...typologies);
+    },
     setTypologiesLoadError(state, typologiesLoadError) {
       state.typologiesLoadError = typologiesLoadError;
     },
@@ -603,10 +606,10 @@ export const projectTypologiesStoreOptions = {
     },
   },
   actions: {
-    async loadTypologies({ commit, state }) {
+    async loadTypologies({ commit, state, rootGetters }) {
       commit('setTypologiesLoadError', null);
       try {
-        const typologies = state.summary.suggestedTypologies.map((typology) => ({
+        const typologies = rootGetters['estimates/getSummary']?.suggestedTypologies?.map((typology) => ({
           code: typology.domesticSpaceHref,
           title: typology.domesticSpaceLabel,
         }));