Addon Interactions: Use unique keys when rendering array nodes in panel

storybookjs · Jul 2, 2024 · d0ab771 · d0ab771
1 parent 6476483
commit d0ab771
Showing 1 changed file with 3 additions and 1 deletion.
diff --git a/code/addons/interactions/src/components/MethodCall.tsx b/code/addons/interactions/src/components/MethodCall.tsx
@@ -214,7 +214,9 @@ export const ArrayNode = ({
   }
   const nodes = value
     .slice(0, 3)
-    .map((v) => <Node key={JSON.stringify(v)} value={v} nested callsById={callsById} />);
+    .map((v, index) => (
+      <Node key={`${index}--${JSON.stringify(v)}`} value={v} nested callsById={callsById} />
+    ));
   const nodelist = interleave(nodes, <span>, </span>);
   if (value.length <= 3) {
     return <span style={{ color: colors.base }}>[{nodelist}]</span>;