feat: 게시물 생성 및 수정 시 isVisible 속성 추가

Author: mingkyeongg

src/api/postings.ts

@@ -8,6 +8,7 @@ type PostingMutationArg = {
   articleTitle: string;
   articleBody: string;
   images: File[] | null;
+  isVisible: boolean;
 };
 
 type PostingMutationResp = {
@@ -19,6 +20,7 @@ export const createPost = async ({
   articleTitle,
   articleBody,
   images,
+  isVisible,
 }: PostingMutationArg) => {
   let imageUrls: string[] | undefined;
 
@@ -35,6 +37,7 @@ export const createPost = async ({
     articleTitle,
     articleBody,
     images: imageUrls,
+    isVisible,
   };
 
   const res = await apiInstance.post<ServerResponse<PostingMutationResp>>(
@@ -51,6 +54,7 @@ export const mutatePost = async ({
   articleBody,
   images,
   articleId,
+  isVisible,
 }: PostingMutationArg & {
   articleId: number;
 }) => {
@@ -69,6 +73,7 @@ export const mutatePost = async ({
     articleTitle,
     articleBody,
     images: imageUrls,
+    isVisible,
   };
 
   const res = await apiInstance.put<ServerResponse<PostingMutationResp>>(

src/hooks/useArticleFeedbackStream.ts

@@ -4,11 +4,14 @@ import { API_BASE_URL } from '@/api/config';
 
 type FeedbackStatus = 'idle' | 'streaming' | 'completed' | 'error';
 
+const END_MARKER = '스트리밍 종료';
+
 export const useArticleFeedbackStream = (initialArticleId: number | null) => {
   const [feedback, setFeedback] = useState('');
   const [status, setStatus] = useState<FeedbackStatus>('idle');
   const [error, setError] = useState<string | null>(null);
   const eventSourceRef = useRef<EventSource | null>(null);
+  const feedbackRef = useRef<string>('');
 
   const closeStream = useCallback(() => {
     if (eventSourceRef.current) {
@@ -40,19 +43,40 @@ export const useArticleFeedbackStream = (initialArticleId: number | null) => {
           const parsed = JSON.parse(event.data);
           const chunk = parsed.content;
 
+          feedbackRef.current += chunk;
           setFeedback((prev) => prev + chunk);
-          console.log(chunk);
+
+          if (feedbackRef.current.includes(END_MARKER)) {
+            closeStream();
+            const finalFeedback = feedbackRef.current
+              .replace(END_MARKER, '')
+              .trim();
+            setFeedback(finalFeedback);
+            feedbackRef.current = finalFeedback;
+            setStatus('completed');
+          }
         } catch (err) {
           console.log(err);
         }
       };
 
       es.onerror = () => {
         closeStream();
-        setFeedback((prev) => {
-          setStatus(prev.length > 0 ? 'completed' : 'error');
-          return prev;
-        });
+
+        if (feedbackRef.current.includes(END_MARKER)) {
+          const finalFeedback = feedbackRef.current
+            .replace(END_MARKER, '')
+            .trim();
+          setFeedback(finalFeedback);
+          feedbackRef.current = finalFeedback;
+          setStatus('completed');
+        } else if (feedbackRef.current.length > 0) {
+          setError('응답이 비정상적으로 종료되었습니다.');
+          setStatus('error');
+        } else {
+          setError('피드백 생성에 실패했습니다. 다시 시도해주세요.');
+          setStatus('error');
+        }
       };
     },
     [initialArticleId, closeStream]

src/pages/Posting/Posting.tsx

@@ -131,7 +131,9 @@ const Posting = () => {
     return <Navigate to={PATH.TEAMS} />;
   }
 
-  const handleSaveArticle = async (): Promise<number | undefined> => {
+  const handleSaveArticle = async (
+    isVisible: boolean = true
+  ): Promise<number | undefined> => {
     if (isPending) return;
 
     if (!postTitle) {
@@ -193,6 +195,7 @@ const Posting = () => {
           articleId: targetId,
           articleBody: articleBody,
           articleTitle: postTitle,
+          isVisible: isVisible,
         });
       } else {
         const res = await createPost({
@@ -203,6 +206,7 @@ const Posting = () => {
               : null,
           articleBody: articleBody,
           articleTitle: postTitle,
+          isVisible: isVisible,
         });
         targetId = res.articleId;
       }
@@ -261,7 +265,7 @@ const Posting = () => {
       return;
     }
 
-    const savedId = await handleSaveArticle();
+    const savedId = await handleSaveArticle(false);
 
     if (savedId) {
       startFeedbackStream(savedId);
@@ -328,8 +332,8 @@ const Posting = () => {
                   gap="8px"
                 >
                   <GptFeedbackButton
-                    disabled={isPending || isFeedbackStreaming}
-                    isPending={isPending || isFeedbackStreaming}
+                    disabled={isPending || isFeedbackStreaming || isComplete}
+                    isPending={isPending || isFeedbackStreaming || isComplete}
                     hasFeedback={!!feedback}
                     onClick={handleFeedbackClick}
                   >