Update LPS phone number and email

frontend/src/components/ContactExpert.vue

@@ -22,31 +22,27 @@ function onClose () {
   </div>
   <Teleport to="body">
     <DsfrModal
-      title=""
       :opened="showModal"
       @close="onClose()"
     >
       <div class="modal">
-        <div class="modal-content" />
-        <h2>
-          <VIcon
-            name="ri-arrow-right-line"
-            scale="1.5"
-          />
-          Contact à un expert arme
-        </h2>
-        <p>
-          Sélectionnez ci-dessous votre corps de métier <br>
-        </p>
-        <div>
-          <div class="fr-col-11 fr-col-lg-6 mx-auto">
+        <div class="modal-content">
+          <h2>
+            <VIcon
+              name="ri-arrow-right-line"
+              scale="1.5"
+            />
+            Contacter un expert arme
+          </h2>
+          <p>Sélectionnez ci-dessous votre corps de métier.</p>
+          <div>
             <DsfrButton
-              class="m-1 flex justify-center w-80"
+              class="w-100 m-1"
               label="Police Nationale"
               @click="router.push({ name:'ExpertSituationPN'})"
             />
             <DsfrButton
-              class="m-1 flex justify-center w-80"
+              class="w-100 m-1"
               label="Gendarmerie Nationale"
               @click="router.push({ name:'ExpertSituationGN'})"
             />
@@ -62,27 +58,8 @@ function onClose () {
   margin: auto !important;
 }
 
-.modal {
-  display: flex;
-  flex-direction: column;
-}
-
-.modal-content {
-  flex: 1;
-  overflow-y: auto;
-}
-
-.modal-footer {
-  position: sticky;
-  bottom: 0;
-  text-align: center;
-  background-color: #f5f5fe;
-  box-shadow: 0 -4px 16px rgb(0 0 0 / 25%);
-  padding: 1rem !important;
-  width: 100%;
-}
-.modal-footer button {
-  width: 100%;
+.w-100 {
+  width: 100% !important;
 }
 
 </style>

frontend/src/components/ResultPage.vue

@@ -3,6 +3,7 @@ import { ref, computed, watchEffect } from 'vue'
 import axios from 'axios'
 import SnackbarAlert from '@/components/SnackbarAlert.vue'
 import { resultTree } from '@/utils/firearms-utils/index'
+import { isUserUsingCrosscall } from '@/utils/isUserUsingCrosscall'
 import { useSnackbarStore } from '@/stores/snackbar'
 import { useStepsStore } from '@/stores/steps'
 import { useResultStore } from '@/stores/result'
@@ -122,6 +123,7 @@ function sendFeedback (isCorrect: boolean) {
             <p class="text-sm font-normal m-4 text-left text-current">
               Nous n'avons pas suffisamment d'éléments pour fournir une réponse fiable. Nous vous conseillons de faire appel à un expert.
             </p>
+            <ContactExpert v-if="isUserUsingCrosscall()" />
           </div>
           <div v-else>
             <div class="fr-tile__body">
@@ -141,6 +143,7 @@ function sendFeedback (isCorrect: boolean) {
                 <p class="warning-text">
                   Nous vous conseillons de faire appel à un expert pour confirmer cette réponse.
                 </p>
+                <ContactExpert v-if="isUserUsingCrosscall()" />
               </div>
               <div v-if="isDummy === false && (route.name !== 'IdentificationTypologyResult'|| isDummyTypology !== true)">
                 <p

frontend/src/router/index.ts

@@ -23,10 +23,7 @@ const IdentificationTypologyResult = () => import('@/views/GuideIdentificationFi
 const IdentificationFinalResult = () => import('@/views/GuideIdentificationFirearm/IdentificationFinalResult.vue')
 const IdentificationFurtherInformations = () => import('@/views/GuideIdentificationFirearm/IdentificationFurtherInformations.vue')
 const IdentificationSelectAmmo = () => import('@/views/GuideIdentificationFirearm/IdentificationSelectAmmo.vue')
-const ExpertSituationPN = () => import('@/views/GuideContactExpert/ExpertSituationPN.vue')
-const ExpertSituationGN = () => import('@/views/GuideContactExpert/ExpertSituationGN.vue')
-const ExpertPTS = () => import('@/views/GuideContactExpert/ExpertPTS.vue')
-const ExpertPTSNU = () => import('@/views/GuideContactExpert/ExpertPTSNU.vue')
+const ExpertSituation = () => import('@/views/GuideContactExpert/ExpertSituation.vue')
 
 const routes: Parameters<typeof createRouter> [0]['routes'] = [
   {
@@ -180,22 +177,12 @@ const routes: Parameters<typeof createRouter> [0]['routes'] = [
   {
     path: '/guide-contact-pn',
     name: 'ExpertSituationPN',
-    component: ExpertSituationPN,
+    component: ExpertSituation,
   },
   {
     path: '/guide-contact-gn',
     name: 'ExpertSituationGN',
-    component: ExpertSituationGN,
-  },
-  {
-    path: '/guide-contact-pn/urgence',
-    name: 'ExpertPTS',
-    component: ExpertPTS,
-  },
-  {
-    path: '/guide-contact-pn/non-urgence',
-    name: 'ExpertPTSNU',
-    component: ExpertPTSNU,
+    component: ExpertSituation,
   },
 ]
 

frontend/src/utils/isUserUsingCrosscall.ts

@@ -0,0 +1,9 @@
+export function isUserUsingCrosscall () {
+  const userAgent = window.navigator.userAgent
+  const keyWords = ['Mobile', 'Mozilla', 'Crosscall']
+
+  const isUsingCrosscall = keyWords.every(keyWord => {
+    return userAgent.includes(keyWord)
+  })
+  return isUsingCrosscall
+}