From 684077ffcf459c3f63c74307224fa532cc9496ad Mon Sep 17 00:00:00 2001
From: gijoe0295 <gijoe0295@gmail.com>
Date: Wed, 18 Sep 2024 23:58:33 +0700
Subject: [PATCH 1/3] fix: props object containing key is spread into jsx

---
 src/components/Form/InputWrapper.tsx | 12 +++++++++---
 1 file changed, 9 insertions(+), 3 deletions(-)

diff --git a/src/components/Form/InputWrapper.tsx b/src/components/Form/InputWrapper.tsx
index c966dd4456e9..f54009852b22 100644
--- a/src/components/Form/InputWrapper.tsx
+++ b/src/components/Form/InputWrapper.tsx
@@ -76,10 +76,16 @@ function InputWrapper<TInput extends ValidInputs, TValue extends ValueTypeKey>(p
     const {registerInput} = useContext(FormContext);
 
     const {shouldSetTouchedOnBlurOnly, blurOnSubmit, shouldSubmitForm} = computeComponentSpecificRegistrationParams(props as InputComponentBaseProps);
+    const {key, ...registerInputProps} = registerInput(inputID, shouldSubmitForm, {ref, valueType, ...rest, shouldSetTouchedOnBlurOnly, blurOnSubmit});
 
-    // TODO: Sometimes we return too many props with register input, so we need to consider if it's better to make the returned type more general and disregard the issue, or we would like to omit the unused props somehow.
-    // eslint-disable-next-line react/jsx-props-no-spreading
-    return <InputComponent {...registerInput(inputID, shouldSubmitForm, {ref, valueType, ...rest, shouldSetTouchedOnBlurOnly, blurOnSubmit})} />;
+    return (
+        <InputComponent
+            key={key}
+            // TODO: Sometimes we return too many props with register input, so we need to consider if it's better to make the returned type more general and disregard the issue, or we would like to omit the unused props somehow.
+            // eslint-disable-next-line react/jsx-props-no-spreading
+            {...registerInputProps}
+        />
+    );
 }
 
 InputWrapper.displayName = 'InputWrapper';

From a3fb8392c2da69b03146e1882b41786fdf675280 Mon Sep 17 00:00:00 2001
From: gijoe0295 <gijoe0295@gmail.com>
Date: Thu, 19 Sep 2024 02:24:07 +0700
Subject: [PATCH 2/3] fix: spread key prop warning in MenuItemList

---
 src/components/MenuItemList.tsx | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/components/MenuItemList.tsx b/src/components/MenuItemList.tsx
index 2e732c691140..b5464aa9d9e8 100644
--- a/src/components/MenuItemList.tsx
+++ b/src/components/MenuItemList.tsx
@@ -82,7 +82,7 @@ function MenuItemList({
 
     return (
         <>
-            {menuItems.map((menuItemProps) => (
+            {menuItems.map(({key, ...menuItemProps}) => (
                 <OfflineWithFeedback
                     pendingAction={menuItemProps.pendingAction}
                     onClose={menuItemProps.onPendingActionDismiss}
@@ -90,7 +90,7 @@ function MenuItemList({
                     shouldForceOpacity={menuItemProps.shouldForceOpacity}
                 >
                     <MenuItem
-                        key={menuItemProps.key ?? menuItemProps.title}
+                        key={key ?? menuItemProps.title}
                         wrapperStyle={wrapperStyle}
                         onSecondaryInteraction={menuItemProps.link !== undefined ? (e) => secondaryInteraction(menuItemProps.link, e) : undefined}
                         ref={popoverAnchor}

From 6b71989b8c34d495ca59a1ddaea7f4c313b24eea Mon Sep 17 00:00:00 2001
From: gijoe0295 <gijoe0295@gmail.com>
Date: Thu, 19 Sep 2024 20:28:56 +0700
Subject: [PATCH 3/3] do not spread key in MenuItemList

---
 src/components/MenuItemList.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/MenuItemList.tsx b/src/components/MenuItemList.tsx
index 7b71e7cb27c2..d33a17f90a5e 100644
--- a/src/components/MenuItemList.tsx
+++ b/src/components/MenuItemList.tsx
@@ -84,7 +84,7 @@ function MenuItemList({
         <>
             {menuItems.map(({key, ...menuItemProps}) => (
                 <OfflineWithFeedback
-                    key={menuItemProps.key ?? menuItemProps.title}
+                    key={key ?? menuItemProps.title}
                     pendingAction={menuItemProps.pendingAction}
                     onClose={menuItemProps.onPendingActionDismiss}
                     errors={menuItemProps.error}