From 6a43f08df85264334d5757019920b8c3c6f6c463 Mon Sep 17 00:00:00 2001
From: r-dev <matthieu@yuno.malio.fr>
Date: Sat, 4 Apr 2026 17:12:20 +0200
Subject: [PATCH] =?UTF-8?q?fix(ui)=20:=20phase=201=20review=20fixes=20?=
 =?UTF-8?q?=E2=80=94=20machine=20context=20links,=20type=20annotations,=20?=
 =?UTF-8?q?double=20arrow?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- Add ?from=machine&machineId=xxx query params to entity NuxtLinks in hierarchy
- Add useRoute + machineId computed to ComponentItem, PieceItem, MachineProductsCard
- Add :string type to confirmRemove* handlers in machine page
- Remove unicode arrow from DetailHeader backLabel (icon already provides it)
- Add !isEditMode guard on product links in MachineProductsCard

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
---
 frontend/app/components/ComponentItem.vue             |  7 ++++++-
 frontend/app/components/DetailHeader.vue              |  2 +-
 frontend/app/components/PieceItem.vue                 |  7 ++++++-
 .../app/components/machine/MachineProductsCard.vue    | 11 ++++++++---
 frontend/app/pages/machine/[id].vue                   |  8 ++++----
 5 files changed, 25 insertions(+), 10 deletions(-)

diff --git a/frontend/app/components/ComponentItem.vue b/frontend/app/components/ComponentItem.vue
index bf13921..60bf917 100644
--- a/frontend/app/components/ComponentItem.vue
+++ b/frontend/app/components/ComponentItem.vue
@@ -32,7 +32,9 @@
           <h3 class="text-sm font-semibold truncate" :class="component.pendingEntity ? 'text-error' : 'text-base-content'">
             <NuxtLink
               v-if="!isEditMode && !component.pendingEntity && component.composantId"
-              :to="`/component/${component.composantId}`"
+              :to="machineId
+                ? { path: `/component/${component.composantId}`, query: { from: 'machine', machineId } }
+                : `/component/${component.composantId}`"
               class="hover:underline hover:text-primary transition-colors"
               @click.stop
             >
@@ -353,6 +355,9 @@ import { useEntityProductDisplay } from '~/composables/useEntityProductDisplay'
 import { useCustomFields } from '~/composables/useCustomFields'
 import { mergeDefinitionsWithValues } from '~/shared/utils/customFields'
 
+const route = useRoute()
+const machineId = computed(() => route.params.id as string | undefined)
+
 const props = defineProps({
   component: { type: Object, required: true },
   isEditMode: { type: Boolean, default: false },
diff --git a/frontend/app/components/DetailHeader.vue b/frontend/app/components/DetailHeader.vue
index 598a544..1fc7552 100644
--- a/frontend/app/components/DetailHeader.vue
+++ b/frontend/app/components/DetailHeader.vue
@@ -52,7 +52,7 @@ const backDestination = computed(() => {
 
 const backLabel = computed(() => {
   if (route.query.from === 'machine') {
-    return '← Retour à la machine'
+    return 'Retour à la machine'
   }
   return props.backLinkLabel ?? 'Retour au catalogue'
 })
diff --git a/frontend/app/components/PieceItem.vue b/frontend/app/components/PieceItem.vue
index 63e8ad8..27d3db9 100644
--- a/frontend/app/components/PieceItem.vue
+++ b/frontend/app/components/PieceItem.vue
@@ -31,7 +31,9 @@
           <h3 class="text-lg font-semibold" :class="{ 'text-error': piece._emptySlot || piece.pendingEntity }">
             <NuxtLink
               v-if="!isEditMode && !piece.pendingEntity && !piece._emptySlot && piece.pieceId"
-              :to="`/piece/${piece.pieceId}`"
+              :to="machineId
+                ? { path: `/piece/${piece.pieceId}`, query: { from: 'machine', machineId } }
+                : `/piece/${piece.pieceId}`"
               class="hover:underline hover:text-primary transition-colors"
               @click.stop
             >
@@ -332,6 +334,9 @@ import { useCustomFields } from '~/composables/useCustomFields'
 import { useEntityDocuments } from '~/composables/useEntityDocuments'
 import { useEntityProductDisplay } from '~/composables/useEntityProductDisplay'
 
+const route = useRoute()
+const machineId = computed(() => route.params.id as string | undefined)
+
 const props = defineProps({
   piece: { type: Object, required: true },
   isEditMode: { type: Boolean, default: false },
diff --git a/frontend/app/components/machine/MachineProductsCard.vue b/frontend/app/components/machine/MachineProductsCard.vue
index 9efa98c..033feb6 100644
--- a/frontend/app/components/machine/MachineProductsCard.vue
+++ b/frontend/app/components/machine/MachineProductsCard.vue
@@ -30,8 +30,10 @@
           <div class="flex items-center justify-between flex-wrap gap-2">
             <p class="font-semibold" :class="product.pendingEntity ? 'text-error' : 'text-base-content'">
               <NuxtLink
-                v-if="!product.pendingEntity && product.id"
-                :to="`/product/${product.id}`"
+                v-if="!isEditMode && !product.pendingEntity && product.id"
+                :to="machineId
+                  ? { path: `/product/${product.id}`, query: { from: 'machine', machineId } }
+                  : `/product/${product.id}`"
                 class="hover:underline hover:text-primary transition-colors"
               >
                 {{ product.name }}
@@ -140,8 +142,11 @@
 </template>
 
 <script setup lang="ts">
-import { ref } from 'vue'
+import { ref, computed } from 'vue'
 import DocumentPreviewModal from '~/components/DocumentPreviewModal.vue'
+
+const route = useRoute()
+const machineId = computed(() => route.params.id as string | undefined)
 import { canPreviewDocument } from '~/utils/documentPreview'
 import {
   formatSize,
diff --git a/frontend/app/pages/machine/[id].vue b/frontend/app/pages/machine/[id].vue
index 9c7b07d..897fcc7 100644
--- a/frontend/app/pages/machine/[id].vue
+++ b/frontend/app/pages/machine/[id].vue
@@ -325,25 +325,25 @@ const submitMachineEdition = async () => {
   refreshVersions()
 }
 
-const confirmRemoveProduct = async (id) => {
+const confirmRemoveProduct = async (id: string) => {
   if (!await confirmDialog({ title: 'Retirer ce produit ?', message: 'Le produit sera dissocié de la machine.', confirmText: 'Retirer', dangerous: true })) return
   await d.removeProductLink(id)
   refreshVersions()
 }
 
-const confirmRemoveComponent = async (id) => {
+const confirmRemoveComponent = async (id: string) => {
   if (!await confirmDialog({ title: 'Retirer ce composant ?', message: 'Le composant sera dissocié de la machine.', confirmText: 'Retirer', dangerous: true })) return
   await d.removeComponentLink(id)
   refreshVersions()
 }
 
-const confirmRemovePiece = async (id) => {
+const confirmRemovePiece = async (id: string) => {
   if (!await confirmDialog({ title: 'Retirer cette pièce ?', message: 'La pièce sera dissociée de la machine.', confirmText: 'Retirer', dangerous: true })) return
   await d.removePieceLink(id)
   refreshVersions()
 }
 
-const confirmRemoveDocument = async (id) => {
+const confirmRemoveDocument = async (id: string) => {
   if (!await confirmDialog({ title: 'Supprimer ce document ?', message: 'Le fichier sera supprimé définitivement.', confirmText: 'Supprimer', dangerous: true })) return
   d.removeMachineDocument(id)
 }