feat(ui): streamline skeleton model selection and toast display

app/components/StructureNodeEditor.vue

@@ -39,7 +39,7 @@
       </div>
 
       <div class="px-4 py-4 space-y-5">
-        <section class="space-y-3">
+        <section v-if="isRoot" class="space-y-3">
           <div class="flex items-center justify-between gap-2">
             <h4 :class="headingClass">
               {{ isRoot ? 'Champs personnalisés du composant' : 'Champs personnalisés' }}
@@ -98,7 +98,7 @@
           </div>
         </section>
 
-        <section class="space-y-3">
+        <section v-if="isRoot" class="space-y-3">
           <div class="flex items-center justify-between gap-2">
             <h4 :class="headingClass">
               {{ isRoot ? 'Pièces incluses par défaut' : 'Pièces' }}
@@ -160,6 +160,9 @@
               Ajouter
             </button>
           </div>
+          <p v-if="!isRoot" class="text-[11px] text-gray-500">
+            Sélectionnez uniquement la famille de ce sous-composant ; il sera configuré via son propre modèle.
+          </p>
           <p v-if="!(node.subComponents?.length)" class="text-xs text-gray-500">
             Aucun sous-composant défini.
           </p>
@@ -397,9 +400,6 @@ const addSubComponent = () => {
     name: '',
     typeComposantId: '',
     typeComposantLabel: '',
-    customFields: [],
-    pieces: [],
-    subComponents: [],
   })
 }
 

app/pages/machine/[id].vue

@@ -1090,6 +1090,7 @@ const normalizePieceNode = (source, context = {}) => {
 }
 
 const normalizeComponentNode = (source, context = {}) => {
+  const isRoot = context.isRoot ?? false
   const typeComposantId = source?.typeComposantId
     || source?.typeComposant?.id
     || context.typeComposantId
@@ -1110,10 +1111,10 @@ const normalizeComponentNode = (source, context = {}) => {
       ?? context.componentModelId
       ?? null,
     __requirementId: source?.__requirementId ?? context.requirementId ?? null,
-    customFields: Array.isArray(source?.customFields)
+    customFields: isRoot && Array.isArray(source?.customFields)
       ? cloneStructure(source.customFields)
       : [],
-    pieces: Array.isArray(source?.pieces)
+    pieces: isRoot && Array.isArray(source?.pieces)
       ? source.pieces.map((piece) => normalizePieceNode(piece))
       : [],
     subComponents: Array.isArray(source?.subComponents || source?.sousComposants)
@@ -1127,6 +1128,8 @@ const normalizeComponentNode = (source, context = {}) => {
             ?? sub?.composantModelId
             ?? sub?.composantModel?.id
             ?? null,
+          requirementId: sub?.__requirementId ?? null,
+          isRoot: false,
         }))
       : [],
   }
@@ -1173,6 +1176,7 @@ const createEmptyComponentDefinition = (requirement) => {
     },
     {
       requirementId: requirement?.id || null,
+      isRoot: true,
     },
   )
 }
@@ -1188,6 +1192,7 @@ const createDefinitionFromModel = (model, requirement) => {
   const definition = normalizeComponentNode(structure, {
     requirementId: requirement?.id || null,
     componentModelId: model?.id || null,
+    isRoot: true,
   })
   definition.__componentModelId = model?.id || null
   return definition
@@ -1206,6 +1211,7 @@ const buildDefinitionFromComponent = (component, requirement) => {
     typeComposantLabel: requirement?.typeComposant?.name
       || component?.typeComposant?.name
       || '',
+    isRoot: true,
   })
   return definition
 }
@@ -1224,7 +1230,7 @@ const applyDefinitionToNode = (target, definition) => {
     ? definition.pieces.map((piece) => normalizePieceNode(piece))
     : []
   target.subComponents = Array.isArray(definition.subComponents)
-    ? definition.subComponents.map((sub) => normalizeComponentNode(sub))
+    ? definition.subComponents.map((sub) => normalizeComponentNode(sub, { isRoot: false }))
     : []
 }
 
@@ -1255,6 +1261,7 @@ const handleNodeComponentModelChange = async (node, typeComposantId, modelId) =>
     await ensureModelsForNodeDefinition(node)
   } else {
     node.__componentModelId = null
+    node.customFields = []
     node.pieces = []
     node.subComponents = []
   }

app/shared/modelUtils.ts

@@ -146,15 +146,8 @@ const sanitizeSubComponents = (components: any[]): any[] => {
       const quantity = Number(component?.quantity)
       const normalizedQuantity = Number.isFinite(quantity) && quantity > 0 ? quantity : undefined
 
-      const customFields = sanitizeCustomFields(component?.customFields)
-      const pieces = sanitizePieces(component?.pieces)
-      const subComponents = sanitizeSubComponents(component?.subComponents)
-
       const result: Record<string, unknown> = {
         name,
-        customFields,
-        pieces,
-        subComponents,
       }
 
       if (description !== undefined) {
@@ -170,6 +163,14 @@ const sanitizeSubComponents = (components: any[]): any[] => {
         result.typeComposantLabel = typeComposantLabel
       }
 
+      const nestedSubComponents = sanitizeSubComponents(component?.subComponents)
+      if (nestedSubComponents.length > 0) {
+        result.subComponents = nestedSubComponents
+      } else {
+        result.subComponents = []
+      }
+
+      // Sub components only carry structural info (they will be resolved via their own models)
       return result
     })
     .filter(Boolean)
@@ -224,8 +225,8 @@ const hydrateSubComponents = (components: any[]): any[] => {
     quantity: component?.quantity ?? component?.quantite ?? undefined,
     typeComposantId: component?.typeComposantId ?? component?.typeComposant?.id ?? '',
     typeComposantLabel: component?.typeComposantLabel ?? component?.typeComposant?.name ?? '',
-    customFields: hydrateCustomFields(component?.customFields),
+    customFields: [],
-    pieces: hydratePieces(component?.pieces),
+    pieces: [],
     subComponents: hydrateSubComponents(component?.subComponents),
   }))
 }
@@ -285,8 +286,8 @@ const mapSubComponents = (components: any[]): any[] => {
     quantity: component?.quantity ?? component?.quantite ?? undefined,
     typeComposantId: component?.typeComposantId ?? component?.typeComposant?.id ?? '',
     typeComposantLabel: component?.typeComposantLabel ?? component?.typeComposant?.name ?? '',
-    customFields: mapComponentCustomFields(component?.customFields),
+    customFields: [],
-    pieces: mapComponentPieces(component?.pieces),
+    pieces: [],
     subComponents: mapSubComponents(component?.subComponents),
   }))
 }