From b51954a19875e1f3c87e0cdc03c10173e9786820 Mon Sep 17 00:00:00 2001
From: Chris Villa <chrisvilla@me.com>
Date: Mon, 16 Dec 2024 16:24:22 +0000
Subject: [PATCH] fix: prevent field name collision causing hook render
 mismatch

---
 .../core/components/Puck/components/Fields/index.tsx | 12 ++++++++----
 1 file changed, 8 insertions(+), 4 deletions(-)

diff --git a/packages/core/components/Puck/components/Fields/index.tsx b/packages/core/components/Puck/components/Fields/index.tsx
index e451b861a2..b369aebd78 100644
--- a/packages/core/components/Puck/components/Fields/index.tsx
+++ b/packages/core/components/Puck/components/Fields/index.tsx
@@ -269,12 +269,14 @@ export const Fields = () => {
               item: selectedItem,
             });
 
+            const id = `${selectedItem.props.id}_${field.type}_${fieldName}`;
+
             return (
               <AutoFieldPrivate
-                key={`${selectedItem.props.id}_${fieldName}`}
+                key={id}
                 field={field}
                 name={fieldName}
-                id={`${selectedItem.props.id}_${fieldName}`}
+                id={id}
                 readOnly={!edit || readOnly[fieldName]}
                 value={selectedItem.props[fieldName]}
                 onChange={onChange}
@@ -289,12 +291,14 @@ export const Fields = () => {
               root: true,
             });
 
+            const id = `root_${field.type}_${fieldName}`;
+
             return (
               <AutoFieldPrivate
-                key={`page_${fieldName}`}
+                key={id}
                 field={field}
                 name={fieldName}
-                id={`root_${fieldName}`}
+                id={id}
                 readOnly={!edit || readOnly[fieldName]}
                 value={(rootProps as Record<string, any>)[fieldName]}
                 onChange={onChange}