UI bug fix: Graceful handling of migrated programs -- different artificial program IDs are assigned, new Clones tab shows relations

Author: jvm123

scripts/static/js/sidebar.js

@@ -35,6 +35,15 @@ export function showSidebarContent(d, fromHover = false) {
     if ((d.prompts && typeof d.prompts === 'object' && Object.keys(d.prompts).length > 0) || (d.artifacts_json && typeof d.artifacts_json === 'object' && Object.keys(d.artifacts_json).length > 0)) tabNames.push('Prompts');
     const children = allNodeData.filter(n => n.parent_id === d.id);
     if (children.length > 0) tabNames.push('Children');
+
+    // --- CLONES TAB LOGIC ---
+    function getBaseId(id) {
+        return id.includes('-copy') ? id.split('-copy')[0] : id;
+    }
+    const baseId = getBaseId(d.id);
+    const clones = allNodeData.filter(n => getBaseId(n.id) === baseId && n.id !== d.id);
+    if (clones.length > 0) tabNames.push('Clones');
+
     let activeTab = lastSidebarTab && tabNames.includes(lastSidebarTab) ? lastSidebarTab : tabNames[0];
 
     // Helper to render tab content
@@ -99,6 +108,13 @@ export function showSidebarContent(d, fromHover = false) {
                 }).join('') +
                 `</ul></div>`;
         }
+        if (tabName === 'Clones') {
+            return `<div><ul style='margin:0.5em 0 0 1em;padding:0;'>` +
+                clones.map(clone =>
+                    `<li style='margin-bottom:0.3em;'><a href="#" class="clone-link" data-clone="${clone.id}">${clone.id}</a></li>`
+                ).join('') +
+                `</ul></div>`;
+        }
         return '';
     }
 
@@ -178,6 +194,25 @@ export function showSidebarContent(d, fromHover = false) {
                             }
                         };
                     });
+                    document.querySelectorAll('.clone-link').forEach(link => {
+                        link.onclick = function(e) {
+                            e.preventDefault();
+                            const cloneNode = allNodeData.find(n => n.id == link.dataset.clone);
+                            if (cloneNode) {
+                                window._lastSelectedNodeData = cloneNode;
+                                const perfTabBtn = document.getElementById('tab-performance');
+                                const perfTabView = document.getElementById('view-performance');
+                                if ((perfTabBtn && perfTabBtn.classList.contains('active')) || (perfTabView && perfTabView.classList.contains('active'))) {
+                                    import('./performance.js').then(mod => {
+                                        mod.selectPerformanceNodeById(cloneNode.id);
+                                        showSidebar();
+                                    });
+                                } else {
+                                    scrollAndSelectNodeById(cloneNode.id);
+                                }
+                            }
+                        };
+                    });
                 }, 0);
             };
         });
@@ -204,6 +239,25 @@ export function showSidebarContent(d, fromHover = false) {
                 }
             };
         });
+        document.querySelectorAll('.clone-link').forEach(link => {
+            link.onclick = function(e) {
+                e.preventDefault();
+                const cloneNode = allNodeData.find(n => n.id == link.dataset.clone);
+                if (cloneNode) {
+                    window._lastSelectedNodeData = cloneNode;
+                    const perfTabBtn = document.getElementById('tab-performance');
+                    const perfTabView = document.getElementById('view-performance');
+                    if ((perfTabBtn && perfTabBtn.classList.contains('active')) || (perfTabView && perfTabView.classList.contains('active'))) {
+                        import('./performance.js').then(mod => {
+                            mod.selectPerformanceNodeById(cloneNode.id);
+                            showSidebar();
+                        });
+                    } else {
+                        scrollAndSelectNodeById(cloneNode.id);
+                    }
+                }
+            };
+        });
     }, 0);
     const closeBtnEl = document.getElementById('sidebar-close-btn');
     if (closeBtnEl) closeBtnEl.onclick = function() {

scripts/visualizer.py

@@ -37,12 +37,30 @@ def load_evolution_data(checkpoint_folder):
 
     nodes = []
     id_to_program = {}
+    pids = set()
     for island_idx, id_list in enumerate(meta.get("islands", [])):
         for pid in id_list:
             prog_path = os.path.join(programs_dir, f"{pid}.json")
+
+            # Keep track of PIDs and if one is double, append "-copyN" to the PID
+            if pid in pids:
+                base_pid = pid
+
+                # If base_pid already has a "-copyN" suffix, strip it
+                if "-copy" in base_pid:
+                    base_pid = base_pid.rsplit("-copy", 1)[0]
+
+                # Find the next available copy number
+                copy_num = 1
+                while f"{base_pid}-copy{copy_num}" in pids:
+                    copy_num += 1
+                pid = f"{base_pid}-copy{copy_num}"
+            pids.add(pid)
+
             if os.path.exists(prog_path):
                 with open(prog_path) as pf:
                     prog = json.load(pf)
+                prog["id"] = pid
                 prog["island"] = island_idx
                 nodes.append(prog)
                 id_to_program[pid] = prog