Bug: Ghost extension card generated on installed tab

[aalves08]

Setup

• Rancher version: 2.15-head
• Rancher UI Extensions: SUSE OS Management (Elemental)
• Browser type & version: Chrome/Firefox (latest)

Describe the bug
When a UI extension is installed and the user navigates away from the Extensions page and then returns, a duplicate/phantom card for the extension appears in the UI extensions list. The phantom card appears to be loaded from cache or previous state, creating a confusing user experience with multiple entries for the same extension.

To Reproduce

1. Install the ui-plugin-charts repo, branch main
2. Open the Extensions page in Rancher Dashboard
3. Install a UI extension (e.g., SUSE OS Management/Elemental)
4. Navigate away from the Extensions page (e.g., click on another menu item like the SUSE OS Management extension)
5. Navigate back to the Extensions page
6. Observe the extension card appearing twice or a phantom/stale card appearing

Result

A duplicate or phantom extension card appears in the UI extensions list alongside the actual installed extension. The duplicate persists across navigation.

Expected Result
Only one card for each installed extension should appear in the UI extensions list. When returning to the Extensions page, the list should be refreshed correctly without duplicate or phantom entries.

Additional context
The issue appears to stem from the deduplication logic in the available computed property. Plugin items can be created from two sources:

• Chart versions (via mapChartToPluginItem)
• Loaded plugins from the backend (via buildLoadedPluginItem)

When the same extension exists in both sources, a phantom/duplicate card can appear. The deduplication logic should prefer CR-backed entries (which have management capabilities) over phantom loaded-plugin entries. A preference condition of !existing || plugin.uiplugin ensures only the better entry is kept.

[github-actions]

🎯 Agentic Issue Triage

Summary: A phantom/duplicate extension card appears on the Extensions page when navigating away and back after installing a UI extension (e.g., SUSE OS Management/Elemental). The root cause is a deduplication gap in the available() computed property in shell/pages/c/_cluster/uiplugins/index.vue.

🔍 Root Cause Analysis

The available() computed property builds its list from two independent passes:

Pass 1 — this.uiplugins (lines 342–373):
Iterates loaded backend plugins. If no chart entry exists for the plugin name, it creates and pushes an item. The check is simply if (!chart).

Pass 2 — this.plugins / CRs (lines 376–443):
Iterates CR-backed plugins. If a matching chart is found (via originalRepoName matching), it wires the CR into the chart entry (chart.uiplugin = p). If no chart is found or the originalRepoName match fails, it creates and pushes another new item (all.push(item)).

The collision: When a plugin has been loaded into this.uiplugins AND has a CR in this.plugins, but the original repo name match fails (e.g., because repo metadata is stale or missing), both passes end up pushing separate items for the same plugin. This yields the phantom duplicate card.

Additionally, when navigating back to the page, the computed state may re-evaluate with a mix of stale loaded-plugin entries and fresh CR-backed entries, creating the duplicate.

The reporter has already identified the fix direction: the deduplication when pushing items should check !existing || plugin.uiplugin — i.e., prefer the CR-backed entry (which has full management capabilities) over the phantom loaded-plugin entry, and only push when no better entry already exists.

Relevant file: shell/pages/c/_cluster/uiplugins/index.vue, available() computed property (~line 258–478).

🧪 Reproduction Steps

1. Add the ui-plugin-charts repo (branch main) in Rancher.
2. Open Extensions page.
3. Install a UI extension (e.g., SUSE OS Management/Elemental).
4. Wait for installation to complete.
5. Navigate away (e.g., click the newly installed extension's menu item).
6. Navigate back to the Extensions page.
7. Observe: the extension appears twice (or a phantom card appears alongside the real one).

Quick variant to confirm the dedup path:

• Check whether the phantom card's item object has uiplugin: undefined (chart-backed without CR link) — this would confirm it came from Pass 1 rather than Pass 2.

🛠️ Debugging Strategies

• Add a console.log or Vue DevTools inspection of the available computed array after navigation to inspect duplicate items. Look for two entries with the same name but different id values or different uiplugin presence.
• Check whether this.uiplugins and this.plugins both contain the same extension after the navigate-back.
• Verify whether the originalRepoName matching at line 382–384 correctly finds the chart on second render. If originalRepoName is null or mismatched, the else branch at line 410 will push a second item even if an item from Pass 1 already exists.
• Check if this.charts reactivity or caching causes all to still contain the old chart-based entry when this.plugins re-runs.

✅ Suggested Fix Checklist

• In Pass 2's else branch (line 441: all.push(item)), add a dedup guard:

  const existing = all.find((c) => c.name === p.name);
  if (!existing || plugin.uiplugin) {
    all.push(item);
  }

• Alternatively, consider whether Pass 1 (this.uiplugins) should also check for a pre-existing entry before pushing.
• Add/update a unit test in shell/pages/c/_cluster/uiplugins/__tests__/index.test.ts covering the case where a plugin appears in both uiplugins and plugins with a missing/mismatched repo.
• Manual verification: reproduce with Elemental, confirm only one card after navigate-away + navigate-back.
• Confirm that developer-loaded plugins (no chart, no CR) still show correctly.

📚 Relevant Resources

• shell/pages/c/_cluster/uiplugins/index.vue — available() computed (~line 258)
• shell/pages/c/_cluster/uiplugins/__tests__/index.test.ts — existing unit tests to expand
• shell/utils/uiplugins.ts — utility helpers for plugin detection
• [Rancher UI Extensions internal docs]((extensions.rancher.io/redacted)

Generated by Agentic Triage for issue #17763 · ● 342.5K · ◷

[github-actions]

🤖 Issue grooming analysis

This issue is well-specified and ready for development:

• Clear problem statement: After installing a UI extension, navigating away from the Extensions page, and returning, a duplicate/phantom card appears alongside the actual installed extension card.
• What "fixed" looks like: Clearly stated — only one card per installed extension should appear; the list should be refreshed correctly on return navigation with no duplicates.
• Technical details: The root cause area is identified — deduplication logic in the available computed property, where the same extension can appear from two sources (mapChartToPluginItem for chart versions and buildLoadedPluginItem for loaded plugins). The fix direction (prefer CR-backed entries where plugin.uiplugin is set) is described.
• Reproducibility: Numbered steps are provided with screenshot evidence and explicit expected vs. actual behavior.

This analysis was generated automatically based on the repository's grooming checklist.

Generated by Daily Issue Grooming · ● 870.5K · ◷