chore: fix command bar key prop usage (#7534)

Unleash · Jul 5, 2024 · 233bf07 · 233bf07
1 parent 96a1996
commit 233bf07
Show file tree

Hide file tree

Showing 2 changed files with 12 additions and 9 deletions.
diff --git a/frontend/src/component/commandBar/CommandQuickSuggestions.tsx b/frontend/src/component/commandBar/CommandQuickSuggestions.tsx
@@ -19,6 +19,7 @@ const toListItemButton = (
     if (item.featureId && item.projectId) {
         return (
             <RecentlyVisitedFeatureButton
+                keyName={key}
                 key={key}
                 featureId={item.featureId}
                 projectId={item.projectId}
@@ -29,6 +30,7 @@ const toListItemButton = (
     if (item.projectId) {
         return (
             <RecentlyVisitedProjectButton
+                keyName={key}
                 key={key}
                 projectId={item.projectId}
                 onClick={onClick}
@@ -39,6 +41,7 @@ const toListItemButton = (
     const name = routes[item.pathName]?.title ?? item.pathName;
     return (
         <RecentlyVisitedPathButton
+            keyName={key}
             key={key}
             path={item.pathName}
             name={name}

diff --git a/frontend/src/component/commandBar/RecentlyVisited/CommandResultGroup.tsx b/frontend/src/component/commandBar/RecentlyVisited/CommandResultGroup.tsx
@@ -69,13 +69,13 @@ const ButtonItemIcon = ({
 };
 
 export const RecentlyVisitedPathButton = ({
+    keyName,
     path,
-    key,
     name,
     onClick,
 }: {
     path: string;
-    key: string;
+    keyName: string;
     name: string;
     onClick: () => void;
 }) => {
@@ -95,7 +95,7 @@ export const RecentlyVisitedPathButton = ({
 
     return (
         <ListItemButton
-            key={key}
+            key={keyName}
             dense={true}
             component={Link}
             to={path}
@@ -116,11 +116,11 @@ export const RecentlyVisitedPathButton = ({
 
 export const RecentlyVisitedProjectButton = ({
     projectId,
-    key,
+    keyName,
     onClick,
 }: {
     projectId: string;
-    key: string;
+    keyName: string;
     onClick: () => void;
 }) => {
     const { trackEvent } = usePlausibleTracker();
@@ -141,7 +141,7 @@ export const RecentlyVisitedProjectButton = ({
     if (projectDeleted) return null;
     return (
         <ListItemButton
-            key={key}
+            key={keyName}
             dense={true}
             component={Link}
             to={`/projects/${projectId}`}
@@ -161,12 +161,12 @@ export const RecentlyVisitedProjectButton = ({
 };
 
 export const RecentlyVisitedFeatureButton = ({
-    key,
+    keyName,
     projectId,
     featureId,
     onClick,
 }: {
-    key: string;
+    keyName: string;
     projectId: string;
     featureId: string;
     onClick: () => void;
@@ -185,7 +185,7 @@ export const RecentlyVisitedFeatureButton = ({
     };
     return (
         <ListItemButton
-            key={key}
+            key={keyName}
             dense={true}
             component={Link}
             to={`/projects/${projectId}/features/${featureId}`}