Merge pull request #3284 from plotly/fix-cop-key

Fix component as props used in the same container getting the same key

Author: T4rk1n

CHANGELOG.md

@@ -7,6 +7,7 @@ This project adheres to [Semantic Versioning](https://semver.org/).
 ## Fixed
 - [#3278](https://github.com/plotly/dash/pull/3278) Fix loading selector with children starting at the same digit. Fix [#3276](https://github.com/plotly/dash/issues/3276)
 - [#3280](https://github.com/plotly/dash/pull/3280) Remove flask typing import not available in earlier versions.
+- [#3284](https://github.com/plotly/dash/pull/3284) Fix component as props having the same key when used in the same container.
 
 ## [3.0.3] - 2025-04-14
 

dash/dash-renderer/src/wrapper/DashWrapper.tsx

@@ -28,7 +28,8 @@ import {
     createElement,
     getComponentLayout,
     isDryComponent,
-    checkRenderTypeProp
+    checkRenderTypeProp,
+    stringifyPath
 } from './wrapping';
 import Registry from '../registry';
 import isSimpleComponent from '../isSimpleComponent';
@@ -158,17 +159,16 @@ function DashWrapper({
     };
 
     const createContainer = useCallback(
-        (container, containerPath, _childNewRender, key = undefined) => {
+        (container, containerPath, _childNewRender) => {
             if (isSimpleComponent(renderComponent)) {
                 return renderComponent;
             }
             return (
                 <DashWrapper
                     key={
-                        (container &&
-                            container.props &&
-                            stringifyId(container.props.id)) ||
-                        key
+                        container?.props?.id
+                            ? stringifyId(container.props.id)
+                            : stringifyPath(containerPath)
                     }
                     _dashprivate_error={_dashprivate_error}
                     componentPath={containerPath}
@@ -192,8 +192,7 @@ function DashWrapper({
                                 ...childrenPath,
                                 i
                             ]),
-                            _childNewRender,
-                            i
+                            _childNewRender
                         );
                     }
                     return n;