fix: fix errors regarding key props

stegripe · Mar 7, 2024 · e6b114a · e6b114a
1 parent bae0ee0
commit e6b114a
Show file tree

Hide file tree

Showing 2 changed files with 8 additions and 8 deletions.
diff --git a/src/components/Dropdown.tsx b/src/components/Dropdown.tsx
@@ -12,8 +12,8 @@ export default function Dropdown({ head, items }: { head: ReactNode; items: Reac
             </div>
             {open && (
                 <div className="flex flex-col">
-                    {items.map(x => (
-                        <div className="border-l border-black ml-2 pl-2 hover:bg-white hover:bg-opacity-20">{x}</div>
+                    {items.map((x, i) => (
+                        <div key={i} className="border-l border-black ml-2 pl-2 hover:bg-white hover:bg-opacity-20">{x}</div>
                     ))}
                 </div>
             )}

diff --git a/src/pages/test.tsx b/src/pages/test.tsx
@@ -3,13 +3,13 @@ import Dropdown from "../components/Dropdown";
 function SampleDropdown() {
     return (
         <Dropdown head="Schemas" items={[
-            <Dropdown head="Schema 1" items={[
-                <p>Table A</p>,
-                <p>Table B</p>
+            <Dropdown key={0} head="Schema 1" items={[
+                <p key={0}>Table A</p>,
+                <p key={1}>Table B</p>
             ]} />,
-            <Dropdown head="Schema 2" items={[
-                <p>Table User</p>,
-                <p>Table Player</p>
+            <Dropdown key={1} head="Schema 2" items={[
+                <p key={0}>Table User</p>,
+                <p key={1}>Table Player</p>
             ]} />
         ]} />
     )