From 7a46fb2b4dda0e2a75ba6942e62aae8f5a7e95c0 Mon Sep 17 00:00:00 2001
From: Joshen Lim <joshenlimek@gmail.com>
Date: Thu, 16 Mar 2023 12:18:23 +0800
Subject: [PATCH] Fix error in ItemContextMenu for StorageExplorer

---
 .../StorageExplorer/ItemContextMenu.tsx       | 25 +++++++++----------
 1 file changed, 12 insertions(+), 13 deletions(-)

diff --git a/studio/components/to-be-cleaned/Storage/StorageExplorer/ItemContextMenu.tsx b/studio/components/to-be-cleaned/Storage/StorageExplorer/ItemContextMenu.tsx
index e42be48fe5f..eddd9e28916 100644
--- a/studio/components/to-be-cleaned/Storage/StorageExplorer/ItemContextMenu.tsx
+++ b/studio/components/to-be-cleaned/Storage/StorageExplorer/ItemContextMenu.tsx
@@ -81,27 +81,26 @@ const ItemContextMenu: FC<Props> = ({ id = '' }) => {
           </Item>
         </Submenu>
       )}
-      {canUpdateFiles && (
-        <>
-          <Item onClick={({ props }) => onHandleClick('rename', props.item)}>
+      {canUpdateFiles &&
+        [
+          <Item key="rename-file" onClick={({ props }) => onHandleClick('rename', props.item)}>
             <IconEdit size="tiny" />
             <span className="ml-2 text-xs">Rename</span>
-          </Item>
-          <Item onClick={({ props }) => onHandleClick('move', props.item)}>
+          </Item>,
+          <Item key="move-file" onClick={({ props }) => onHandleClick('move', props.item)}>
             <IconMove size="tiny" />
             <span className="ml-2 text-xs">Move</span>
-          </Item>
-          <Item onClick={({ props }) => onHandleClick('download', props.item)}>
+          </Item>,
+          <Item key="download-file" onClick={({ props }) => onHandleClick('download', props.item)}>
             <IconDownload size="tiny" />
             <span className="ml-2 text-xs">Download</span>
-          </Item>
-          <Separator />
-          <Item onClick={({ props }) => setSelectedItemsToDelete([props.item])}>
+          </Item>,
+          <Separator />,
+          <Item key="delete-file" onClick={({ props }) => setSelectedItemsToDelete([props.item])}>
             <IconTrash2 size="tiny" />
             <span className="ml-2 text-xs">Delete</span>
-          </Item>
-        </>
-      )}
+          </Item>,
+        ].map((x) => x)}
     </Menu>
   )
 }