Refactor category handling

frontend/src/components/ResultPage.vue

@@ -1,44 +1,21 @@
 <script lang="ts" setup>
-import { ref, computed, watchEffect } from 'vue'
+import { ref, computed } from 'vue'
 import axios from 'axios'
 import SnackbarAlert from '@/components/SnackbarAlert.vue'
 import { TYPOLOGIES, MEASURED_GUNS_TYPOLOGIES } 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'
-import { useRouter, useRoute } from 'vue-router'
 import { getMentionsFromCategories } from '@/utils/mentions'
 
 const { setMessage } = useSnackbarStore()
 const stepsStore = useStepsStore()
 const resultStore = useResultStore()
-const router = useRouter()
-const route = useRoute()
-
-function getCategoryFromTypologyAndMeasures (typology: string, gunLength: number, gunBarrelLength: number) {
-  if (gunLength !== null && gunBarrelLength !== null) {
-    switch (typology) {
-      case 'epaule_a_pompe':
-        if (gunLength > 75 && gunBarrelLength > 55) { return 'C' } else { return 'B' }
-      case 'epaule_a_un_coup_par_canon':
-        if (gunLength > 75 && gunBarrelLength > 40) { return 'C' } else { return 'B' }
-      case 'epaule_a_levier_sous_garde': case 'epaule_a_verrou': case 'epaule_semi_auto_style_chasse':
-        if (gunLength < 75 || gunBarrelLength < 40) { return 'B' }
-        if (gunLength > 75 && gunBarrelLength > 55) { return 'C' }
-    }
-  }
-  return TYPOLOGIES[typology]?.category
-}
-
-watchEffect(() => {
-  if (!resultStore.img) router.push({ name: 'StartPage' })
-})
 
 const confidence = computed(() => resultStore.confidence)
 const confidenceLevel = computed(() => resultStore.confidenceLevel)
 const img = computed(() => resultStore.img)
-const imgUrl = computed(() => resultStore.imgUrl)
 
 const typology = computed(() => resultStore.typology)
 
