[feat]댓글 작성 토스트

Author: mtm-git1018

src/domains/recipe/api/fetchRecipeComment.ts

@@ -1,23 +1,6 @@
 import { getApi } from '@/app/api/config/appConfig';
 import { CommentType } from '@/domains/community/types/post';
 
-export const postRecipeComment = async (cocktailId: number, content: string) => {
-  try {
-    const res = await fetch(`${getApi}/cocktails/${cocktailId}/comments`, {
-      method: 'POST',
-      headers: { 'Content-Type': 'application/json' },
-      credentials: 'include',
-      body: JSON.stringify({ content }),
-    });
-    const text = await res.text();
-    if (!res.ok) throw new Error('댓글 작성 실패');
-    const data = JSON.parse(text);
-    return data;
-  } catch (err) {
-    console.error(err);
-  }
-};
-
 export const getRecipeComment = async (cocktailId: number): Promise<CommentType[] | null> => {
   try {
     const res = await fetch(`${getApi}/cocktails/${cocktailId}/comments`, {
@@ -74,7 +57,7 @@ export async function deleteRecipeComment(
   });
 
   if (!response.ok) {
-    const errorText = await response.text(); // 👈 응답 본문을 텍스트로 읽기
+    const errorText = await response.text();
     console.error('서버 응답 에러:', errorText);
     throw new Error(`댓글 수정 실패: ${response.status}`);
   }

src/domains/recipe/api/useRecipeComment.ts

@@ -3,6 +3,7 @@ import { getApi } from '@/app/api/config/appConfig';
 import { User } from '@/domains/shared/store/auth';
 import { CommentType } from '@/domains/community/types/post';
 import { deleteRecipeComment, getRecipeComment, updateComment } from './fetchRecipeComment';
+import { useToast } from '@/shared/hook/useToast';
 
 export function useRecipeComments(
   cocktailId: number,
@@ -16,6 +17,7 @@ export function useRecipeComments(
     commentId: number;
     cocktailId: number;
   } | null>(null);
+  const { toastError } = useToast();
 
   const fetchData = useCallback(async () => {
     const data = await getRecipeComment(cocktailId);
@@ -30,7 +32,7 @@ export function useRecipeComments(
 
   const handleUpdateComment = async (commentId: number, content: string) => {
     if (!user) {
-      alert('로그인이 필요합니다');
+      toastError('로그인이 필요합니다');
       return;
     }
     try {
@@ -44,7 +46,7 @@ export function useRecipeComments(
       );
     } catch (err) {
       console.error(err);
-      alert('댓글 수정 중 오류가 발생했습니다.');
+      toastError('댓글 수정 중 오류가 발생했습니다.');
     }
   };
 
@@ -54,7 +56,7 @@ export function useRecipeComments(
 
   const handleConfirmDelete = async () => {
     if (!user) {
-      alert('로그인이 필요합니다');
+      toastError('로그인이 필요합니다');
       return;
     }
     if (!deleteTarget) return;
@@ -66,7 +68,6 @@ export function useRecipeComments(
       );
     } catch (err) {
       console.error(err);
-      alert('댓글 삭제 중 오류가 발생했습니다.');
     } finally {
       setDeleteTarget(null);
     }

src/domains/recipe/components/details/RecipeComment.tsx

@@ -1,10 +1,11 @@
 import CommentHeader from '@/domains/shared/components/comment/CommentHeader';
 import CommentList from '@/domains/shared/components/comment/CommentList';
-import { postRecipeComment } from '../../api/fetchRecipeComment';
 import { useAuthStore } from '@/domains/shared/store/auth';
 import { useShallow } from 'zustand/shallow';
 import ConfirmModal from '@/shared/components/modal-pop/ConfirmModal';
 import { useRecipeComments } from '../../api/useRecipeComment';
+import { getApi } from '@/app/api/config/appConfig';
+import { useToast } from '@/shared/hook/useToast';
 
 interface Props {
   cocktailId: number;
@@ -17,6 +18,28 @@ function RecipeComment({ cocktailId }: Props) {
       accessToken: state.accessToken,
     }))
   );
+  const { toastInfo } = useToast();
+
+  const postRecipeComment = async (cocktailId: number, content: string) => {
+    try {
+      const res = await fetch(`${getApi}/cocktails/${cocktailId}/comments`, {
+        method: 'POST',
+        headers: { 'Content-Type': 'application/json' },
+        credentials: 'include',
+        body: JSON.stringify({ content }),
+      });
+      const text = await res.text();
+      if (!res.ok) {
+        toastInfo('댓글은 한 개만 작성가능합니다');
+        return;
+      }
+      const data = JSON.parse(text);
+      return data;
+    } catch (err) {
+      console.error(err);
+    }
+  };
+
   const {
     comments,
     fetchData,