Fix lists without key prop errors (#508)

This PR adds keys to lists in DeviceSettingsDropdown and IconButtonWithOptions to prevent error messages.
software-mansion · Aug 21, 2024 · a40eb80 · a40eb80
1 parent 064f0cb
commit a40eb80
Show file tree

Hide file tree

Showing 2 changed files with 4 additions and 3 deletions.
diff --git a/packages/vscode-extension/src/webview/components/DeviceSettingsDropdown.tsx b/packages/vscode-extension/src/webview/components/DeviceSettingsDropdown.tsx
@@ -140,9 +140,10 @@ function DeviceSettingsDropdown({ children, disabled }: DeviceSettingsDropdownPr
                 className="dropdown-menu-content"
                 sideOffset={2}
                 alignOffset={-5}>
-                {resetOptions.map((option) => (
+                {resetOptions.map((option, index) => (
                   <DropdownMenu.Item
                     className="dropdown-menu-item"
+                    key={index}
                     onSelect={() => project.resetAppPermissions(option.value)}>
                     <span className={`codicon codicon-${option.icon}`} />
                     {option.label}

diff --git a/packages/vscode-extension/src/webview/components/IconButtonWithOptions.tsx b/packages/vscode-extension/src/webview/components/IconButtonWithOptions.tsx
@@ -40,8 +40,8 @@ export const IconButtonWithOptions = forwardRef<HTMLButtonElement, IconButtonWit
           </DropdownMenu.Trigger>
           <DropdownMenu.Portal>
             <DropdownMenu.Content className="dropdown-menu-content">
-              {Object.entries(options).map(([title, onSelect]) => (
-                <DropdownMenu.Item className="dropdown-menu-item" onSelect={onSelect}>
+              {Object.entries(options).map(([title, onSelect], index) => (
+                <DropdownMenu.Item className="dropdown-menu-item" key={index} onSelect={onSelect}>
                   {title}
                 </DropdownMenu.Item>
               ))}