From b2108158d531b58d62ace2a2cc3dcffdd30222e8 Mon Sep 17 00:00:00 2001
From: Helen Root <helenroot1@gmail.com>
Date: Tue, 30 Apr 2024 11:37:14 +0200
Subject: [PATCH] Have quality panel open by default on public view, not on
 editable to be less overwhelming

---
 frontend/src/components/CanteenPublication/index.vue |  2 +-
 frontend/src/components/DsfrAccordion.vue            | 11 ++++++++++-
 2 files changed, 11 insertions(+), 2 deletions(-)

diff --git a/frontend/src/components/CanteenPublication/index.vue b/frontend/src/components/CanteenPublication/index.vue
index 5f15cc60b..a704b637d 100644
--- a/frontend/src/components/CanteenPublication/index.vue
+++ b/frontend/src/components/CanteenPublication/index.vue
@@ -47,7 +47,7 @@
       </v-form>
     </v-col>
     <h2 class="mt-12 mb-8">Où en-sommes nous de notre transition alimentaire ?</h2>
-    <DsfrAccordion :items="badgeItems" class="mt-4">
+    <DsfrAccordion :items="badgeItems" :openPanelIndex="editable ? undefined : 0" class="mt-4">
       <template v-slot:title="{ item }">
         <span class="d-flex align-center">
           <v-img
diff --git a/frontend/src/components/DsfrAccordion.vue b/frontend/src/components/DsfrAccordion.vue
index b3e0b5874..93dd8f173 100644
--- a/frontend/src/components/DsfrAccordion.vue
+++ b/frontend/src/components/DsfrAccordion.vue
@@ -1,5 +1,5 @@
 <template>
-  <v-expansion-panels hover accordion tile flat class="dsfr-accordion">
+  <v-expansion-panels v-model="openPanel" hover accordion tile flat class="dsfr-accordion">
     <v-expansion-panel v-for="item in items" :key="item.title">
       <v-expansion-panel-header class="px-3 fr-accordion__btn" v-slot="{ open }">
         <component :is="item.titleLevel || 'h3'" class="fr-text" :class="open && 'active-panel'">
@@ -22,6 +22,15 @@ export default {
     // items is an array of objects containing 'title'
     // and one of 'content' or provide a template using the slot
     items: Array,
+    openPanelIndex: {
+      type: Number,
+      optional: true,
+    },
+  },
+  data() {
+    return {
+      openPanel: this.openPanelIndex,
+    }
   },
 }
 </script>