Merge pull request #104 from Beside-Potenday/seungbeom

feat: 메일 보내기 기능 추가

src/api/hooks/Mail/useGoMail.tsx

@@ -0,0 +1,41 @@
+import { MailGoData } from '@/types';
+import axios from 'axios';
+import { BASE_URL } from '../..';
+import { useMutation } from '@tanstack/react-query';
+
+export const postMailPath = () => `${BASE_URL}/send-email`;
+
+const createApiClient = () => {
+  const token = sessionStorage.getItem('accessToken');
+
+  return axios.create({
+    baseURL: BASE_URL,
+    headers: {
+      Authorization: `Bearer ${token}`,
+    },
+  });
+};
+
+const goMail = async (mailGo: MailGoData) => {
+  try {
+    const apiClient = createApiClient();
+    const response = await apiClient.post<string>(postMailPath(), mailGo);
+    return response.data;
+  } catch (error) {
+    console.error('Error posting mail:', error);
+    throw error;
+  }
+};
+
+export const useGoMail = () => {
+  const { mutate } = useMutation({
+    mutationFn: goMail,
+    onSuccess: (result) => {
+      console.log('Mail send successfully:', result);
+    },
+    onError: (error) => {
+      console.error('Error sending mail:', error);
+    },
+  });
+  return { mutate };
+};

src/components/Mail/MailModal.tsx

@@ -31,6 +31,7 @@ import {
 } from './MailModalData';
 import { useAuth } from '@/Provider/Auth';
 import { usePostMail } from '@/api/hooks/Mail/usePostMail';
+import { useGoMail } from '@/api/hooks/Mail/useGoMail';
 
 interface MailModalProps {
   isOpen: boolean;
@@ -57,6 +58,7 @@ export const MailModal = ({ isOpen, onOpen, onClose }: MailModalProps) => {
   const { authInfo } = useAuth();
 
   const { mutate: mailmutate } = usePostMail();
+  const { mutate: mailGo } = useGoMail();
 
   const currentcurrentInputNames =
     isActive === 'univ' ? currentInputNames : currentInputNamesBusiness;
@@ -222,6 +224,31 @@ export const MailModal = ({ isOpen, onOpen, onClose }: MailModalProps) => {
     onClose();
   };
 
+  const handleGoMail = () => {
+    const recipientEmail = prompt('받는 사람의 이메일 주소를 입력해 주세요:');
+
+    if (authInfo) {
+      const myMailAddress = sessionStorage.getItem('email');
+
+      if (recipientEmail) {
+        const mailGoContent = {
+          to: recipientEmail,
+          from: myMailAddress as string,
+          subject: mailResult.subject,
+          body: mailResult.body,
+        };
+        mailGo({ ...mailGoContent });
+        alert('📨 메일을 보냈습니다!');
+      } else {
+        alert('유효한 이메일 주소를 입력해 주세요.');
+      }
+    } else {
+      alert('로그인 후 메일을 보낼할 수 있습니다.');
+    }
+
+    onClose();
+  };
+
   useEffect(() => {
     setIsFocused(false);
     setValue(currentcurrentInputNames[currentIndex], '', { shouldValidate: true });
@@ -373,6 +400,9 @@ export const MailModal = ({ isOpen, onOpen, onClose }: MailModalProps) => {
             <Button colorScheme="blue" onClick={handlePutMail}>
               저장하기
             </Button>
+            <Button colorScheme="blue" onClick={handleGoMail}>
+              메일 보내기
+            </Button>
           </ModalFooter>
         )}
       </CustomModalContent>

src/types/index.ts

@@ -66,3 +66,10 @@ export interface MailListResponse {
   content: Array<{ subject: string; body: string; createDate: string }>;
   pageable: { pageNumber: number; pageSize: number };
 }
+
+export interface MailGoData {
+  to: string;
+  from: string;
+  subject: string;
+  body: string;
+}