fix: api호출 부분 수정

Author: SaidBySolo

src/components/ui/DeploymentDetailModal.tsx

@@ -50,10 +50,10 @@ const DeploymentDetailModal: React.FC<Props> = ({
   useEffect(() => {
     const fetchDetail = async () => {
       try {
-        const res = await apiFetch(
+        const data = await apiFetch(
           `/api/projects/${projectId}/terraform/deployments/${deploymentId}`
         );
-        setDetail(res.data);
+        setDetail(data);
       } catch (err) {
         toast.error("배포 상세 정보를 불러오지 못했습니다.");
       } finally {

src/components/ui/MainHeader.tsx

@@ -4,6 +4,7 @@ import { useProjectStore } from "../../stores";
 import { useBlockStore } from "../../stores/blockStore";
 import { useAuth } from "../../stores/authStore";
 import { useNavigate } from "react-router-dom";
+import { apiFetch } from "../../utils/apiClients";
 
 const MainHeader: React.FC<{
   onSaveProject: () => void;
@@ -37,22 +38,18 @@ const MainHeader: React.FC<{
     setProjectName(trimmed);
 
     try {
-      const response = await fetch(`/api/projects/${projectId}`, {
+      // apiFetch 사용으로 토큰 갱신 자동 처리
+      await apiFetch(`/api/projects/${projectId}`, {
         method: "PUT",
         headers: {
           "Content-Type": "application/json",
-          Authorization: `Bearer ${localStorage.getItem("accessToken")}`,
         },
         body: JSON.stringify({
           name: trimmed,
           description,
         }),
       });
 
-      if (!response.ok) {
-        throw new Error(`(${response.status}) 서버 응답 오류`);
-      }
-
       // 필요 시 서버 응답에서 name을 다시 읽어 동기화 가능
     } catch (err: any) {
       alert("❌ 제목 저장 실패: " + err.message);

src/components/ui/ProjectDeploymentCard.tsx

@@ -79,10 +79,10 @@ const ProjectDeploymentCard: React.FC<Props> = ({
   useEffect(() => {
     const fetchDeployments = async () => {
       try {
-        const res = await apiFetch(
+        const data = await apiFetch(
           `/api/projects/${projectId}/terraform/deployments?size=1`
         );
-        setDeployments(res.data?.deployments || []);
+        setDeployments(data?.deployments || []);
       } catch (err) {
         toast.error(
           `프로젝트 ${projectName}의 배포 이력을 불러오지 못했습니다.`,

src/hooks/useDeployment.ts

@@ -61,7 +61,8 @@ export const useDeployment = (projectId: string | undefined) => {
         }
       );
 
-      const isValid = validateRes?.data?.valid;
+      // apiFetch가 이미 unwrapped data를 반환
+      const isValid = validateRes?.valid;
 
       if (!isValid) {
         setLoadingStatus(null);
@@ -82,8 +83,9 @@ export const useDeployment = (projectId: string | undefined) => {
         }
       );
 
-      const status = applyRes?.data?.status;
-      const message = applyRes?.data?.message;
+      // apiFetch가 이미 unwrapped data를 반환
+      const status = applyRes?.status;
+      const message = applyRes?.message;
 
       if (status === 'SUCCESS' || status === 'PENDING') {
         toast.success(`🚀 배포 요청 완료: ${message}`);

src/pages/ProjectEditorPage.tsx

@@ -1466,7 +1466,8 @@ terraform {
         }
       );
 
-      const isValid = validateRes?.data?.valid;
+      // apiFetch가 이미 unwrapped data를 반환
+      const isValid = validateRes?.valid;
 
       if (!isValid) {
         setLoadingStatus(null); // ✅ 중단 시 로딩 종료
@@ -1487,8 +1488,9 @@ terraform {
         }
       );
 
-      const status = applyRes?.data?.status;
-      const message = applyRes?.data?.message;
+      // apiFetch가 이미 unwrapped data를 반환
+      const status = applyRes?.status;
+      const message = applyRes?.message;
 
       if (status === "SUCCESS" || status === "PENDING") {
         toast.success(`🚀 배포 요청 완료: ${message}`);

src/services/projectService.ts

@@ -1,39 +1,19 @@
 // src/services/projectService.ts
 import { useProjectStore } from "../stores/projectStore";
-import { TokenStorage } from "./authService";
-import type { ApiResponse } from "../types/auth";
-
-const API_BASE_URL =
-  import.meta.env.VITE_API_BASE_URL || "http://localhost:8080";
+import { apiFetch } from "../utils/apiClients";
 
 export async function createProject(name: string, description: string) {
-  const accessToken = TokenStorage.getAccessToken();
-
-  const response = await fetch(`${API_BASE_URL}/api/projects`, {
+  // apiFetch는 이미 토큰 갱신 및 에러 처리를 포함하고 있음
+  // 응답: {success: true, data: {id, name, description, ...}} -> apiFetch가 data 부분만 반환
+  const project = await apiFetch("/api/projects", {
     method: "POST",
     headers: {
       "Content-Type": "application/json",
-      ...(accessToken && { Authorization: `Bearer ${accessToken}` }),
     },
     body: JSON.stringify({ name, description }),
-    credentials: "include",
   });
 
-  const data: ApiResponse = await response.json();
-
-  if (!data.success || !data.data) {
-    const errorMsg = data.error?.message || "프로젝트 생성 실패";
-    const fields = data.error?.fields;
-
-    // 필드별 에러가 있으면 사용자에게 친절하게 표시
-    if (fields) {
-      const fieldErrors = Object.values(fields).join(", ");
-      throw new Error(fieldErrors || errorMsg);
-    }
-
-    throw new Error(errorMsg);
-  }
-
-  useProjectStore.getState().loadProject(data.data);
-  return data.data;
+  // project는 이미 unwrapped된 {id, name, description, createdAt, updatedAt}
+  useProjectStore.getState().loadProject(project);
+  return project;
 }