From 96a88fe865e137ae1b817041f8fc99fb24a3d84f Mon Sep 17 00:00:00 2001
From: Joseph Garrone <joseph.garrone.gj@gmail.com>
Date: Sun, 2 Jun 2024 00:31:08 +0200
Subject: [PATCH] Fix add remove button for multifield attributes

---
 src/login/UserProfileFormFields.tsx      | 32 +++++++++++++-----------
 src/tools/structuredCloneButFunctions.ts | 24 ++++++++++++++++++
 2 files changed, 41 insertions(+), 15 deletions(-)
 create mode 100644 src/tools/structuredCloneButFunctions.ts

diff --git a/src/login/UserProfileFormFields.tsx b/src/login/UserProfileFormFields.tsx
index 04654cf4..728dca3d 100644
--- a/src/login/UserProfileFormFields.tsx
+++ b/src/login/UserProfileFormFields.tsx
@@ -426,21 +426,23 @@ function AddRemoveButtonsMultiValuedAttribute(props: {
     return (
         <>
             {hasRemove && (
-                <button
-                    id={`kc-remove${idPostfix}`}
-                    type="button"
-                    className="pf-c-button pf-m-inline pf-m-link"
-                    onClick={() =>
-                        dispatchFormAction({
-                            action: "update",
-                            name: attribute.name,
-                            valueOrValues: values.filter((_, i) => i !== fieldIndex)
-                        })
-                    }
-                >
-                    {msg("remove")}
-                    {hasRemove ? <>&nbsp;|&nbsp;</> : null}
-                </button>
+                <>
+                    <button
+                        id={`kc-remove${idPostfix}`}
+                        type="button"
+                        className="pf-c-button pf-m-inline pf-m-link"
+                        onClick={() =>
+                            dispatchFormAction({
+                                action: "update",
+                                name: attribute.name,
+                                valueOrValues: values.filter((_, i) => i !== fieldIndex)
+                            })
+                        }
+                    >
+                        {msg("remove")}
+                    </button>
+                    {hasAdd ? <>&nbsp;|&nbsp;</> : null}
+                </>
             )}
             {hasAdd && (
                 <button
diff --git a/src/tools/structuredCloneButFunctions.ts b/src/tools/structuredCloneButFunctions.ts
new file mode 100644
index 00000000..cc740b6e
--- /dev/null
+++ b/src/tools/structuredCloneButFunctions.ts
@@ -0,0 +1,24 @@
+import "minimal-polyfills/Object.fromEntries";
+
+/**
+ * Functionally equivalent to structuredClone but
+ * functions are not cloned but kept as is.
+ * (as opposed to structuredClone that chokes if it encounters a function)
+ */
+export function structuredCloneButFunctions<T>(o: T): T {
+    if (!(o instanceof Object)) {
+        return o;
+    }
+
+    if (typeof o === "function") {
+        return o;
+    }
+
+    if (o instanceof Array) {
+        return o.map(structuredCloneButFunctions) as any;
+    }
+
+    return Object.fromEntries(
+        Object.entries(o).map(([key, value]) => [key, structuredCloneButFunctions(value)])
+    ) as any;
+}