@@ -60,15 +37,15 @@ const category = computed(() => {
   } else if (typology.value === 'revolver') {
     return TYPOLOGIES[typology.value]?.categoryWithoutSecuring
   } else {
-    return getCategoryFromTypologyAndMeasures(typology.value, resultStore.gunLength, resultStore.gunBarrelLength)
+    return TYPOLOGIES[typology.value]?.getCategory(resultStore.gunLength, resultStore.gunBarrelLength)
   }
 })
 
 const disclaimer = computed(() => TYPOLOGIES[typology.value] && Object.hasOwn(TYPOLOGIES[typology.value], 'getDisclaimer') ? TYPOLOGIES[typology.value].getDisclaimer(category.value, isCardDetected.value) : null)
 
 function sendFeedback (isCorrect: boolean) {
   const json = {
-    image_url: imgUrl.value,
+    image_url: resultStore.imgUrl,
     feedback: isCorrect,
     confidence: confidence.value,
     label: typology.value,
@@ -98,7 +75,7 @@ function sendFeedback (isCorrect: boolean) {
   <div class="result-frame -mx-8 py-5 px-8">
     <div class="result">
       <h2
-        v-if="route.name === 'IdentificationTypologyResult' && isDummyTypology === true"
+        v-if="$route.name === 'IdentificationTypologyResult' && isDummyTypology === true"
         class="typology-title bg-white py-4"
       >
         Typologie de l'arme
@@ -167,7 +144,7 @@ function sendFeedback (isCorrect: boolean) {
               >
                 {{ label }}
               </h3>
-              <template v-if="confidenceLevel !== 'low' && (route.name !== 'IdentificationTypologyResult' || isDummyTypology !== true)">
+              <template v-if="confidenceLevel !== 'low' && ($route.name !== 'IdentificationTypologyResult' || isDummyTypology !== true)">
                 <h3
                   class="fr-alert__title"
                   data-testid="arm-category"
@@ -180,14 +157,14 @@ function sendFeedback (isCorrect: boolean) {
               </template>
             </div>
             <div
-              v-if="disclaimer && confidenceLevel !== 'low' && (route.name !== 'IdentificationTypologyResult' || isDummyTypology !== true)"
+              v-if="disclaimer && confidenceLevel !== 'low' && ($route.name !== 'IdentificationTypologyResult' || isDummyTypology !== true)"
               class="fr-alert fr-alert--warning"
             >
               <p v-html="disclaimer" />
             </div>
             <MissingCardAlert v-if="MEASURED_GUNS_TYPOLOGIES.includes(typology) && isCardDetected === false && isDummy == false" />
             <div
-              v-if="confidenceLevel !== 'low' && (route.name !== 'IdentificationTypologyResult' || isDummyTypology !== true)"
+              v-if="confidenceLevel !== 'low' && ($route.name !== 'IdentificationTypologyResult' || isDummyTypology !== true)"
               class="fr-callout mt-3"
             >
               <p class="fr-callout__text">
@@ -201,7 +178,7 @@ function sendFeedback (isCorrect: boolean) {
               </p>
             </div>
             <div
-              v-if="confidenceLevel !== 'low' && route.name === 'IdentificationTypologyResult' && isDummyTypology"
+              v-if="confidenceLevel !== 'low' && $route.name === 'IdentificationTypologyResult' && isDummyTypology"
               class="fr-alert fr-alert--warning"
             >
               <p>
@@ -222,7 +199,7 @@ function sendFeedback (isCorrect: boolean) {
       <SnackbarAlert class="text-center" />
     </div>
     <div
-      v-if="confidenceLevel !== 'low' && route.name !== 'IdentificationFinalResult'"
+      v-if="confidenceLevel !== 'low' && $route.name !== 'IdentificationFinalResult'"
       :aria-disabled="isFeedbackDone"
       class="feedback"
     >

frontend/src/utils/firearms-utils/arme-alarme.ts

@@ -28,7 +28,7 @@ import pistoletAlarmeImg13Zoom from '@/assets/guide-identification/photos/arme_a
 
 export const arme_alarme = {
   displayLabel: 'Arme d\'alarme',
-  category: 'D',
+  getCategory: () => 'D',
   options: [
     {
       label: 'ZORAKI R2',

frontend/src/utils/firearms-utils/autre-pistolet.ts

@@ -16,7 +16,7 @@ Autre pistolet
 export const autre_pistolet = {
   typologie: 'autre_pistolet',
   displayLabel: 'Pistolet divers',
-  category: 'A, B ou D',
+  getCategory: () => 'A, B ou D',
   isDummyTypology: false,
   options_text: '',
   options: {

frontend/src/utils/firearms-utils/epaule-a-levier-sous-garde.ts

@@ -2,15 +2,15 @@ import levierSousGardeMagasinAvantImg from '@/assets/guide-mise-en-securite/phot
 import levierSousGardePasMagasinImg from '@/assets/guide-mise-en-securite/photos/epaule_a_levier_sous_garde/epaule_levier_ss_garde_magasin_fixe.jpg'
 import levierSousGardeMagasinAvantVideo from '@/assets/guide-mise-en-securite/videos/epaule_a_levier_sous_garde/epaule_levier_ss_garde_magasin_avant.mp4'
 import levierSousGardePasMagasinVideo from '@/assets/guide-mise-en-securite/videos/epaule_a_levier_sous_garde/epaule_levier_ss_garde_magasin_fixe.mp4'
-import { getEpaulLevierVerrouDisclaimer } from '@/utils/firearms-utils/index'
+import { getEpaulLevierVerrouDisclaimer, getCommonCategory } from '@/utils/firearms-utils/index'
 /*
 Armes d’épaule à levier de sous-garde
   Magasin avant
   Magasin fixe
 */
 export const epaule_a_levier_sous_garde = {
   displayLabel: "Arme d'épaule à levier de sous-garde",
-  category: 'B ou C',
+  getCategory: getCommonCategory,
   isDummyTypology: false,
   options_text: 'En manipulant l’arme avec précaution dans une <span class="font-bold">direction sans risque</span>, inspectez l’<span class="font-bold">extrémité du tube sous le canon</span>. Sélectionnez ce que vous voyez :',
   options: {

frontend/src/utils/firearms-utils/epaule-a-pompe.ts

@@ -2,10 +2,13 @@ import epaulePompeSimpleVideo from '@/assets/guide-mise-en-securite/videos/epaul
 // import epaulePompeCompliqueVideo from '@/assets/guide-mise-en-securite/videos/epaule_a_pompe/epaule_pompe_complique.mp4'
 /*
 3 - Armes d’épaule à pompe
+
 */
 export const epaule_a_pompe = {
   displayLabel: "Arme d'épaule à pompe",
-  category: 'B ou C',
+  getCategory: (gunLength: number, gunBarrelLength: number) => {
+    if (gunLength && gunBarrelLength) { return gunLength > 75 && gunBarrelLength > 55 ? 'C' : 'B' } else { return 'B ou C' }
+  },
   isDummyTypology: false,
   options_text: '',
   text_steps: {

frontend/src/utils/firearms-utils/epaule-a-un-coup-par-canon.ts

@@ -12,7 +12,9 @@ Armes d’épaule à un coup par canon
   */
 export const epaule_a_un_coup_par_canon = {
   displayLabel: "Arme d'épaule à un coup par canon",
-  category: 'B ou C',
+  getCategory: (gunLength: number, gunBarrelLength: number) => {
+    if (gunLength && gunBarrelLength) { return (gunLength > 75 && gunBarrelLength > 40) ? 'C' : 'B' } else { return 'B ou C' }
+  },
   isDummyTypology: false,
   options_text: 'Sélectionnez ce que vous voyez sur la <span class="font-bold">zone centrale de l’arme</span>',
   options: {

frontend/src/utils/firearms-utils/epaule-a-verrou.ts

@@ -1,14 +1,14 @@
 import epauleAVerrouCartridges from '@/assets/guide-identification/photos/epaule_a_verrou/epaule_a_verrou_chargeur_cartouche.jpg'
 import epauleAVerrouBalls from '@/assets/guide-identification/photos/epaule_a_verrou/epaule_a_verrou_chargeur_bille.jpg'
 import epauleAVerrouVideo from '@/assets/guide-mise-en-securite/videos/epaule_a_verrou/epaule_verrou_chargeur-video.mp4'
-import { getEpaulLevierVerrouDisclaimer } from '@/utils/firearms-utils/index'
+import { getEpaulLevierVerrouDisclaimer, getCommonCategory } from '@/utils/firearms-utils/index'
 
 /*
 Armes d’épaule à verrou
 */
 export const epaule_a_verrou = {
   displayLabel: 'Arme d’épaule à verrou',
-  category: 'B ou C',
+  getCategory: getCommonCategory,
   isDummyTypology: true,
   text_steps: {
     1: 'Observer l’arme en l’orientant dans une <span class="font-bold">direction sans risque</span>, en manipulant avec précaution',

frontend/src/utils/firearms-utils/epaule-semi-auto-militaire-milieu-20e.ts

@@ -3,7 +3,7 @@ Armes d’épaule semi-automatiques ou automatiques type militaire milieu 20e
 */
 export const epaule_semi_auto_style_militaire_milieu_20e = {
   displayLabel: 'Arme d’épaule semi-automatique ou automatique',
-  category: 'A ou B',
+  getCategory: () => 'A ou B',
   isDummyTypology: false,
   getDisclaimer: () => "<strong>Catégorie A</strong> si à l'origine l’arme était à <strong>répétition automatique</strong> puis a été <strong>transformée</strong> en arme <strong>semi automatique</strong>, ou si l’arme possède <strong>une crosse rétractable / pliable</strong> et qu’en configuration la plus courte elle <strong>mesure moins de 60 cm</strong>.",
 } as const

frontend/src/utils/firearms-utils/epaule-semi-auto-style-chasse.ts

@@ -1,3 +1,5 @@
+import { getCommonCategory } from '@/utils/firearms-utils/index'
+
 const DISCLAIMERS = {
   short: '<strong>Catégorie B</strong> si la <strong>capacité > à 3 munitions</strong>, ou si le <strong>chargeur est amovible</strong>.',
   long: '<ul><li><strong>Catégorie B</strong> si la <strong>capacité > à 3 munitions</strong>, ou si le <strong>canon est lisse</strong>, ou si le <strong>chargeur est amovible</strong>.</li><li><strong>Catégorie C</strong> si le <strong>canon est rayé</strong>.</li></ul>',
@@ -8,7 +10,7 @@ Armes d’épaule semi-automatiques ou automatiques type chasse
 */
 export const epaule_semi_auto_style_chasse = {
   displayLabel: 'Arme d’épaule semi-automatique',
-  category: 'B ou C',
+  getCategory: getCommonCategory,
   isDummyTypology: false,
   getDisclaimer: (category: string, isCardDetected: boolean) => {
     if (['B ou C', 'C'].includes(category)) {

frontend/src/utils/firearms-utils/epaule_mecanisme_ancien.ts

@@ -3,6 +3,6 @@ Armes d’épaule à mécanisme ancien
 */
 export const epaule_mecanisme_ancien = {
   displayLabel: "Arme d'épaule à mécanisme ancien",
-  category: 'D',
+  getCategory: () => 'D',
   isDummyTypology: false,
 } as const

frontend/src/utils/firearms-utils/index.ts

@@ -100,3 +100,11 @@ export function getEpaulLevierVerrouDisclaimer (category: string, isCardDetected
     return '<ul><li><strong>Catégorie B</strong> : si la capacité > 11 munitions ou si le <strong>canon est lisse</strong></li><li><strong>Catégorie C</strong> : si la capacité < 11 munitions et le <strong>canon est rayé</strong></li></ul>'
   }
 }
+
+export function getCommonCategory (gunLength: number, gunBarrelLength: number) {
+  if (gunLength && gunBarrelLength) {
+    if (gunLength < 75 || gunBarrelLength < 40) { return 'B' }
+    if (gunLength > 75 && gunBarrelLength > 55) { return 'C' }
+  }
+  return 'B ou C'
+}

frontend/src/utils/firearms-utils/pistolet-mecanisme-ancien.ts

@@ -3,6 +3,6 @@ Pistolet à mécanisme ancien
 */
 export const pistolet_mecanisme_ancien = {
   displayLabel: 'Pistolet à mécanisme ancien',
-  category: 'D',
+  getCategory: () => 'D',
   isDummyTypology: false,
 } as const

frontend/src/utils/firearms-utils/pistolet-semi-auto-moderne.ts

@@ -11,7 +11,7 @@ Pistolets semi-auto modernes
 */
 export const pistolet_semi_auto_moderne = {
   displayLabel: 'Pistolet semi-automatique',
-  category: 'B',
+  getCategory: () => 'B',
   isDummyTypology: true,
   pistolet_semi_auto_moderne_text_option: 'Sélectionner ce que vous voyez sur votre arme : <span class="font-bold">bouton à proximité du pontet du côté gauche de la poignée</span>, OU <span class="font-bold">bouton sur le talon</span> de la crosse.',
   textOptions: '',

frontend/src/utils/firearms-utils/revolver.ts

@@ -29,7 +29,7 @@ Revolvers
 */
 export const revolver = {
   displayLabel: 'Revolver',
-  category: 'B',
+  getCategory: () => 'B',
   categoryWithoutSecuring: 'B ou D',
   isDummyTypology: true,
   options_step_1_text: 'En maintenant l’arme dans une  <span class="font-bold">direction sécurisée</span> , sélectionnez ce que vous voyez.',
@@ -170,6 +170,6 @@ export const revolver = {
 
 export const revolver_black_powder = {
   displayLabel: 'Revolver à poudre noire',
-  category: 'D',
+  getCategory: () => 'D',
   isDummyTypology: false,
 } as const

frontend/src/utils/firearms-utils/semi-auto-style-militaire-autre.ts

@@ -20,7 +20,7 @@ Armes d’épaule semi-automatiques ou automatiques type militaire moderne
 */
 export const semi_auto_style_militaire_autre = {
   displayLabel: 'Arme semi-automatique ou automatique',
-  category: 'A ou B',
+  getCategory: () => 'A ou B',
   isDummyTypology: true,
   options_text: 'Observez la position du chargeur et sélectionnez ce que vous voyez :',
   options: {