From fa0fb5dc6465966807724a0f8d4dad6bac557c60 Mon Sep 17 00:00:00 2001
From: grantpitel <gpitel@magna-power.com>
Date: Tue, 16 Jun 2026 14:25:05 -0400
Subject: [PATCH] feat(summary): show isolation side per step in Winding
 Construction Steps

Read-only isolation-side badge on each winding step (Primary/Secondary/...);
insulation steps show none. Derived from coil.functionalDescription[w].isolationSide.

Rebased onto current main: badge uses PrimeVue tokens (--p-info-rgb) and Bootstrap
Icons (bi-shield-fill) to match the post-refactor theming.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
---
 src/components/Toolbox/MagneticSummary.vue | 30 +++++++++++++++++++---
 1 file changed, 26 insertions(+), 4 deletions(-)

diff --git a/src/components/Toolbox/MagneticSummary.vue b/src/components/Toolbox/MagneticSummary.vue
index 956abcbb..f156ae04 100644
--- a/src/components/Toolbox/MagneticSummary.vue
+++ b/src/components/Toolbox/MagneticSummary.vue
@@ -354,7 +354,8 @@ export default {
                             description: thickness && thickness.label > 0
                                 ? `Apply ${material} (${removeTrailingZeroes(thickness.label, 2)} ${thickness.unit})` 
                                 : `Apply ${material}`,
-                            icon: 'bi-record-circle'
+                            icon: 'bi-record-circle',
+                            isolation: null
                         });
                     } else if (layerType === 'conduction') {
                         const partialWinding = layer.partialWindings?.[0];
@@ -392,7 +393,8 @@ export default {
                             step: stepNum++,
                             type: 'winding',
                             description: `Wind ${toTitleCase(windingName)}: ${turnsDisplay} turns${parallelInfo}${wireDesc}`,
-                            icon: 'bi-arrow-repeat'
+                            icon: 'bi-arrow-repeat',
+                            isolation: winding?.isolationSide ? toTitleCase(winding.isolationSide) : null
                         });
                     }
                 });
@@ -407,7 +409,8 @@ export default {
                             step: stepNum++,
                             type: 'insulation',
                             description: 'Apply insulation layer',
-                            icon: 'bi-record-circle'
+                            icon: 'bi-record-circle',
+                            isolation: null
                         });
                     } else if (sectionType === 'conduction') {
                         const partialWinding = section.partialWindings?.[0];
@@ -419,7 +422,8 @@ export default {
                             step: stepNum++,
                             type: 'winding',
                             description: `Wind ${toTitleCase(windingName)}: ${totalTurns} turns`,
-                            icon: 'bi-arrow-repeat'
+                            icon: 'bi-arrow-repeat',
+                            isolation: winding?.isolationSide ? toTitleCase(winding.isolationSide) : null
                         });
                     }
                 });
@@ -970,6 +974,9 @@ export default {
                             <i :class="'bi ' + step.icon"></i>
                         </div>
                         <div class="step-description">{{ step.description }}</div>
+                        <div v-if="step.isolation" class="step-isolation" :title="'Isolation side: ' + step.isolation">
+                            <i class="bi bi-shield-fill"></i>{{ step.isolation }}
+                        </div>
                     </div>
                 </div>
             </div>
@@ -1377,6 +1384,21 @@ export default {
     color: var(--p-white);
 }
 
+.step-isolation {
+    margin-left: auto;
+    display: flex;
+    align-items: center;
+    gap: 4px;
+    padding: 2px 8px;
+    font-size: 10px;
+    font-weight: 600;
+    color: rgb(var(--p-info-rgb));
+    background: rgba(var(--p-info-rgb), 0.12);
+    border-radius: 10px;
+    white-space: nowrap;
+    flex-shrink: 0;
+}
+
 /* Operating Point Excitation */
 .excitation-card {
     background: rgba(var(--p-primary-rgb), 0.05);