feat: twitter svg 디자인 시안으로 변경, alert -> Toast로 대체

Author: junjeeong

public/icon/twitter.svg

@@ -6,8 +6,7 @@ const TwitterShareButton = ({ title }: { title: string }) => {
       href={`https://twitter.com/intent/tweet?text=${title}&url=${currentUrl}`}
       className="flex flex-col items-center gap-1"
     >
-      <img src="/icon/twitter.svg" alt="트위터 아이콘" width={76} height={76} />
-      <p className="text-md text-gray-800">트위터</p>
+      <img src="/icon/twitter.svg" alt="트위터 아이콘" width={72} height={72} />
     </a>
   );
 };

src/components/button/TwitterShareButton.tsx

@@ -1,23 +1,36 @@
-const UrlCopyButton = ({currentUrl} : {currentUrl : string}) => {
-    const handleCopy = () => {
-      navigator.clipboard
-        .writeText(currentUrl)
-        .then(() => {
-          alert("URL이 복사되었습니다!"); // toast로 바꾸어야 함 -> 4.10 정준영
-        })
-        .catch((err) => {
-          console.error("URL 복사 실패:", err); 
-        });
-    };
-  
-    return (
+import ToastMessage from "@/components/ToastMessage";
+import { useState } from "react";
+
+const UrlCopyButton = ({ currentUrl }: { currentUrl: string }) => {
+  const [toastMessage, setToastMessage] = useState<string>("");
+
+  const handleCopy = () => {
+    navigator.clipboard
+      .writeText(currentUrl)
+      .then(() => {
+        setToastMessage("URL을 복사했습니다.");
+      })
+      .catch((err) => {
+        console.error("URL 복사 실패:", err);
+      });
+  };
+
+  return (
+    <>
       <button
         onClick={handleCopy}
-        className="bg-primary-normal h-8 text-white flex items-center justify-center rounded-[20px] px-4 py-2"
+        className="flex h-8 items-center justify-center rounded-[20px] bg-primary-normal px-4 py-2 text-white"
       >
         복사
       </button>
-    );
-  };
-  
-  export default UrlCopyButton;
+      {toastMessage && (
+        <ToastMessage
+          message={toastMessage}
+          onClose={() => setToastMessage("")}
+        />
+      )}
+    </>
+  );
+};
+
+export default UrlCopyButton;