From 5ee1a8c2996dce48ffac9940022a3dc391774be3 Mon Sep 17 00:00:00 2001
From: Emir Karabeg <emirkarabeg@berkeley.edu>
Date: Wed, 29 Jan 2025 10:01:40 -0800
Subject: [PATCH] Fixed history id error

---
 .../control-bar/components/history-dropdown-item.tsx        | 2 ++
 app/w/components/control-bar/control-bar.tsx                | 6 +++---
 2 files changed, 5 insertions(+), 3 deletions(-)

diff --git a/app/w/components/control-bar/components/history-dropdown-item.tsx b/app/w/components/control-bar/components/history-dropdown-item.tsx
index 6e30f19283..2c76066f16 100644
--- a/app/w/components/control-bar/components/history-dropdown-item.tsx
+++ b/app/w/components/control-bar/components/history-dropdown-item.tsx
@@ -8,6 +8,7 @@ interface HistoryDropdownItemProps {
   timestamp: number
   onClick?: () => void
   isCurrent?: boolean
+  id?: string
 }
 
 export function HistoryDropdownItem({
@@ -15,6 +16,7 @@ export function HistoryDropdownItem({
   timestamp,
   onClick,
   isCurrent = false,
+  id,
 }: HistoryDropdownItemProps) {
   const timeAgo = formatDistanceToNow(timestamp, { addSuffix: true })
 
diff --git a/app/w/components/control-bar/control-bar.tsx b/app/w/components/control-bar/control-bar.tsx
index 0c8a3ad6d7..d346835fe0 100644
--- a/app/w/components/control-bar/control-bar.tsx
+++ b/app/w/components/control-bar/control-bar.tsx
@@ -62,15 +62,15 @@ export function ControlBar() {
             <DropdownMenuContent align="end" className="w-60">
               <>
                 <HistoryDropdownItem
-                  key={history.present.timestamp}
+                  key={`current-${history.present.timestamp}`}
                   action={history.present.action}
                   timestamp={history.present.timestamp}
                   isCurrent={true}
                   onClick={() => {}}
                 />
-                {[...history.past].reverse().map((entry) => (
+                {[...history.past].reverse().map((entry, index) => (
                   <HistoryDropdownItem
-                    key={entry.timestamp}
+                    key={`past-${entry.timestamp}-${index}`}
                     action={entry.action}
                     timestamp={entry.timestamp}
                     onClick={undo}