virtual sample - reorganize files data (add dynamic / static level)

src/components/project/ProjectStep.vue

@@ -29,20 +29,21 @@
           "
         >
           <img
-            v-for="image in step.files.slice(0, 3)"
+            v-for="image in step.files.dynamic.slice(0, 3)"
             :key="image.uuid"
             :src="image.url"
             :alt="image.alt"
           />
         </figure>
-        <!-- First image -->
         <figure
           v-if="step.id === 'virtualSample'"
           class="card__images"
-          :data-count="step.files.length > 3 ? step.files.length - 3 : 0"
+          :data-count="
+            step.files.dynamic.length > 3 ? step.files.dynamic.length - 3 : 0
+          "
         >
           <img
-            v-for="track in step.files"
+            v-for="track in step.files.dynamic"
             :key="track.files[0].slug"
             :src="track.files[0].url"
             :alt="track.files[0].alt"
@@ -112,6 +113,7 @@
 import dayjs from "dayjs";
 import "dayjs/locale/fr";
 import { usePageStore } from "../../stores/page";
+import { computed } from "vue";
 
 const { step } = defineProps({
   step: Object,
@@ -127,6 +129,15 @@ const steps = page.steps.map((item) => {
   return item.value;
 });
 
+const mergedFiles = computed(() => {
+  if (step.id !== "virtualSample") return false;
+
+  const staticFiles = step.files?.static ?? [];
+  const dynamicFiles = step.files?.dynamic ?? [];
+
+  return [...staticFiles, ...dynamicFiles];
+});
+
 const status = setStatus();
 
 function setStatus() {

src/components/project/VirtualSample.vue

@@ -143,7 +143,7 @@ const { page } = storeToRefs(usePageStore());
 const { comments } = storeToRefs(useDialogStore());
 
 const tracks = computed(
-  () => page.value.steps[page.value.steps.length - 1].files
+  () => page.value.steps[page.value.steps.length - 1].files.dynamic
 );
 
 const activeTrack = ref(tracks.value[0]);