From 501eda92b8c33493dd009e2e599c0225d18c7140 Mon Sep 17 00:00:00 2001
From: Alejandro MG <alejandro@amguillen.dev>
Date: Mon, 16 Dec 2024 15:32:56 +0100
Subject: [PATCH] Moves the badge to the correct component

---
 .../DeclarationSummary/SummaryElementItem.vue |  9 +++++++-
 .../DeclarationSummary/SummaryElementList.vue | 19 +++++++++++++---
 .../SummaryElementListItems.vue               |  3 ++-
 .../components/DeclarationSummary/index.vue   | 22 ++++++++++++++++---
 .../src/components/ElementStatusBadge.vue     |  2 +-
 frontend/src/views/InstructionPage/index.vue  |  2 ++
 .../views/ProducerFormPage/ElementCard.vue    |  4 ----
 frontend/src/views/VisaPage/index.vue         |  2 ++
 8 files changed, 50 insertions(+), 13 deletions(-)

diff --git a/frontend/src/components/DeclarationSummary/SummaryElementItem.vue b/frontend/src/components/DeclarationSummary/SummaryElementItem.vue
index 3ca9b99ca..71829c45f 100644
--- a/frontend/src/components/DeclarationSummary/SummaryElementItem.vue
+++ b/frontend/src/components/DeclarationSummary/SummaryElementItem.vue
@@ -10,6 +10,12 @@
             </p>
           </div>
 
+          <ElementStatusBadge
+            :text="model.element.status"
+            v-if="showElementAuthorization && model.element?.status === 'non autorisé'"
+            class="self-center ml-2"
+          />
+
           <DsfrBadge v-if="novelFood" label="Novel Food" type="new" class="self-center ml-2" small />
           <DsfrBadge v-if="model.new" label="Nouvel ingrédient" type="info" class="self-center ml-2" small />
           <DsfrBadge v-if="!model.active" label="Non-actif" type="none" class="self-center ml-2" small />
@@ -38,13 +44,14 @@ import { getElementName } from "@/utils/elements"
 import { useRootStore } from "@/stores/root"
 import { storeToRefs } from "pinia"
 import ElementCommentModal from "@/components/ElementCommentModal"
+import ElementStatusBadge from "@/components/ElementStatusBadge"
 
 const { plantParts, units, preparations, loggedUser } = storeToRefs(useRootStore())
 
 const isInstructor = computed(() => loggedUser.value?.globalRoles.some((x) => x.name === "InstructionRole"))
 
 const model = defineModel()
-const props = defineProps({ objectType: { type: String } })
+const props = defineProps({ objectType: { type: String }, showElementAuthorization: { type: Boolean } })
 
 const plantPartName = computed(() => plantParts.value?.find((x) => x.id === model.value.usedPart)?.name || "Aucune")
 const unitName = computed(() => units.value?.find((x) => x.id === model.value.unit)?.name || "")
diff --git a/frontend/src/components/DeclarationSummary/SummaryElementList.vue b/frontend/src/components/DeclarationSummary/SummaryElementList.vue
index 50bc5138b..1aea1b4e2 100644
--- a/frontend/src/components/DeclarationSummary/SummaryElementList.vue
+++ b/frontend/src/components/DeclarationSummary/SummaryElementList.vue
@@ -5,13 +5,21 @@
       <template v-slot:title>
         <SummaryElementListTitle :objectType="objectType" :elementCount="`${elements.length}`" />
       </template>
-      <SummaryElementListItems :objectType="objectType" :elements="elements" />
+      <SummaryElementListItems
+        :showElementAuthorization="showElementAuthorization"
+        :objectType="objectType"
+        :elements="elements"
+      />
     </DsfrAccordion>
 
     <!-- Affichage sans les accordéons, tous les ingrédients sont affichés -->
     <div v-else>
       <SummaryElementListTitle class="mt-6 mb-3" :objectType="objectType" />
-      <SummaryElementListItems :objectType="objectType" :elements="elements" />
+      <SummaryElementListItems
+        :showElementAuthorization="showElementAuthorization"
+        :objectType="objectType"
+        :elements="elements"
+      />
     </div>
   </div>
 </template>
