From 6d0eb2cdd45a87c4e70d934f9072bef64441159e Mon Sep 17 00:00:00 2001
From: Cute_Wisp <sweatpotato13@gmail.com>
Date: Sun, 20 Oct 2024 10:16:15 +0900
Subject: [PATCH] =?UTF-8?q?fix:=20=F0=9F=90=9B=20fix=20wrong=20spinner=20l?=
 =?UTF-8?q?ocate?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/app/contact/page.tsx | 23 ++++++++++++++++-------
 1 file changed, 16 insertions(+), 7 deletions(-)

diff --git a/src/app/contact/page.tsx b/src/app/contact/page.tsx
index 432c18e..15abb3d 100644
--- a/src/app/contact/page.tsx
+++ b/src/app/contact/page.tsx
@@ -29,6 +29,7 @@ export default function ContactPage() {
     });
     const [toastMessage, setToastMessage] = useState("");
     const [toastType, setToastType] = useState<"success" | "error">("success");
+    const [loading, setLoading] = useState(false);
 
     function handleChange(
         e: React.ChangeEvent<HTMLInputElement | HTMLTextAreaElement>
@@ -46,6 +47,8 @@ export default function ContactPage() {
             return;
         }
 
+        setLoading(true);
+
         try {
             const res = await fetch("/api/contact", {
                 method: "POST",
@@ -62,6 +65,8 @@ export default function ContactPage() {
                 "문의 전송 중 오류가 발생했습니다: " + error.message
             );
             setToastType("error");
+        } finally {
+            setLoading(false);
         }
     }
 
@@ -133,13 +138,17 @@ export default function ContactPage() {
                     />
                 </div>
 
-                <div className="form-control">
-                    <button
-                        className="btn bg-base-90  w-full"
-                        onClick={handleSubmit}
-                    >
-                        전송
-                    </button>
+                <div className="form-control flex items-center justify-center">
+                    {loading ? (
+                        <span className="loading loading-spinner loading-md"></span>
+                    ) : (
+                        <button
+                            className="btn bg-base-90 w-full"
+                            onClick={handleSubmit}
+                        >
+                            전송
+                        </button>
+                    )}
                 </div>
 
                 {toastMessage && (