DTL panel : open proposal corresponding to dialog working for all steps

src/components/project/TitledPdfWrapper.vue

@@ -33,16 +33,22 @@
       <PdfViewer />
     </div>
   </Dialog>
+  <DTLPanel
+    v-if="correspondingDTLProposal"
+    :proposals="[correspondingDTLProposal]"
+  />
 </template>
 
 <script setup>
 import Dialog from "primevue/dialog";
 import PdfViewer from "./PdfViewer.vue";
-import { ref, watch } from "vue";
+import DTLPanel from "../design-to-light/DTLPanel.vue";
+import { computed, ref, watch } from "vue";
 import { useDialogStore } from "../../stores/dialog";
 import { useRoute, useRouter } from "vue-router";
 import { storeToRefs } from "pinia";
 import { useApiStore } from "../../stores/api";
+import { usePageStore } from "../../stores/page";
 
 const { openedFile, isCommentsOpen } = storeToRefs(useDialogStore());
 
@@ -51,6 +57,7 @@ const route = useRoute();
 
 const dialog = useDialogStore();
 const api = useApiStore();
+const { page } = storeToRefs(usePageStore());
 
 const isOpen = ref(true);
 watch(isOpen, (newValue) => {
@@ -61,6 +68,19 @@ openedFile.value = route.query.fileIndex
   ? dialog.content.files[route.query.fileIndex]
   : dialog.content.files.find((file) => file.type === "document");
 
+const correspondingDTLProposal = computed(() => {
+  const hasDTLProposal = page.value?.designToLight;
+  if (!hasDTLProposal) return false;
+
+  const correspondingDTLProposal = page.value.designToLight.find((proposal) => {
+    return openedFile.value.source === proposal.location.source;
+  });
+
+  if (!correspondingDTLProposal) return false;
+
+  return correspondingDTLProposal;
+});
+
 // Functions
 async function validate() {
   const response = await api.validateBrief(