@@ -20,5 +28,10 @@
 import SummaryElementListTitle from "./SummaryElementListTitle"
 import SummaryElementListItems from "./SummaryElementListItems"
 
-defineProps({ objectType: { type: String }, elements: { type: Array }, useAccordions: { type: Boolean } })
+defineProps({
+  objectType: { type: String },
+  elements: { type: Array },
+  useAccordions: { type: Boolean },
+  showElementAuthorization: { type: Boolean },
+})
 </script>
diff --git a/frontend/src/components/DeclarationSummary/SummaryElementListItems.vue b/frontend/src/components/DeclarationSummary/SummaryElementListItems.vue
index 03f2ed746..0240f8e46 100644
--- a/frontend/src/components/DeclarationSummary/SummaryElementListItems.vue
+++ b/frontend/src/components/DeclarationSummary/SummaryElementListItems.vue
@@ -6,6 +6,7 @@
       :key="`summary-${objectType}-${index}`"
       v-model="elements[index]"
       :objectType="objectType"
+      :showElementAuthorization="showElementAuthorization"
     />
   </ul>
 </template>
@@ -13,5 +14,5 @@
 <script setup>
 import SummaryElementItem from "./SummaryElementItem"
 
-defineProps({ objectType: { type: String }, elements: { type: Array } })
+defineProps({ objectType: { type: String }, elements: { type: Array }, showElementAuthorization: { type: Boolean } })
 </script>
diff --git a/frontend/src/components/DeclarationSummary/index.vue b/frontend/src/components/DeclarationSummary/index.vue
index 9f36eef65..c2fe7b6ed 100644
--- a/frontend/src/components/DeclarationSummary/index.vue
+++ b/frontend/src/components/DeclarationSummary/index.vue
@@ -27,38 +27,54 @@
       <SummaryModificationButton class="ml-4" v-if="!readonly" @click="router.push(editLink(1))" />
     </h3>
 
-    <SummaryElementList :useAccordions="useAccordions" objectType="plant" :elements="payload.declaredPlants" />
     <SummaryElementList
       :useAccordions="useAccordions"
+      :showElementAuthorization="showElementAuthorization"
+      objectType="plant"
+      :elements="payload.declaredPlants"
+    />
+    <SummaryElementList
+      :useAccordions="useAccordions"
+      :showElementAuthorization="showElementAuthorization"
       objectType="microorganism"
       :elements="payload.declaredMicroorganisms"
     />
     <SummaryElementList
       objectType="form_of_supply"
       :useAccordions="useAccordions"
+      :showElementAuthorization="showElementAuthorization"
       :elements="getObjectSubTypeList(payload.declaredIngredients, 'form_of_supply')"
     />
     <SummaryElementList
       :useAccordions="useAccordions"
+      :showElementAuthorization="showElementAuthorization"
       objectType="aroma"
       :elements="getObjectSubTypeList(payload.declaredIngredients, 'aroma')"
     />
     <SummaryElementList
       objectType="additive"
       :useAccordions="useAccordions"
+      :showElementAuthorization="showElementAuthorization"
       :elements="getObjectSubTypeList(payload.declaredIngredients, 'additive')"
     />
     <SummaryElementList
       objectType="active_ingredient"
       :useAccordions="useAccordions"
+      :showElementAuthorization="showElementAuthorization"
       :elements="getObjectSubTypeList(payload.declaredIngredients, 'active_ingredient')"
     />
     <SummaryElementList
       objectType="non_active_ingredient"
       :useAccordions="useAccordions"
+      :showElementAuthorization="showElementAuthorization"
       :elements="getObjectSubTypeList(payload.declaredIngredients, 'non_active_ingredient')"
     />
-    <SummaryElementList objectType="substance" :useAccordions="useAccordions" :elements="payload.declaredSubstances" />
+    <SummaryElementList
+      objectType="substance"
+      :useAccordions="useAccordions"
+      :showElementAuthorization="showElementAuthorization"
+      :elements="payload.declaredSubstances"
+    />
 
     <p class="font-bold mt-8">Substances contenues dans la composition :</p>
     <SubstancesTable v-model="payload" readonly />
