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

public/site/plugins/helpers/index.php

@@ -81,7 +81,8 @@ function processDTLProposals($page) {
                 $index = $proposalPage->pdf()->toFiles()->indexOf($proposalFile);
                 $DTLProposal = [
                 "location" => [
-                        "step" => "proposal"
+                        "step" => "proposal",
+                        "source" => (string) $proposalFile->url()
                     ],
                 "path" => "/projects/" . $page->slug() . "?dialog=proposal&fileIndex=" . $index,
                 "date" => $proposalFile->modified("d/MM/Y"),
@@ -97,7 +98,8 @@ function processDTLProposals($page) {
             if ($proposalPage && $proposalFile) {
                 $DTLProposal = [
                     "location" => [
-                        "step" => "industrialIdeation"
+                        "step" => "industrialIdeation",
+                        "source" => (string) $proposalFile->url()
                     ],
                     "path" => "/projects/" . $page->slug() . "?dialog=industrial-ideation",
                     "date" => $proposalFile->modified("d/MM/Y"),

src/components/design-to-light/DTLPanel.vue

@@ -12,6 +12,7 @@
     >
       <h2 id="dtl-label" class="font-serif text-xl">Design to Light</h2>
       <button
+        v-if="!isDialogOpen"
         @click="emits('close')"
         class="btn btn--icon btn--transparent | ml-auto"
         data-icon="close"
@@ -154,19 +155,23 @@
   </aside>
 </template>
 <script setup>
-import { storeToRefs } from "pinia";
-import { usePageStore } from "../../stores/page";
 import dayjs from "dayjs";
 import "dayjs/locale/fr";
-import { ref, onBeforeUnmount } from "vue";
+import { storeToRefs } from "pinia";
+import { ref, onBeforeUnmount, computed } from "vue";
+import { useDialogStore } from "../../stores/dialog";
 
 const { proposals } = defineProps({
   proposals: Array,
 });
 
-dayjs.locale("fr");
+const { openedFile } = storeToRefs(useDialogStore());
 
-const { page } = storeToRefs(usePageStore());
+const isDialogOpen = computed(() => {
+  return openedFile.value != null;
+});
+
+dayjs.locale("fr");
 
 const emits = defineEmits(["close"]);
 

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(

src/stores/designToLight.js

@@ -8,8 +8,8 @@ export const useDesignToLightStore = defineStore("design-to-light", () => {
     const isDTLEnabled = page.value.designToLight;
     return (
       isDTLEnabled &&
-      page.value.designToLight.some((proposal) =>
-        proposal.path.includes(step.uri)
+      page.value.designToLight.some(
+        (proposal) => proposal.location.step === step.id
       )
     );
   }

src/views/Kanban.vue

@@ -8,7 +8,11 @@
       <ProjectStep v-for="step in page.steps" :key="step" :step="step" />
     </div>
 
-    <DTLPanel v-if="isDTLPanelOpen" @close="isDTLPanelOpen = false" />
+    <DTLPanel
+      v-if="isDTLPanelOpen"
+      :proposals="page.designToLight"
+      @close="isDTLPanelOpen = false"
+    />
     <DTLButton
       v-if="page?.designToLight?.length > 0"
       @click="toggleDTLPanel($event)"