From 6abff8474c593118fc52afaa9e0b432346aeffa5 Mon Sep 17 00:00:00 2001
From: blackhao <13851610112@163.com>
Date: Tue, 9 Dec 2025 17:32:10 -0600
Subject: file management sys

---
 frontend/src/components/Sidebar.tsx | 20 +++++++++++++++++++-
 1 file changed, 19 insertions(+), 1 deletion(-)

(limited to 'frontend/src/components/Sidebar.tsx')

diff --git a/frontend/src/components/Sidebar.tsx b/frontend/src/components/Sidebar.tsx
index 06c8704..3008ba3 100644
--- a/frontend/src/components/Sidebar.tsx
+++ b/frontend/src/components/Sidebar.tsx
@@ -1875,6 +1875,9 @@ const Sidebar: React.FC<SidebarProps> = ({ isOpen, onToggle, onInteract }) => {
                   .map((trace) => {
                     const isSelected = mergeSelectedIds.includes(trace.id);
                     const isDragging = mergeDraggedId === trace.id;
+                    const traceColors = trace.isMerged && trace.mergedColors && trace.mergedColors.length > 0
+                      ? trace.mergedColors
+                      : [trace.color];
                     
                     return (
                       <div 
@@ -1898,7 +1901,22 @@ const Sidebar: React.FC<SidebarProps> = ({ isOpen, onToggle, onInteract }) => {
                           onChange={() => toggleMergeSelection(trace.id)}
                         />
                         
-                        <div className="w-3 h-3 rounded-full" style={{ backgroundColor: trace.color }}></div>
+                        <div className="flex -space-x-1">
+                          {traceColors.slice(0, 3).map((c, idx) => (
+                            <div 
+                              key={idx}
+                              className="w-3 h-3 rounded-full border-2"
+                              style={{ backgroundColor: c, borderColor: isDark ? '#1f2937' : '#fff' }}
+                            />
+                          ))}
+                          {traceColors.length > 3 && (
+                            <div className={`w-3 h-3 rounded-full flex items-center justify-center text-[8px] ${
+                              isDark ? 'bg-gray-700 text-gray-400' : 'bg-gray-200 text-gray-500'
+                            }`}>
+                              +{traceColors.length - 3}
+                            </div>
+                          )}
+                        </div>
                         
                         <div className="flex-1">
                           <span className={`font-mono text-sm ${isDark ? 'text-gray-300' : 'text-gray-600'}`}>
-- 
cgit v1.2.3

