diff --git a/src/components/molecules/modal.tsx b/src/components/molecules/modal.tsx
index 03f8b81..5ff78bb 100644
--- a/src/components/molecules/modal.tsx
+++ b/src/components/molecules/modal.tsx
@@ -13,24 +13,22 @@ interface Props {
 const Modal = forwardRef<HTMLDialogElement, Props>(
   ({ id, title, description, children, actions, onClose }, ref) => {
     return (
-      <>
-        <dialog id={id} className="modal" ref={ref} onClose={onClose}>
-          <div className="modal-box">
-            <form method="dialog">
-              <button className="btn btn-sm btn-circle btn-ghost absolute right-2 top-2">
-                ✕
-              </button>
-            </form>
-            {title && <h3 className="font-bold text-lg">{title}</h3>}
-            {description && <div className="py-4">{description}</div>}
-            <div className="py-4">{children}</div>
-            <div className="modal-action">{actions}</div>
-          </div>
-          <form method="dialog" className="modal-backdrop">
-            <button>close</button>
+      <dialog id={id} className="modal" ref={ref} onClose={onClose}>
+        <div className="modal-box">
+          <form method="dialog">
+            <button className="btn btn-sm btn-circle btn-ghost absolute right-2 top-2">
+              ✕
+            </button>
           </form>
-        </dialog>
-      </>
+          {title && <h3 className="font-bold text-lg">{title}</h3>}
+          {description && <div className="py-4">{description}</div>}
+          <div className="py-4">{children}</div>
+          <div className="modal-action">{actions}</div>
+        </div>
+        <form method="dialog" className="modal-backdrop">
+          <button>close</button>
+        </form>
+      </dialog>
     );
   }
 );
diff --git a/src/components/molecules/theme.controller.tsx b/src/components/molecules/theme.controller.tsx
index ad0498d..c641983 100644
--- a/src/components/molecules/theme.controller.tsx
+++ b/src/components/molecules/theme.controller.tsx
@@ -13,7 +13,7 @@ const ThemeController: React.FC = () => {
     <label className="swap swap-rotate">
       <input value="pastel" type="checkbox" className="theme-controller" />
       <Sun className="swap-on w-6 h-6" />
-      <Moon className="swap-off w-6  h-6" />
+      <Moon className="swap-off w-6 h-6" />
     </label>
   );
 };
diff --git a/src/components/molecules/wallet.connect.button.tsx b/src/components/molecules/wallet.connect.button.tsx
index ab7cd12..7570025 100644
--- a/src/components/molecules/wallet.connect.button.tsx
+++ b/src/components/molecules/wallet.connect.button.tsx
@@ -8,9 +8,9 @@ import { shortenEthereumAddress } from 'src/helpers/short.address';
 import { Button } from '../atoms';
 
 const WalletConnectButton = () => {
-  const { account, connect } = useWalletContext();
+  const { account, connectToWallet } = useWalletContext();
   return (
-    <Button onClick={connect} variant={ButtonVariant.Secondary}>
+    <Button onClick={connectToWallet} variant={ButtonVariant.Secondary}>
       <CreditCard />
       <span>{account ? shortenEthereumAddress(account) : 'Connect'}</span>
     </Button>
diff --git a/src/components/templates/fundraisers.template.tsx b/src/components/templates/fundraisers.template.tsx
index 5858aeb..f787c8c 100644
--- a/src/components/templates/fundraisers.template.tsx
+++ b/src/components/templates/fundraisers.template.tsx
@@ -41,7 +41,11 @@ const FundraisersTemplate: React.FC = () => {
   });
 
   const closeModal = () => {
-    setSelectedFundraiser(null);
+    const modalElement = modalRef.current;
+    if (modalElement && modalElement.close) {
+      modalElement.close();
+      setSelectedFundraiser(null);
+    }
   };
 
   const openModal = () => {