@@ -107,7 +123,7 @@ const router = useRouter()
 const { units, populations, conditions, effects, galenicFormulations } = storeToRefs(useRootStore())
 
 const payload = defineModel()
-defineProps({ readonly: Boolean, showArticle: Boolean, useAccordions: Boolean })
+defineProps({ readonly: Boolean, showArticle: Boolean, useAccordions: Boolean, showElementAuthorization: Boolean })
 const unitInfo = computed(() => {
   if (!payload.value.unitQuantity) return null
   const unitMeasurement = units.value?.find?.((x) => x.id === payload.value.unitMeasurement)?.name || "-"
diff --git a/frontend/src/components/ElementStatusBadge.vue b/frontend/src/components/ElementStatusBadge.vue
index 3de2957e3..928a4ea93 100644
--- a/frontend/src/components/ElementStatusBadge.vue
+++ b/frontend/src/components/ElementStatusBadge.vue
@@ -1,6 +1,6 @@
 <template>
   <DsfrBadge v-if="text === 'autorisé'" :label="text" small type="success" />
-  <DsfrBadge v-if="text === 'non autorisé'" :label="text" small type="error" />
+  <DsfrBadge v-else-if="text === 'non autorisé'" :label="text" small type="error" />
 </template>
 
 <script setup>
diff --git a/frontend/src/views/InstructionPage/index.vue b/frontend/src/views/InstructionPage/index.vue
index ca17cc9c4..63ea59329 100644
--- a/frontend/src/views/InstructionPage/index.vue
+++ b/frontend/src/views/InstructionPage/index.vue
@@ -30,6 +30,7 @@
         <DeclarationSummary
           :showArticle="true"
           :useAccordions="true"
+          :showElementAuthorization="true"
           :readonly="true"
           v-model="declaration"
           v-if="isAwaitingInstruction"
@@ -48,6 +49,7 @@
               :externalResults="$externalResults"
               :readonly="true"
               :useAccordions="true"
+              :showElementAuthorization="true"
               :declarationId="declaration?.id"
               :user="declarant"
               :company="company"
diff --git a/frontend/src/views/ProducerFormPage/ElementCard.vue b/frontend/src/views/ProducerFormPage/ElementCard.vue
index b17525070..8101535a5 100644
--- a/frontend/src/views/ProducerFormPage/ElementCard.vue
+++ b/frontend/src/views/ProducerFormPage/ElementCard.vue
@@ -9,9 +9,6 @@
           <div v-if="synonyms">
             {{ synonyms }}
           </div>
-          <div v-if="model.element?.status === 'non autorisé'">
-            <ElementStatusBadge :text="model.element.status" />
-          </div>
           <div v-if="model.new" class="self-center mt-1">
             <DsfrBadge label="Nouvel ingrédient" type="info" />
           </div>
@@ -129,7 +126,6 @@ import { computed, watch } from "vue"
 import { getElementName } from "@/utils/elements"
 import { getActivityReadonlyByType } from "@/utils/mappings"
 import ElementCommentModal from "@/components/ElementCommentModal"
-import ElementStatusBadge from "@/components/ElementStatusBadge"
 
 const model = defineModel()
 const store = useRootStore()
diff --git a/frontend/src/views/VisaPage/index.vue b/frontend/src/views/VisaPage/index.vue
index b3b362e9b..087a543ad 100644
--- a/frontend/src/views/VisaPage/index.vue
+++ b/frontend/src/views/VisaPage/index.vue
@@ -26,6 +26,7 @@
         <DeclarationSummary
           :showArticle="true"
           :useAccordions="true"
+          :showElementAuthorization="true"
           :readonly="true"
           v-model="declaration"
           v-if="isAwaitingVisa"
@@ -46,6 +47,7 @@
               :readonly="true"
               :declarationId="declaration?.id"
               :useAccordions="true"
+              :showElementAuthorization="true"
               :user="declarant"
               :company="company"
               @decision-done="onDecisionDone"