From 2273858c4381fa26c427196e4d0ab3a82ab404bb Mon Sep 17 00:00:00 2001
From: Kimo Knowles <kimo.knowles@day8.com.au>
Date: Fri, 18 Oct 2024 16:36:27 +0200
Subject: [PATCH] [error-modal] Fix react errors when x-button is mounted

---
 src/re_com/error_modal.cljs | 11 ++++++-----
 src/re_com/util.cljs        | 29 ++++++++++++++---------------
 2 files changed, 20 insertions(+), 20 deletions(-)

diff --git a/src/re_com/error_modal.cljs b/src/re_com/error_modal.cljs
index 788d35a3..a2446da6 100644
--- a/src/re_com/error_modal.cljs
+++ b/src/re_com/error_modal.cljs
@@ -18,11 +18,12 @@
              :on-mouse-leave (partial reset! hover? false)
              :on-click       on-click
              :style          {:padding "12px 7px 7px 7px"}}
-       [u/x-button (merge props {:width        "12px"
-                                 :height       "12px"
-                                 :hover?       hover?
-                                 :stroke       (if @hover? "#000000" "#ffffff")
-                                 :stroke-width "1.2px"})]])))
+       [u/x-button (merge {:width        "12px"
+                           :height       "12px"
+                           :hover?       hover?
+                           :stroke       (if @hover? "#000000" "#ffffff")
+                           :stroke-width "1.2px"}
+                          props)]])))
 
 (defn error-modal
   [& {:keys [severity title
diff --git a/src/re_com/util.cljs b/src/re_com/util.cljs
index 9d45f791..66a2c244 100644
--- a/src/re_com/util.cljs
+++ b/src/re_com/util.cljs
@@ -268,25 +268,24 @@
                         :down  "4,7 8,2 0,2")
               :fill   fill}]])
 
-(defn x-button [& {:as props}]
+(defn x-button [& {}]
   (let [hover-internal? (r/atom nil)]
-    (fn [& {:keys [hover? width height stroke-width]
+    (fn [& {:keys [hover? on-click width height stroke-width]
             :or {width  "9px"
                  height "9px"
                  hover? hover-internal?
-                 stroke-width "1px"}
-            :as   props}]
-      [:svg (merge {:on-mouse-enter (partial reset! hover? true)
-                    :on-mouse-leave (partial reset! hover? false)
-                    :width          width
-                    :height         height
-                    :viewBox        (str "0 0 " (<-px width) " " (<-px height))
-                    :xmlns          "http://www.w3.org/2000/svg"
-                    :stroke         (if (deref-or-value hover?) "#767a7c" "currentColor")
-                    :stroke-width   stroke-width}
-                   props)
-       [:line {:x1 0 :y1 0 :x2 (<-px width) :y2 (<-px height)}]
-       [:line {:x1 0 :y1 (<-px height) :x2 (<-px width) :y2 0}]])))
+                 stroke-width "1px"}}]
+      [:div {:on-click on-click}
+       [:svg {:on-mouse-enter (partial reset! hover? true)
+              :on-mouse-leave (partial reset! hover? false)
+              :width          width
+              :height         height
+              :viewBox        (str "0 0 " (<-px width) " " (<-px height))
+              :xmlns          "http://www.w3.org/2000/svg"
+              :stroke         (if (deref-or-value hover?) "#767a7c" "currentColor")
+              :stroke-width   stroke-width}
+        [:line {:x1 0 :y1 0 :x2 (<-px width) :y2 (<-px height)}]
+        [:line {:x1 0 :y1 (<-px height) :x2 (<-px width) :y2 0}]]])))
 
 (def scrollbar-thickness 10)
 (def scrollbar-margin    2)