From 329051be1cbb9759503fb2a3da6b1639358ddba0 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Tom=C3=A1s=20Castillo?= <tcastilloboireau@gmail.com>
Date: Thu, 9 Apr 2026 01:50:53 -0300
Subject: [PATCH] fix: replace React.DOM on newer react versions at
 showConfirmDialog
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Signed-off-by: Tomás Castillo <tcastilloboireau@gmail.com>
---
 src/components/mui/showConfirmDialog.js | 28 +++++++++++++++++++++----
 1 file changed, 24 insertions(+), 4 deletions(-)

diff --git a/src/components/mui/showConfirmDialog.js b/src/components/mui/showConfirmDialog.js
index b559115..1d30408 100644
--- a/src/components/mui/showConfirmDialog.js
+++ b/src/components/mui/showConfirmDialog.js
@@ -15,6 +15,14 @@ import ReactDOM from "react-dom";
 import React from "react";
 import ConfirmDialog from "./confirm-dialog";
 
+// React 18+ uses createRoot from react-dom/client; React 17 does not have this module
+let createRoot;
+try {
+  ({ createRoot } = require("react-dom/client"));
+} catch (_) {
+  // React 17 — createRoot not available, will fall back to ReactDOM.render
+}
+
 const showConfirmDialog = ({
   title,
   text,
@@ -28,8 +36,14 @@ const showConfirmDialog = ({
     const container = document.createElement("div");
     document.body.appendChild(container);
 
+    let root = null;
+
     const close = (answer) => {
-      ReactDOM.unmountComponentAtNode(container);
+      if (root) {
+        root.unmount();
+      } else {
+        ReactDOM.unmountComponentAtNode(container);
+      }
       container.remove();
       resolve(answer);
     };
@@ -37,7 +51,7 @@ const showConfirmDialog = ({
     const handleConfirm = () => close(true);
     const handleCancel = () => close(false);
 
-    ReactDOM.render(
+    const element = (
       <ConfirmDialog
         open
         title={title}
@@ -49,9 +63,15 @@ const showConfirmDialog = ({
         cancelButtonColor={cancelButtonColor}
         onConfirm={handleConfirm}
         onCancel={handleCancel}
-      />,
-      container
+      />
     );
+
+    if (createRoot) {
+      root = createRoot(container);
+      root.render(element);
+    } else {
+      ReactDOM.render(element, container);
+    }
   });
 
 export default showConfirmDialog;