fix: ensure smart cards re-mount correctly between pages (stable keys in ServiceGroup) (#1005)

* fix: prevent smart card reuse between pages by adding stable keys in ServiceGroup

Previously ServiceGroup keyed components only by index, causing Vue to reuse the wrong smart-card instance when navigating between pages. Keys now include groupIndex and item identity to ensure components re-mount correctly.

* Fix duplicate Service cards by ensuring unique Vue keys

The search feature was causing some Service cards to duplicate when multiple items in a group shared the same `name` value. Vue reused DOM nodes because the generated `key` for <Service> was not always unique:

This caused instability during filtering and resulted in one of the cards being duplicated repeatedly until a full page reload.
This commit is contained in:
Zach Damit
2025-11-23 08:34:31 -06:00
committed by GitHub
parent 151c136923
commit 2e1c7b3d27

View File

@@ -4,7 +4,7 @@
<GroupHeader v-if="group.name" :group="group" class="group-title" />
<Service
v-for="(item, index) in group.items"
:key="`srv-${index}`"
:key="`srv-${groupIndex}-${index}-${item.name || item.type}`"
:item="item"
:proxy="proxy"
:class="item.class || group.class"
@@ -21,7 +21,7 @@
/>
<Service
v-for="(item, index) in group.items"
:key="`srv-${index}`"
:key="`srv-${groupIndex}-${index}-${item.name || item.type}`"
:item="item"
:proxy="proxy"
:class="[