From 0bb1bd3199a5f0ed24b978897b96553590f39810 Mon Sep 17 00:00:00 2001
From: wnhaoo <153691178+wnhaoo@users.noreply.github.com>
Date: Mon, 17 Mar 2025 02:11:04 +0900
Subject: [PATCH 1/4] =?UTF-8?q?feat:=20type=20=EC=88=98=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/mentorship/pages/MentorInfoView.tsx       | 22 +++---
 src/user/components/ProfileEdit/EditBio.tsx   | 21 +++--
 .../ProfileEdit/EditProfileSection.tsx        |  7 +-
 src/user/components/ProfileEdit/EditTime.tsx  | 77 +++++++++++--------
 .../components/profileInfo/MenteeInfoBio.tsx  | 10 +--
 .../components/profileInfo/MentorInfoBio.tsx  | 10 +--
 .../profileInfo/MentorInfoProfile.tsx         |  7 +-
 .../components/profileInfo/MentorInfoTime.tsx | 12 +--
 src/user/menteetypes.ts                       |  4 +-
 src/user/pages/ProfileEdit/MenteeInfo.tsx     |  8 +-
 .../pages/ProfileEdit/MenteeProfileEdit.tsx   |  8 +-
 src/user/pages/ProfileEdit/MentorInfo.tsx     | 22 +++---
 .../pages/ProfileEdit/MentorProfileEdit.tsx   | 19 ++---
 src/user/types.ts                             | 43 +++++------
 14 files changed, 141 insertions(+), 129 deletions(-)

diff --git a/src/mentorship/pages/MentorInfoView.tsx b/src/mentorship/pages/MentorInfoView.tsx
index 406f01b..a34bec8 100644
--- a/src/mentorship/pages/MentorInfoView.tsx
+++ b/src/mentorship/pages/MentorInfoView.tsx
@@ -27,7 +27,8 @@ const MentorInfoView = () => {
       },
       organization: {
         name: "OO주식회사",
-        role: "브랜드 마케팅/카피라이팅",
+        jobCategory: "브랜드 마케팅",
+        detailedJob: "카피라이팅",
         experience: 6,
       },
       count: 716,
@@ -36,13 +37,13 @@ const MentorInfoView = () => {
         filePath: "",
       },
       introduction: {
-        summary: "브랜드 마케팅에 대한 모든 것을 알려드립니다.",
-        bio: "안녕하세요!\n저는 OO대학교 경영학과를 졸업하고 현재 XXXX에 다니고 있는 ‘바이’입니다.",
+        title: "브랜드 마케팅에 대한 모든 것을 알려드립니다.",
+        content: "안녕하세요!\n저는 OO대학교 경영학과를 졸업하고 현재 XXXX에 다니고 있는 ‘바이’입니다.",
       },        
-      availableDays: ["월", "목"],
       timezone: {
-        startTime: { period: "오전", hour: "10", minute: "00"},
-        endTime: { period: "오후", hour: "18", minute: "00"},
+        days: ["월", "목"],
+        startTime: "09:00:00",
+        endTime: "17:00:00",
       },
       mentoringField: ["취업 준비", "커리어 고민"],        
       hashtags: ["마케팅", "브랜드마케팅", "이직", "취준", "진로고민상담", "면접노하우"],
@@ -98,7 +99,8 @@ const MentorInfoView = () => {
           <MentorInfoProfile 
             nickname={mentorData.nickname} 
             name={mentorData.organization.name}
-            role={mentorData.organization.role} 
+            jobCategory={mentorData.organization.jobCategory}
+            detailedJob={mentorData.organization.detailedJob}
             experience={mentorData.organization.experience} 
             count={mentorData.count}
             image={mentorData?.image?.filePath || "/assets/ringusprofile.png"}
@@ -109,13 +111,13 @@ const MentorInfoView = () => {
 
           {/* 자기소개 */}
           <MentorInfoBio 
-            summary={mentorData.introduction.summary}
-            bio={mentorData.introduction.bio}
+            title={mentorData.introduction.title}
+            content={mentorData.introduction.content}
           />
 
           {/* 선호 시간대 */}
           <MentorInfoTime
-            availableDays={mentorData.availableDays} 
+            days={mentorData.days} 
             startTime={mentorData.timezone.startTime} 
             endTime={mentorData.timezone.endTime} 
           />
diff --git a/src/user/components/ProfileEdit/EditBio.tsx b/src/user/components/ProfileEdit/EditBio.tsx
index 4baa541..486e48d 100644
--- a/src/user/components/ProfileEdit/EditBio.tsx
+++ b/src/user/components/ProfileEdit/EditBio.tsx
@@ -21,8 +21,8 @@ const EditBio = ({ mentorData, setMentorData, menteeData, setMenteeData }: EditB
         className="w-full px-5 py-4 border-[1px] border-[#D9D7E0] rounded-[10px] text-[14px] resize-none outline-none focus:border-primary-1"
         rows={1}
         value={
-          mentorData?.introduction.summary ||
-          menteeData?.introduction.summary ||
+          mentorData?.introduction.title ||
+          menteeData?.introduction.title ||
           ''
         }
         onChange={(e) => {
@@ -31,7 +31,7 @@ const EditBio = ({ mentorData, setMentorData, menteeData, setMenteeData }: EditB
               ...mentorData,
               introduction: {
                 ...mentorData.introduction,
-                summary: e.target.value,
+                title: e.target.value,
               },
             });
           } else if (menteeData && setMenteeData) {
@@ -39,7 +39,7 @@ const EditBio = ({ mentorData, setMentorData, menteeData, setMenteeData }: EditB
               ...menteeData,
               introduction: {
                 ...menteeData.introduction,
-                summary: e.target.value,
+                title: e.target.value,
               },
             });
           }
@@ -52,18 +52,18 @@ const EditBio = ({ mentorData, setMentorData, menteeData, setMenteeData }: EditB
       <textarea
         className="w-full min-h-[250px] px-5 py-4 mt-2 border-[1px] border-[#D9D7E0] rounded-[10px] text-[14px] resize-none outline-none focus:border-primary-1"
         value={
-          mentorData?.introduction.bio || menteeData?.introduction.bio || ''
+          mentorData?.introduction.content || menteeData?.introduction.content || ''
         }
         onChange={(e) => {
           if (mentorData && setMentorData) {
             setMentorData({
               ...mentorData,
-              introduction: { ...mentorData.introduction, bio: e.target.value },
+              introduction: { ...mentorData.introduction, content: e.target.value },
             });
           } else if (menteeData && setMenteeData) {
             setMenteeData({
               ...menteeData,
-              introduction: { ...menteeData.introduction, bio: e.target.value },
+              introduction: { ...menteeData.introduction, content: e.target.value },
             });
           }
         }}
@@ -72,10 +72,9 @@ const EditBio = ({ mentorData, setMentorData, menteeData, setMenteeData }: EditB
       />
 
       <p className="text-right text-[#94939B] text-[14px] mt-1">
-        {mentorData?.introduction.bio.length ||
-          menteeData?.introduction.bio.length ||
-          0}{' '}
-        / 500
+        {(mentorData?.introduction?.content?.length || 
+          menteeData?.introduction?.content?.length || 0)} 
+          / 500
       </p>
     </div>
   );
diff --git a/src/user/components/ProfileEdit/EditProfileSection.tsx b/src/user/components/ProfileEdit/EditProfileSection.tsx
index bedb4e6..8c59ff1 100644
--- a/src/user/components/ProfileEdit/EditProfileSection.tsx
+++ b/src/user/components/ProfileEdit/EditProfileSection.tsx
@@ -1,4 +1,4 @@
-import { useState } from "react";
+import { useState, useEffect } from "react";
 
 import { User } from 'lucide-react';
 import { Mail } from 'lucide-react';
@@ -16,7 +16,8 @@ interface EditProfileSectionProps {
     };
     organization: {
       name: string;
-      role: string;
+      jobCategory: string;
+      detailedJob: string;
       experience: number;
     };
     image: {
@@ -125,7 +126,7 @@ const EditProfileSection = ({ mentorData, setMentorData }: EditProfileSectionPro
               color="#94939b"
               className="mr-3 ml-0.5"
             />
-            <span className="text-[#94939B] text-[14px]">{mentorData.organization.role} {mentorData.organization.experience}</span>
+            <span className="text-[#94939B] text-[14px]">{mentorData.organization.jobCategory} / {mentorData.organization.detailedJob} {mentorData.organization.experience}년차</span>
           </div>
           <div className="flex items-center bg-[#F2F2F6] rounded-[10px] px-3 py-1 my-2 h-8">
             <BriefcaseBusiness
diff --git a/src/user/components/ProfileEdit/EditTime.tsx b/src/user/components/ProfileEdit/EditTime.tsx
index 7979625..d02260c 100644
--- a/src/user/components/ProfileEdit/EditTime.tsx
+++ b/src/user/components/ProfileEdit/EditTime.tsx
@@ -1,6 +1,7 @@
 import { useState } from 'react';
 import { MentorData } from '@/user/types';
-import { TimeSelectModal } from '@/mentorship/components/TimeSelectModal';
+import { TimeModal } from '../profile/mentor/TimeModal';
+// import { TimeSelectModal } from '@/mentorship/components/TimeSelectModal';
 import { ChevronDown } from 'lucide-react';
 
 interface EditTimeProps {
@@ -11,15 +12,40 @@ interface EditTimeProps {
 const EditTime = ({ mentorData, setMentorData }: EditTimeProps) => {
   const [isModalOpen, setIsModalOpen] = useState(false);
 
-  const days = ['월', '화', '수', '목', '금', '토', '일'];
+  const availabledays = ['월', '화', '수', '목', '금', '토', '일'];
 
+  // `HH:MM:SS` 형식에서 시간과 분을 추출하는 함수
+  const parseTime = (time: string) => {
+    const [hour, minute] = time.split(":").map(Number);
+    return { hour, minute };
+  };
+
+  const { hour: startHour, minute: startMinute } = parseTime(mentorData.timezone.startTime);
+  const { hour: endHour, minute: endMinute } = parseTime(mentorData.timezone.endTime);
+
+
+  // 시간 저장
+  const handleSaveTime = () => {
+    setMentorData((prev) => ({
+      ...prev,
+      timezone: {
+        ...prev.timezone,
+        startTime: `${String(startHour).padStart(2, '0')}:${String(startMinute).padStart(2, '0')}:00`,
+        endTime: `${String(endHour).padStart(2, '0')}:${String(endMinute).padStart(2, '0')}:00`,
+      },
+    }));
+  };
+  
   // 요일 선택
   const toggleSelection = (day: string) => {
     setMentorData((prev) => ({
       ...prev,
-      availableDays: prev.availableDays.includes(day)
-        ? prev.availableDays.filter((d) => d !== day)
-        : [...prev.availableDays, day],
+      timezone: {
+        ...prev.timezone,
+        days: prev.timezone.days.includes(day)
+          ? prev.timezone.days.filter((d) => d !== day)
+          : [...prev.timezone.days, day],
+      },
     }));
   };
 
@@ -31,11 +57,11 @@ const EditTime = ({ mentorData, setMentorData }: EditTimeProps) => {
       {/* 요일 */}
       <div className="text-[14px] text-[#94939B] mb-2">요일</div>
       <div className="grid grid-cols-7 gap-2">
-        {days.map((day) => (
+        {availabledays.map((day) => (
           <button
             key={day}
             className={`text-[16px] border-[1px] rounded-[10px] p-2 
-              ${mentorData.availableDays.includes(day) ? 'bg-[#F2EFFF] text-primary-1 border-primary-1' : 'border-[#94939B] text-[#94939B]'}`}
+              ${mentorData.timezone.days.includes(day) ? 'bg-[#F2EFFF] text-primary-1 border-primary-1' : 'border-[#94939B] text-[#94939B]'}`}
             onClick={() => toggleSelection(day)}
           >
             {day}
@@ -49,38 +75,23 @@ const EditTime = ({ mentorData, setMentorData }: EditTimeProps) => {
         className="w-full text-left border-[1px] border-[#D9D7E0] rounded-[10px] px-5 py-3 text-[16px] flex justify-between items-center"
         onClick={() => setIsModalOpen(true)}
       >
-        {`${mentorData.timezone.startTime.period} ${mentorData.timezone.startTime.hour}:${mentorData.timezone.startTime.minute} ~ ${mentorData.timezone.endTime.period} ${mentorData.timezone.endTime.hour}:${mentorData.timezone.endTime.minute}`}
+        {`${mentorData.timezone.startTime} ~ ${mentorData.timezone.endTime}`}
         <ChevronDown size={26} strokeWidth={1.0} color="#94939b" />
       </button>
 
       {/* 시간대 선택 모달 */}
-      <TimeSelectModal
+      <TimeModal
         isOpen={isModalOpen}
         onClose={() => setIsModalOpen(false)}
-        startPeriod={mentorData.timezone.startTime.period}
-        setStartPeriod={(value) =>
-          setMentorData((prev) => ({ ...prev, startPeriod: value }))
-        }
-        startHour={mentorData.timezone.startTime.hour}
-        setStartHour={(value) =>
-          setMentorData((prev) => ({ ...prev, startHour: value }))
-        }
-        startMinute={mentorData.timezone.startTime.minute}
-        setStartMinute={(value) =>
-          setMentorData((prev) => ({ ...prev, startMinute: value }))
-        }
-        endPeriod={mentorData.timezone.endTime.period}
-        setEndPeriod={(value) =>
-          setMentorData((prev) => ({ ...prev, endPeriod: value }))
-        }
-        endHour={mentorData.timezone.endTime.hour}
-        setEndHour={(value) =>
-          setMentorData((prev) => ({ ...prev, endHour: value }))
-        }
-        endMinute={mentorData.timezone.endTime.minute}
-        setEndMinute={(value) =>
-          setMentorData((prev) => ({ ...prev, endMinute: value }))
-        }
+        startHour={startHour}
+        setStartHour={(value) => setMentorData((prev) => ({ ...prev, timezone: { ...prev.timezone, startTime: `${String(value).padStart(2, '0')}:${startMinute}:00` } }))}
+        startMinute={startMinute}
+        setStartMinute={(value) => setMentorData((prev) => ({ ...prev, timezone: { ...prev.timezone, startTime: `${startHour}:${String(value).padStart(2, '0')}:00` } }))}
+        endHour={endHour}
+        setEndHour={(value) => setMentorData((prev) => ({ ...prev, timezone: { ...prev.timezone, endTime: `${String(value).padStart(2, '0')}:${endMinute}:00` } }))}
+        endMinute={endMinute}
+        setEndMinute={(value) => setMentorData((prev) => ({ ...prev, timezone: { ...prev.timezone, endTime: `${endHour}:${String(value).padStart(2, '0')}:00` } }))}
+        onSave={handleSaveTime}
       />
     </div>
   );
diff --git a/src/user/components/profileInfo/MenteeInfoBio.tsx b/src/user/components/profileInfo/MenteeInfoBio.tsx
index 4c3abfa..138182a 100644
--- a/src/user/components/profileInfo/MenteeInfoBio.tsx
+++ b/src/user/components/profileInfo/MenteeInfoBio.tsx
@@ -1,13 +1,13 @@
 interface MenteeInfoBioProps {
-  summary: string;
-  bio: string;
+  title: string;
+  content: string;
 }
 
-const MenteeInfoBio = ({ summary, bio }: MenteeInfoBioProps) => {
+const MenteeInfoBio = ({ title, content }: MenteeInfoBioProps) => {
   return (
     <div className="px-4 my-2">
-      <div className="font-bold text-[16px] my-7 text-center">{summary}</div>
-      <div className="bg-[#F2F2F6] rounded-[10px] px-5 py-4 text-[14px] whitespace-pre-line mb-10">{bio}</div>
+      <div className="font-bold text-[16px] my-7 text-center">{title}</div>
+      <div className="bg-[#F2F2F6] rounded-[10px] px-5 py-4 text-[14px] whitespace-pre-line mb-10">{content}</div>
     </div>
   );
 };
diff --git a/src/user/components/profileInfo/MentorInfoBio.tsx b/src/user/components/profileInfo/MentorInfoBio.tsx
index 713a9d1..f9c4f78 100644
--- a/src/user/components/profileInfo/MentorInfoBio.tsx
+++ b/src/user/components/profileInfo/MentorInfoBio.tsx
@@ -1,13 +1,13 @@
 interface MentorInfoBioProps {
-  summary: string;
-  bio: string;
+  title: string;
+  content: string;
 }
 
-const MentorInfoBio = ({ summary, bio }: MentorInfoBioProps) => {
+const MentorInfoBio = ({ title, content }: MentorInfoBioProps) => {
   return (
     <div className="px-4 my-2">
-      <div className="font-bold text-[16px] my-7 text-center">{summary}</div>
-      <div className="bg-[#F2F2F6] rounded-[10px] px-5 py-4 text-[14px] whitespace-pre-line">{bio}</div>
+      <div className="font-bold text-[16px] my-7 text-center">{title}</div>
+      <div className="bg-[#F2F2F6] rounded-[10px] px-5 py-4 text-[14px] whitespace-pre-line">{content}</div>
     </div>
   );
 };
diff --git a/src/user/components/profileInfo/MentorInfoProfile.tsx b/src/user/components/profileInfo/MentorInfoProfile.tsx
index e87bc85..00d1256 100644
--- a/src/user/components/profileInfo/MentorInfoProfile.tsx
+++ b/src/user/components/profileInfo/MentorInfoProfile.tsx
@@ -1,13 +1,14 @@
 interface MentorInfoProfileProps {
   nickname: string;
   name: string;
-  role: string;
+  jobCategory: string;
+  detailedJob: string;
   experience: number;
   count: number;
   image: string;
 }
 
-const MentorInfoProfile = ({ nickname, name, role, experience, count, image }: MentorInfoProfileProps) => {
+const MentorInfoProfile = ({ nickname, name, jobCategory, detailedJob, experience, count, image }: MentorInfoProfileProps) => {
     return (
         <div className="text-white px-14 pb-10 pt-6">
             <div className="flex items-center">
@@ -18,7 +19,7 @@ const MentorInfoProfile = ({ nickname, name, role, experience, count, image }: M
                 />
                 <div className="ml-[20px]">
                     <p className="text-[16px] font-bold mb-[6px]">{nickname}</p>
-                    <p className="text-[12px]">{role}</p>
+                    <p className="text-[12px]">{jobCategory} | {detailedJob}</p>
                     <p className="text-[12px]">{experience}년차</p>
                 </div>
             </div>
diff --git a/src/user/components/profileInfo/MentorInfoTime.tsx b/src/user/components/profileInfo/MentorInfoTime.tsx
index 098ab6b..92d2fb4 100644
--- a/src/user/components/profileInfo/MentorInfoTime.tsx
+++ b/src/user/components/profileInfo/MentorInfoTime.tsx
@@ -1,17 +1,17 @@
 interface MentorInfoTimeProps {
-  availableDays: string[];
-  startTime: { period: string; hour: string; minute: string };
-  endTime: { period: string; hour: string; minute: string };
+  days: string[];
+  startTime: string;
+  endTime: string;
 }
 
-const MentorInfoTime = ({ availableDays, startTime, endTime }: MentorInfoTimeProps) => {
+const MentorInfoTime = ({ days, startTime, endTime }: MentorInfoTimeProps) => {
   return (
       <div className="px-4 my-2">
           <div className="font-bold text-[16px] my-4">선호 시간대</div>
 
           <div className="text-[14px] text-[#94939B] mb-2">요일</div>
           <div className="flex gap-2">
-              {availableDays.map((day, index) => (
+              {days.map((day, index) => (
                   <div key={index} className="border border-primary-1 text-black px-4 py-2 rounded-[10px] text-[16px]">
                       {day}
                   </div>
@@ -20,7 +20,7 @@ const MentorInfoTime = ({ availableDays, startTime, endTime }: MentorInfoTimePro
 
           <div className="text-[14px] text-[#94939B] mt-4 mb-2">시간대</div>
           <div className="w-[100%] text-left border border-primary-1 text-black px-4 py-3 rounded-[10px] text-[16px]">
-              {`${startTime.period} ${startTime.hour}:${startTime.minute} ~ ${endTime.period} ${endTime.hour}:${endTime.minute}`}
+              {`${startTime} ~ ${endTime}`}
           </div>
       </div>
   );
diff --git a/src/user/menteetypes.ts b/src/user/menteetypes.ts
index b86522f..6980844 100644
--- a/src/user/menteetypes.ts
+++ b/src/user/menteetypes.ts
@@ -10,7 +10,7 @@ export interface MenteeData {
     filePath: string;
   };
   introduction: {
-    summary: string;
-    bio: string;
+    title: string;
+    content: string;
   };
 }
\ No newline at end of file
diff --git a/src/user/pages/ProfileEdit/MenteeInfo.tsx b/src/user/pages/ProfileEdit/MenteeInfo.tsx
index 5b58432..cc91def 100644
--- a/src/user/pages/ProfileEdit/MenteeInfo.tsx
+++ b/src/user/pages/ProfileEdit/MenteeInfo.tsx
@@ -24,8 +24,8 @@ const MenteeInfo = () => {
         filePath: "",
       },
       introduction: {
-        summary: "광고 기획자를 꿈꾸는 열정넘치는 학생입니다!",
-        bio: "광고 기획자라는 점을 가지고 있는 상황에서 선배님들의 조언을 듣고 싶습니다",
+        title: "광고 기획자를 꿈꾸는 열정넘치는 학생입니다!",
+        content: "광고 기획자라는 점을 가지고 있는 상황에서 선배님들의 조언을 듣고 싶습니다",
       }
     };
   });
@@ -62,8 +62,8 @@ const MenteeInfo = () => {
 
         {/* 자기소개 */}
         <MenteeInfoBio 
-          summary={menteeData.introduction.summary}
-          bio={menteeData.introduction.bio}
+          title={menteeData.introduction.title}
+          content={menteeData.introduction.content}
         />
       </div>
 
diff --git a/src/user/pages/ProfileEdit/MenteeProfileEdit.tsx b/src/user/pages/ProfileEdit/MenteeProfileEdit.tsx
index 847e7ac..6d5b0f1 100644
--- a/src/user/pages/ProfileEdit/MenteeProfileEdit.tsx
+++ b/src/user/pages/ProfileEdit/MenteeProfileEdit.tsx
@@ -25,8 +25,8 @@ const MenteeProfileEdit = () => {
         filePath: "",
       },
       introduction: {
-        summary: "광고 기획자를 꿈꾸는 열정넘치는 학생입니다!",
-        bio: "광고 기획자라는 점을 가지고 있는 상황에서 선배님들의 조언을 듣고 싶습니다",
+        title: "광고 기획자를 꿈꾸는 열정넘치는 학생입니다!",
+        content: "광고 기획자라는 점을 가지고 있는 상황에서 선배님들의 조언을 듣고 싶습니다",
       }
     };
   });
@@ -39,8 +39,8 @@ const MenteeProfileEdit = () => {
 
   // 작성 완료 버튼 활성화 여부 확인
   const isFormComplete =
-    menteeData.introduction.summary.trim() !== "" &&
-    menteeData.introduction.bio.trim() !== "";
+    menteeData.introduction.title.trim() !== "" &&
+    menteeData.introduction.content.trim() !== "";
 
   return (
     <div className="h-screen flex flex-col relative overflow-hidden">
diff --git a/src/user/pages/ProfileEdit/MentorInfo.tsx b/src/user/pages/ProfileEdit/MentorInfo.tsx
index 5ab31b3..95bf9c2 100644
--- a/src/user/pages/ProfileEdit/MentorInfo.tsx
+++ b/src/user/pages/ProfileEdit/MentorInfo.tsx
@@ -25,7 +25,8 @@ const MentorInfo = () => {
       },
       organization: {
         name: "OO주식회사",
-        role: "브랜드 마케팅/카피라이팅",
+        jobCategory: "브랜드 마케팅",
+        detailedJob: "카피라이팅",
         experience: 6,
       },
       count: 716,
@@ -34,13 +35,13 @@ const MentorInfo = () => {
         filePath: "",
       },
       introduction: {
-        summary: "브랜드 마케팅에 대한 모든 것을 알려드립니다.",
-        bio: "안녕하세요!\n저는 OO대학교 경영학과를 졸업하고 현재 XXXX에 다니고 있는 ‘바이’입니다.",
+        title: "브랜드 마케팅에 대한 모든 것을 알려드립니다.",
+        content: "안녕하세요!\n저는 OO대학교 경영학과를 졸업하고 현재 XXXX에 다니고 있는 ‘바이’입니다.",
       },        
-      availableDays: ["월", "목"],
       timezone: {
-        startTime: { period: "오전", hour: "10", minute: "00"},
-        endTime: { period: "오후", hour: "18", minute: "00"},
+        days: ["월", "목"],
+        startTime: "09:00:00",
+        endTime: "17:00:00",
       },
       mentoringField: ["취업 준비", "커리어 고민"],        
       hashtags: ["마케팅", "브랜드마케팅", "이직", "취준", "진로고민상담", "면접노하우"],
@@ -79,7 +80,8 @@ const MentorInfo = () => {
           <MentorInfoProfile 
             nickname={mentorData.nickname} 
             name={mentorData.organization.name}
-            role={mentorData.organization.role} 
+            jobCategory={mentorData.organization.jobCategory}
+            detailedJob={mentorData.organization.detailedJob}
             experience={mentorData.organization.experience} 
             count={mentorData.count}
             image={mentorData?.image?.filePath || "/assets/ringusprofile.png"}
@@ -90,13 +92,13 @@ const MentorInfo = () => {
 
           {/* 자기소개 */}
           <MentorInfoBio 
-            summary={mentorData.introduction.summary}
-            bio={mentorData.introduction.bio}
+            title={mentorData.introduction.title}
+            content={mentorData.introduction.content}
           />
 
           {/* 선호 시간대 */}
           <MentorInfoTime
-            availableDays={mentorData.availableDays} 
+            days={mentorData.timezone.days} 
             startTime={mentorData.timezone.startTime} 
             endTime={mentorData.timezone.endTime} 
           />
diff --git a/src/user/pages/ProfileEdit/MentorProfileEdit.tsx b/src/user/pages/ProfileEdit/MentorProfileEdit.tsx
index 30b81ae..088e27d 100644
--- a/src/user/pages/ProfileEdit/MentorProfileEdit.tsx
+++ b/src/user/pages/ProfileEdit/MentorProfileEdit.tsx
@@ -27,7 +27,8 @@ const MentorProfileEdit = () => {
       },
       organization: {
         name: "OO주식회사",
-        role: "브랜드 마케팅/카피라이팅",
+        jobCategory: "브랜드 마케팅",
+        detailedJob: "카피라이팅",
         experience: 6,
       },
       count: 716,
@@ -36,13 +37,13 @@ const MentorProfileEdit = () => {
         filePath: "",
       },
       introduction: {
-        summary: "브랜드 마케팅에 대한 모든 것을 알려드립니다.",
-        bio: "안녕하세요!\n저는 OO대학교 경영학과를 졸업하고 현재 XXXX에 다니고 있는 ‘바이’입니다.",
+        title: "브랜드 마케팅에 대한 모든 것을 알려드립니다.",
+        content: "안녕하세요!\n저는 OO대학교 경영학과를 졸업하고 현재 XXXX에 다니고 있는 ‘바이’입니다.",
       },
-      availableDays: ["월", "목"],
       timezone: {
-        startTime: { period: "오전", hour: "10", minute: "00"},
-        endTime: { period: "오후", hour: "18", minute: "00"},
+        days: ["월", "목"],
+        startTime: "09:00:00",
+        endTime: "17:00:00",
       },
       mentoringField: ['취업 준비', '커리어 고민'],
       hashtags: ['마케팅', '브랜드마케팅'],
@@ -66,9 +67,9 @@ const MentorProfileEdit = () => {
 
   // 작성 완료 버튼 활성화 여부 확인
   const isFormComplete =
-    mentorData.introduction.summary.trim() !== '' &&
-    mentorData.introduction.bio.trim() !== '' &&
-    mentorData.availableDays.length > 0;
+    mentorData.introduction.title.trim() !== '' &&
+    mentorData.introduction.content.trim() !== '' &&
+    mentorData.timezone.days.length > 0;
 
   return (
     <div className="h-screen flex flex-col relative overflow-hidden">
diff --git a/src/user/types.ts b/src/user/types.ts
index 65dc339..35c88e7 100644
--- a/src/user/types.ts
+++ b/src/user/types.ts
@@ -1,45 +1,40 @@
 export interface MentorData {
   nickname: string;
-  email: string;
+  introduction: {
+    title: string;
+    content: string;
+  };
+  mentoringField: string[];
   education: {
     schoolName: string;
     major: string;
   };
   organization: {
     name: string;
-    role: string;
+    jobCategory: string;
+    detailedJob: string;
     experience: number;
   };
-  count: number;
-  image: {
-    fileName: string;
-    filePath: string;
-  };
-
-  introduction: {
-    summary: string;
-    bio: string;
-  };
-  availableDays: string[];
   timezone: {
-    startTime: {
-      period: string;
-      hour: string;
-      minute: string;
-    };
-    endTime: {
-      period: string;
-      hour: string;
-      minute: string;
-    };
+    days: string[];
+    startTime: string;
+    endTime: string;
   };
 
-  mentoringField: string[];
   hashtags: string[];
   message: string;
+
   portfolio: {
     url: string;
     description: string;
     size: number;
   }[];
+
+  image: {
+    fileName: string;
+    filePath: string;
+  };
+
+  count: number;
+  email: string;
 }

From 8260a969f9a9e9c4c25f185d079bbbeaa3ba0397 Mon Sep 17 00:00:00 2001
From: wnhaoo <153691178+wnhaoo@users.noreply.github.com>
Date: Sun, 23 Mar 2025 22:50:03 +0900
Subject: [PATCH 2/4] =?UTF-8?q?feat:=20=EB=A9=98=ED=86=A0/=EB=A9=98?=
 =?UTF-8?q?=ED=8B=B0=20=ED=94=84=EB=A1=9C=ED=95=84=20=EC=A1=B0=ED=9A=8C=20?=
 =?UTF-8?q?=EB=B0=8F=20=EC=88=98=EC=A0=95=20api=20=EC=97=B0=EA=B2=B0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/mentorship/pages/MentorInfoView.tsx       |  33 +++--
 src/user/api/MenteeInfoApi.ts                 |  28 ++++
 src/user/api/MentorInfoApi.ts                 |  33 +++++
 src/user/components/Mapping.ts                |  51 ++++++++
 src/user/components/ProfileEdit/EditBio.tsx   |  59 ++++-----
 .../components/ProfileEdit/EditFields.tsx     |  17 ++-
 .../components/ProfileEdit/EditHashtags.tsx   |  24 ++--
 .../components/ProfileEdit/EditMessage.tsx    |  13 +-
 .../components/ProfileEdit/EditPortfolio.tsx  | 121 +++++++++---------
 .../ProfileEdit/EditProfileSection.tsx        |   3 +-
 .../ProfileEdit/EditProfileSectionMentee.tsx  |   3 +-
 src/user/components/ProfileEdit/EditTime.tsx  |  90 ++++++++++---
 .../components/profileInfo/MenteeInfoBio.tsx  |  10 +-
 .../profileInfo/MenteeInfoProfile.tsx         |   4 +-
 .../profileInfo/MentorInfoPortfolio.tsx       |  26 ++--
 .../profileInfo/MentorInfoProfile.tsx         |   4 +-
 src/user/menteetypes.ts                       |   6 +-
 src/user/pages/ProfileEdit/MenteeInfo.tsx     |  41 +++---
 .../pages/ProfileEdit/MenteeProfileEdit.tsx   |  64 +++++----
 src/user/pages/ProfileEdit/MentorInfo.tsx     |  73 ++++-------
 .../pages/ProfileEdit/MentorProfileEdit.tsx   | 115 +++++++++--------
 src/user/types.ts                             |   6 +-
 22 files changed, 488 insertions(+), 336 deletions(-)
 create mode 100644 src/user/api/MenteeInfoApi.ts
 create mode 100644 src/user/api/MentorInfoApi.ts
 create mode 100644 src/user/components/Mapping.ts

diff --git a/src/mentorship/pages/MentorInfoView.tsx b/src/mentorship/pages/MentorInfoView.tsx
index a34bec8..16ac155 100644
--- a/src/mentorship/pages/MentorInfoView.tsx
+++ b/src/mentorship/pages/MentorInfoView.tsx
@@ -20,7 +20,11 @@ const MentorInfoView = () => {
     const savedData = localStorage.getItem("mentorData");
     return savedData ? JSON.parse(savedData) : {
       nickname: "바이",
-      email: "abcd@gmail.com",
+      introduction: {
+        title: "브랜드 마케팅에 대한 모든 것을 알려드립니다.",
+        content: "안녕하세요!\n저는 OO대학교 경영학과를 졸업하고 현재 XXXX에 다니고 있는 ‘바이’입니다.",
+      },        
+      mentoringField: ["취업 준비", "커리어 고민"],        
       education: {
         schoolName: "경북대학교",
         major: "컴퓨터공학",
@@ -31,30 +35,23 @@ const MentorInfoView = () => {
         detailedJob: "카피라이팅",
         experience: 6,
       },
-      count: 716,
-      image: {
-        fileName: "",
-        filePath: "",
-      },
-      introduction: {
-        title: "브랜드 마케팅에 대한 모든 것을 알려드립니다.",
-        content: "안녕하세요!\n저는 OO대학교 경영학과를 졸업하고 현재 XXXX에 다니고 있는 ‘바이’입니다.",
-      },        
       timezone: {
         days: ["월", "목"],
         startTime: "09:00:00",
         endTime: "17:00:00",
       },
-      mentoringField: ["취업 준비", "커리어 고민"],        
       hashtags: ["마케팅", "브랜드마케팅", "이직", "취준", "진로고민상담", "면접노하우"],
       message: "안녕하세요, 멘티 여러분!\n브랜드 마케팅 경험을 바탕으로 여러분의 성장을 지원하고 싶습니다.",
-      portfolio: [
-        {
-          url: "https://example.com/portfolio1.pdf",
-          description: "브랜드 마케팅 포트폴리오.pdf",
-          size: 25,
-        },
-      ],
+      portfolio: {
+        url: 'https://example.com/portfolio1.pdf',
+        description: '브랜드 마케팅 포트폴리오.pdf',
+        size: 8000000,
+      },
+      image: {
+        fileName: "",
+        filePath: "",
+      },
+      count: 716,
     };
   });
 
diff --git a/src/user/api/MenteeInfoApi.ts b/src/user/api/MenteeInfoApi.ts
new file mode 100644
index 0000000..e1f9115
--- /dev/null
+++ b/src/user/api/MenteeInfoApi.ts
@@ -0,0 +1,28 @@
+import { MenteeData } from "../menteetypes";
+import axiosInstance from "@/global/api/axiosInstance";
+
+// 멘티 프로필 조회 API
+export const getMenteeProfile = async (): Promise<MenteeData> => {
+  const response = await axiosInstance.get('/v1/mentee/me');
+  const data = response.data.data;
+  
+  console.log('멘티 프로필 응답:', response.data);
+
+  return {
+    nickname: data.nickname ?? '',
+    education: data.education ?? {
+      schoolName: '',
+      major: '',
+    },
+    introduction: data.introduction ?? '',
+    image: data.image ?? {
+      filePath: '',
+    },
+  };
+};
+
+// 멘티 프로필 수정 API
+export const updateMenteeProfile = async (menteeData: MenteeData): Promise<any> => {
+  const response = await axiosInstance.put('/v1/mentee', menteeData);
+  return response.data;
+};
\ No newline at end of file
diff --git a/src/user/api/MentorInfoApi.ts b/src/user/api/MentorInfoApi.ts
new file mode 100644
index 0000000..f27d77d
--- /dev/null
+++ b/src/user/api/MentorInfoApi.ts
@@ -0,0 +1,33 @@
+import { MentorData } from '../types';
+import axiosInstance from '@/global/api/axiosInstance';
+
+// 멘토 프로필 조회 API
+export const getMentorProfile = async (): Promise<MentorData> => {
+  const response = await axiosInstance.get('/v1/mentor/me');
+  const data = response.data.data;
+
+  return {
+    nickname: data.nickname ?? '',
+    education: data.education ?? { schoolName: '', major: '' },
+    organization: data.organization ?? {
+      name: '',
+      jobCategory: '',
+      detailedJob: '',
+      experience: 0,
+    },
+    introduction: data.introduction ?? { title: '', content: '' },
+    timezone: data.timezone ?? { days: [], startTime: '', endTime: '' },
+    mentoringField: data.mentoringField ?? [],
+    hashtags: data.hashtags ?? [],
+    message: data.message ?? '',
+    portfolio: data.portfolio ?? { url: '', description: '', size: 0 },
+    image: data.image ?? { fileName: '', filePath: '' },
+    count: data.count ?? 0,
+  };
+};
+
+// 멘토 프로필 수정 API
+export const updateMentorProfile = async (mentorData: MentorData): Promise<any> => {
+  const response = await axiosInstance.put('/v1/mentor', mentorData);
+  return response.data;
+};
\ No newline at end of file
diff --git a/src/user/components/Mapping.ts b/src/user/components/Mapping.ts
new file mode 100644
index 0000000..acc3f9b
--- /dev/null
+++ b/src/user/components/Mapping.ts
@@ -0,0 +1,51 @@
+import { jobCategoryMapping, detailedJobMapping } from "@/global/components/JobCategories";
+
+// 직무 (한글로)
+export const reverseJobCategoryMapping: { [key: string]: string } = Object.entries(jobCategoryMapping)
+  .reduce((acc, [kor, eng]) => {
+    acc[eng] = kor;
+    return acc;
+  }, {} as { [key: string]: string });
+
+
+// 세부 직무 (한글로)
+export const reverseDetailedJobMapping: { [key: string]: string } = Object.entries(detailedJobMapping)
+  .reduce((acc, [kor, eng]) => {
+    acc[eng] = kor;
+    return acc;
+  }, {} as { [key: string]: string });
+
+
+
+// 멘토링 분야 (영어로)
+export const mentoringFieldMapping: Record<string, string> = {
+  '취업 준비': 'JOB_PREPARATION',
+  '면접 대비': 'INTERVIEW_PREPARATION',
+  '업계 동향': 'PRACTICAL_SKILLS',
+  '커리어 고민': 'PORTFOLIO',
+};
+
+// 멘토링 분야 (한글로)
+export const reverseMentoringFieldMapping: Record<string, string> = Object.entries(mentoringFieldMapping).reduce((acc, [kor, eng]) => {
+  acc[eng] = kor;
+  return acc;
+}, {} as Record<string, string>);
+
+
+
+// 요일 (영어로)
+export const dayMapping: Record<string, string> = {
+  '월': 'MON',
+  '화': 'TUE',
+  '수': 'WED',
+  '목': 'THU',
+  '금': 'FRI',
+  '토': 'SAT',
+  '일': 'SUN',
+};
+
+// 요일 (한글로)
+export const reverseDayMapping: Record<string, string> = Object.entries(dayMapping).reduce((acc, [kor, eng]) => {
+  acc[eng] = kor;
+  return acc;
+}, {} as Record<string, string>);
\ No newline at end of file
diff --git a/src/user/components/ProfileEdit/EditBio.tsx b/src/user/components/ProfileEdit/EditBio.tsx
index 486e48d..782d4f7 100644
--- a/src/user/components/ProfileEdit/EditBio.tsx
+++ b/src/user/components/ProfileEdit/EditBio.tsx
@@ -3,67 +3,59 @@ import { MenteeData } from '@/user/menteetypes';
 
 interface EditBioProps {
   mentorData?: MentorData;
-  setMentorData?: React.Dispatch<React.SetStateAction<MentorData>>;
+  setMentorData?: React.Dispatch<React.SetStateAction<MentorData | null>>;
   menteeData?: MenteeData;
   setMenteeData?: React.Dispatch<React.SetStateAction<MenteeData>>;
 }
 
 const EditBio = ({ mentorData, setMentorData, menteeData, setMenteeData }: EditBioProps) => {
-
   if (!mentorData && !menteeData) return null;
 
   return (
     <div className="px-4 my-2">
       <div className="font-bold text-[16px] my-4">자기소개</div>
 
-      {/* 한줄소개 */}
-      <textarea
-        className="w-full px-5 py-4 border-[1px] border-[#D9D7E0] rounded-[10px] text-[14px] resize-none outline-none focus:border-primary-1"
-        rows={1}
-        value={
-          mentorData?.introduction.title ||
-          menteeData?.introduction.title ||
-          ''
-        }
-        onChange={(e) => {
-          if (mentorData && setMentorData) {
+      {/* 한줄소개 (멘토 전용) */}
+      {mentorData && setMentorData && (
+        <textarea
+          className="w-full px-5 py-4 border-[1px] border-[#D9D7E0] rounded-[10px] text-[14px] resize-none outline-none focus:border-primary-1"
+          rows={1}
+          value={mentorData.introduction.title}
+          onChange={(e) =>
             setMentorData({
               ...mentorData,
               introduction: {
                 ...mentorData.introduction,
                 title: e.target.value,
               },
-            });
-          } else if (menteeData && setMenteeData) {
-            setMenteeData({
-              ...menteeData,
-              introduction: {
-                ...menteeData.introduction,
-                title: e.target.value,
-              },
-            });
+            })
           }
-        }}
-        placeholder="한줄 소개를 작성하세요."
-        maxLength={30}
-      />
+          placeholder="한줄 소개를 작성하세요."
+          maxLength={30}
+        />
+      )}
 
       {/* 자기소개 */}
       <textarea
         className="w-full min-h-[250px] px-5 py-4 mt-2 border-[1px] border-[#D9D7E0] rounded-[10px] text-[14px] resize-none outline-none focus:border-primary-1"
         value={
-          mentorData?.introduction.content || menteeData?.introduction.content || ''
+          mentorData?.introduction.content ?? menteeData?.introduction ?? ''
         }
         onChange={(e) => {
+          const value = e.target.value;
+
           if (mentorData && setMentorData) {
             setMentorData({
               ...mentorData,
-              introduction: { ...mentorData.introduction, content: e.target.value },
+              introduction: {
+                ...mentorData.introduction,
+                content: value,
+              },
             });
           } else if (menteeData && setMenteeData) {
             setMenteeData({
               ...menteeData,
-              introduction: { ...menteeData.introduction, content: e.target.value },
+              introduction: value,
             });
           }
         }}
@@ -72,12 +64,13 @@ const EditBio = ({ mentorData, setMentorData, menteeData, setMenteeData }: EditB
       />
 
       <p className="text-right text-[#94939B] text-[14px] mt-1">
-        {(mentorData?.introduction?.content?.length || 
-          menteeData?.introduction?.content?.length || 0)} 
-          / 500
+        {(mentorData?.introduction?.content?.length ??
+          menteeData?.introduction?.length ??
+          0)}{' '}
+        / 500
       </p>
     </div>
   );
 };
 
-export default EditBio;
+export default EditBio;
\ No newline at end of file
diff --git a/src/user/components/ProfileEdit/EditFields.tsx b/src/user/components/ProfileEdit/EditFields.tsx
index cb1fad2..54b95eb 100644
--- a/src/user/components/ProfileEdit/EditFields.tsx
+++ b/src/user/components/ProfileEdit/EditFields.tsx
@@ -2,17 +2,20 @@ import { MentorData } from '@/user/types';
 
 interface EditFieldsProps {
   mentorData: MentorData;
-  setMentorData: React.Dispatch<React.SetStateAction<MentorData>>;
+  setMentorData: React.Dispatch<React.SetStateAction<MentorData | null>>;
 }
 
 const EditFields = ({ mentorData, setMentorData }: EditFieldsProps) => {
   const toggleSelection = (field: string) => {
-    setMentorData((prev) => ({
-      ...prev,
-      mentoringField: prev.mentoringField.includes(field)
-        ? prev.mentoringField.filter((f) => f !== field)
-        : [...prev.mentoringField, field],
-    }));
+    setMentorData((prev) => {
+      if (!prev) return prev;
+      return {
+        ...prev,
+        mentoringField: prev.mentoringField.includes(field)
+          ? prev.mentoringField.filter((f) => f !== field)
+          : [...prev.mentoringField, field],
+      };
+    });
   };
 
   const fields = [
diff --git a/src/user/components/ProfileEdit/EditHashtags.tsx b/src/user/components/ProfileEdit/EditHashtags.tsx
index 1fb2c2d..50c5571 100644
--- a/src/user/components/ProfileEdit/EditHashtags.tsx
+++ b/src/user/components/ProfileEdit/EditHashtags.tsx
@@ -5,7 +5,7 @@ import { Plus } from 'lucide-react';
 
 interface EditHashtagsProps {
   mentorData: MentorData;
-  setMentorData: React.Dispatch<React.SetStateAction<MentorData>>;
+  setMentorData: React.Dispatch<React.SetStateAction<MentorData | null>>;
 }
 
 const EditHashtags = ({ mentorData, setMentorData }: EditHashtagsProps) => {
@@ -25,20 +25,26 @@ const EditHashtags = ({ mentorData, setMentorData }: EditHashtagsProps) => {
       return;
     }
     if (!mentorData.hashtags.includes(trimmedTag)) {
-      setMentorData((prev) => ({
-        ...prev,
-        hashtags: [...prev.hashtags, trimmedTag],
-      }));
+      setMentorData((prev) => {
+        if (!prev) return prev;
+        return {
+          ...prev,
+          hashtags: [...prev.hashtags, trimmedTag],
+        };
+      });
       setNewTag('');
     }
   };
 
   // 해시태그 삭제
   const removeHashtag = (tag: string) => {
-    setMentorData((prev) => ({
-      ...prev,
-      hashtags: prev.hashtags.filter((t) => t !== tag),
-    }));
+    setMentorData((prev) => {
+      if (!prev) return prev;
+      return {
+        ...prev,
+        hashtags: prev.hashtags.filter((t) => t !== tag),
+      };
+    });
   };
 
   return (
diff --git a/src/user/components/ProfileEdit/EditMessage.tsx b/src/user/components/ProfileEdit/EditMessage.tsx
index 5196d60..9a524de 100644
--- a/src/user/components/ProfileEdit/EditMessage.tsx
+++ b/src/user/components/ProfileEdit/EditMessage.tsx
@@ -2,7 +2,7 @@ import { MentorData } from '@/user/types';
 
 interface EditMessageProps {
   mentorData: MentorData;
-  setMentorData: React.Dispatch<React.SetStateAction<MentorData>>;
+  setMentorData: React.Dispatch<React.SetStateAction<MentorData | null>>;
 }
 
 const EditMessage = ({ mentorData, setMentorData }: EditMessageProps) => {
@@ -13,10 +13,13 @@ const EditMessage = ({ mentorData, setMentorData }: EditMessageProps) => {
         className="w-full min-h-[150px] px-5 py-4 border-[1px] border-[#D9D7E0] rounded-[10px] text-[14px] resize-none outline-none focus:border-primary-1"
         value={mentorData.message}
         onChange={(e) =>
-          setMentorData((prev) => ({
-            ...prev,
-            message: e.target.value,
-          }))
+          setMentorData((prev) => {
+            if (!prev) return prev;
+            return {
+              ...prev,
+              message: e.target.value,
+            };
+          })
         }
         placeholder="멘티에게 전하고 싶은 말을 작성하세요."
         maxLength={200}
diff --git a/src/user/components/ProfileEdit/EditPortfolio.tsx b/src/user/components/ProfileEdit/EditPortfolio.tsx
index 7cfb01c..934f7ef 100644
--- a/src/user/components/ProfileEdit/EditPortfolio.tsx
+++ b/src/user/components/ProfileEdit/EditPortfolio.tsx
@@ -3,84 +3,84 @@ import { X } from 'lucide-react';
 
 interface EditPortfolioProps {
   mentorData: MentorData;
-  setMentorData: React.Dispatch<React.SetStateAction<MentorData>>;
+  setMentorData: React.Dispatch<React.SetStateAction<MentorData | null>>;
 }
 
 const EditPortfolio = ({ mentorData, setMentorData }: EditPortfolioProps) => {
-  // 파일 업로드 (30MB 이하 파일만 허용)
-  const handleFileUpload = (e: React.ChangeEvent<HTMLInputElement>) => {
-    if (e.target.files) {
-      const newFiles = Array.from(e.target.files);
+  
+  // 파일 삭제
+  const removeFile = () => {
+    setMentorData((prev) => {
+      if (!prev) return prev;
+      return {
+        ...prev,
+        portfolio: null,
+      };
+    });
+  };
 
-      // 30MB 초과하는 파일이 있는지 확인
-      const validFiles = newFiles.filter(
-        (file) => file.size <= 30 * 1024 * 1024,
-      );
-      const invalidFiles = newFiles.filter(
-        (file) => file.size > 30 * 1024 * 1024,
-      );
+  // 파일 업로드 (10MB 이하 파일만 허용)
+  const handleFileUpload = (e: React.ChangeEvent<HTMLInputElement>) => {
+    if (e.target.files && e.target.files.length > 0) {
+      const file = e.target.files[0];
 
-      if (invalidFiles.length > 0) {
-        alert('30MB 이하의 파일만 업로드할 수 있습니다.');
+      // 10MB 초과하면 업로드 차단
+      if (file.size > 10 * 1000 * 1000) {
+        alert('10MB 이하의 파일만 업로드할 수 있습니다.');
+        e.target.value = ''; // 파일 선택 초기화
+        return;
       }
 
-      // 유효한 파일만 mentorData에 추가
-      setMentorData((prev) => ({
-        ...prev,
-        portfolio: [
-          ...prev.portfolio,
-          ...validFiles.map((file) => ({
+      // 기존 파일이 있으면 삭제 후 새 파일 업로드
+      removeFile();
+
+      setMentorData((prev) => {
+        if (!prev) return prev;
+        return {
+          ...prev,
+          portfolio: {
             url: URL.createObjectURL(file),
             description: file.name,
             size: file.size,
-          })),
-        ],
-      }));
+          },
+        };
+      });
     }
   };
 
-  // 파일 열기 (파일명을 클릭했을 때)
-  const openFile = (fileUrl: string) => {
-    window.open(fileUrl, '_blank');
-  };
-
-  // 파일 삭제
-  const removeFile = (index: number) => {
-    setMentorData((prev) => ({
-      ...prev,
-      portfolio: prev.portfolio.filter((_, i) => i !== index),
-    }));
+  // 파일 열기
+  const openFile = () => {
+    if (mentorData.portfolio) {
+      window.open(mentorData.portfolio.url, '_blank');
+    }
   };
 
   return (
     <div className="px-4 my-2">
       <div className="font-bold text-[16px] my-4">포트폴리오</div>
 
-      {/* 업로드된 파일 목록 */}
-      <div className="mt-2 space-y-2">
-        {mentorData.portfolio.map((file, index) => (
-          <div
-            key={index}
-            className="bg-[#F2F2F6] rounded-[10px] px-5 py-3 text-[12px] flex justify-between items-center cursor-pointer"
-            onClick={() => openFile(file.url)}
-          >
-            <div>
-              <span>{file.description}</span>
-              <span className="text-[#94939B] ml-1">
-                ({(file.size / 1000000).toFixed(1)}MB)
-              </span>
-            </div>
-            <button
-              onClick={(e) => {
-                e.stopPropagation();
-                removeFile(index);
-              }}
-            >
-              <X size={16} strokeWidth={1.0} />
-            </button>
+      {/* 업로드된 파일이 있을 경우 표시 */}
+      {mentorData.portfolio && (
+        <div
+          className="bg-[#F2F2F6] rounded-[10px] px-5 py-3 text-[12px] flex justify-between items-center cursor-pointer"
+          onClick={openFile}
+        >
+          <div>
+            <span>{mentorData.portfolio.description}</span>
+            <span className="text-[#94939B] ml-1">
+              ({(mentorData.portfolio.size / 1000000).toFixed(1)}MB)
+            </span>
           </div>
-        ))}
-      </div>
+          <button
+            onClick={(e) => {
+              e.stopPropagation();
+              removeFile();
+            }}
+          >
+            <X size={16} strokeWidth={1.0} />
+          </button>
+        </div>
+      )}
 
       {/* 파일 업로드 버튼 */}
       <div className="mt-3">
@@ -89,16 +89,15 @@ const EditPortfolio = ({ mentorData, setMentorData }: EditPortfolioProps) => {
           <input
             type="file"
             className="hidden"
-            multiple
             onChange={handleFileUpload}
           />
         </label>
         <div className="text-[12px] text-[#A0A0A0] mt-2">
-          첨부 파일은 최대 30MB까지 등록 가능합니다.
+          첨부 파일은 최대 10MB까지 등록 가능합니다.
         </div>
       </div>
     </div>
   );
 };
 
-export default EditPortfolio;
+export default EditPortfolio;
\ No newline at end of file
diff --git a/src/user/components/ProfileEdit/EditProfileSection.tsx b/src/user/components/ProfileEdit/EditProfileSection.tsx
index 8c59ff1..9ac74ed 100644
--- a/src/user/components/ProfileEdit/EditProfileSection.tsx
+++ b/src/user/components/ProfileEdit/EditProfileSection.tsx
@@ -9,7 +9,6 @@ import EditImageModal from "./EditImageModal";
 interface EditProfileSectionProps {
   mentorData: {
     nickname: string;
-    email: string;
     education: {
       schoolName: string;
       major: string;
@@ -103,7 +102,7 @@ const EditProfileSection = ({ mentorData, setMentorData }: EditProfileSectionPro
                 color="#94939b"
                 className="mr-3"
               />
-              <span className="text-[#94939B] text-[14px]">{mentorData.email}</span>
+              <span className="text-[#94939B] text-[14px]"></span>
             </div>
           </div>
         </div>
diff --git a/src/user/components/ProfileEdit/EditProfileSectionMentee.tsx b/src/user/components/ProfileEdit/EditProfileSectionMentee.tsx
index b1092da..1a374cb 100644
--- a/src/user/components/ProfileEdit/EditProfileSectionMentee.tsx
+++ b/src/user/components/ProfileEdit/EditProfileSectionMentee.tsx
@@ -9,7 +9,6 @@ import EditImageModal from "./EditImageModal";
 interface EditProfileSectionMenteeProps {
   menteeData: {
     nickname: string;
-    email: string;
     education: {
       schoolName: string;
       major: string;
@@ -97,7 +96,7 @@ const EditProfileSectionMentee = ({ menteeData, setMenteeData }: EditProfileSect
                 color="#94939b"
                 className="mr-3"
               />
-              <span className="text-[#94939B] text-[14px]">{menteeData.email}</span>
+              <span className="text-[#94939B] text-[14px]"></span>
             </div>
           </div>
         </div>
diff --git a/src/user/components/ProfileEdit/EditTime.tsx b/src/user/components/ProfileEdit/EditTime.tsx
index d02260c..0e7c1b8 100644
--- a/src/user/components/ProfileEdit/EditTime.tsx
+++ b/src/user/components/ProfileEdit/EditTime.tsx
@@ -6,7 +6,7 @@ import { ChevronDown } from 'lucide-react';
 
 interface EditTimeProps {
   mentorData: MentorData;
-  setMentorData: React.Dispatch<React.SetStateAction<MentorData>>;
+  setMentorData: React.Dispatch<React.SetStateAction<MentorData | null>>;
 }
 
 const EditTime = ({ mentorData, setMentorData }: EditTimeProps) => {
@@ -26,27 +26,33 @@ const EditTime = ({ mentorData, setMentorData }: EditTimeProps) => {
 
   // 시간 저장
   const handleSaveTime = () => {
-    setMentorData((prev) => ({
-      ...prev,
-      timezone: {
-        ...prev.timezone,
-        startTime: `${String(startHour).padStart(2, '0')}:${String(startMinute).padStart(2, '0')}:00`,
-        endTime: `${String(endHour).padStart(2, '0')}:${String(endMinute).padStart(2, '0')}:00`,
-      },
-    }));
+    setMentorData((prev) => {
+      if (!prev) return prev;
+      return {
+        ...prev,
+        timezone: {
+          ...prev.timezone,
+          startTime: `${String(startHour).padStart(2, '0')}:${String(startMinute).padStart(2, '0')}:00`,
+          endTime: `${String(endHour).padStart(2, '0')}:${String(endMinute).padStart(2, '0')}:00`,
+        },
+      };
+    });
   };
   
   // 요일 선택
   const toggleSelection = (day: string) => {
-    setMentorData((prev) => ({
-      ...prev,
-      timezone: {
-        ...prev.timezone,
-        days: prev.timezone.days.includes(day)
+    setMentorData((prev) => {
+      if (!prev) return prev;
+      return {
+        ...prev,
+        timezone: {
+          ...prev.timezone,
+          days: prev.timezone.days.includes(day)
           ? prev.timezone.days.filter((d) => d !== day)
           : [...prev.timezone.days, day],
-      },
-    }));
+        }
+      };
+    });
   };
 
   return (
@@ -84,13 +90,57 @@ const EditTime = ({ mentorData, setMentorData }: EditTimeProps) => {
         isOpen={isModalOpen}
         onClose={() => setIsModalOpen(false)}
         startHour={startHour}
-        setStartHour={(value) => setMentorData((prev) => ({ ...prev, timezone: { ...prev.timezone, startTime: `${String(value).padStart(2, '0')}:${startMinute}:00` } }))}
+        setStartHour={(value) =>
+          setMentorData((prev) => {
+            if (!prev) return prev;
+            return {
+              ...prev,
+              timezone: {
+                ...prev.timezone,
+                startTime: `${String(value).padStart(2, '0')}:${String(startMinute).padStart(2, '0')}:00`,
+              },
+            } as MentorData;
+          })
+        }
         startMinute={startMinute}
-        setStartMinute={(value) => setMentorData((prev) => ({ ...prev, timezone: { ...prev.timezone, startTime: `${startHour}:${String(value).padStart(2, '0')}:00` } }))}
+        setStartMinute={(value) =>
+          setMentorData((prev) => {
+            if (!prev) return prev;
+            return {
+              ...prev,
+              timezone: {
+                ...prev.timezone,
+                startTime: `${String(startHour).padStart(2, '0')}:${String(value).padStart(2, '0')}:00`,
+              },
+            } as MentorData;
+          })
+        }
         endHour={endHour}
-        setEndHour={(value) => setMentorData((prev) => ({ ...prev, timezone: { ...prev.timezone, endTime: `${String(value).padStart(2, '0')}:${endMinute}:00` } }))}
+        setEndHour={(value) =>
+          setMentorData((prev) => {
+            if (!prev) return prev;
+            return {
+              ...prev,
+              timezone: {
+                ...prev.timezone,
+                endTime: `${String(value).padStart(2, '0')}:${String(endMinute).padStart(2, '0')}:00`,
+              },
+            } as MentorData;
+          })
+        }
         endMinute={endMinute}
-        setEndMinute={(value) => setMentorData((prev) => ({ ...prev, timezone: { ...prev.timezone, endTime: `${endHour}:${String(value).padStart(2, '0')}:00` } }))}
+        setEndMinute={(value) =>
+          setMentorData((prev) => {
+            if (!prev) return prev;
+            return {
+              ...prev,
+              timezone: {
+                ...prev.timezone,
+                endTime: `${String(endHour).padStart(2, '0')}:${String(value).padStart(2, '0')}:00`,
+              },
+            } as MentorData;
+          })
+        }
         onSave={handleSaveTime}
       />
     </div>
diff --git a/src/user/components/profileInfo/MenteeInfoBio.tsx b/src/user/components/profileInfo/MenteeInfoBio.tsx
index 138182a..c1f0757 100644
--- a/src/user/components/profileInfo/MenteeInfoBio.tsx
+++ b/src/user/components/profileInfo/MenteeInfoBio.tsx
@@ -1,13 +1,11 @@
 interface MenteeInfoBioProps {
-  title: string;
-  content: string;
+  introduction: string;
 }
 
-const MenteeInfoBio = ({ title, content }: MenteeInfoBioProps) => {
+const MenteeInfoBio = ({ introduction }: MenteeInfoBioProps) => {
   return (
-    <div className="px-4 my-2">
-      <div className="font-bold text-[16px] my-7 text-center">{title}</div>
-      <div className="bg-[#F2F2F6] rounded-[10px] px-5 py-4 text-[14px] whitespace-pre-line mb-10">{content}</div>
+    <div className="px-4 my-8">
+      <div className="bg-[#F2F2F6] rounded-[10px] px-5 py-4 text-[14px] whitespace-pre-line mb-10">{introduction}</div>
     </div>
   );
 };
diff --git a/src/user/components/profileInfo/MenteeInfoProfile.tsx b/src/user/components/profileInfo/MenteeInfoProfile.tsx
index 981e496..17da037 100644
--- a/src/user/components/profileInfo/MenteeInfoProfile.tsx
+++ b/src/user/components/profileInfo/MenteeInfoProfile.tsx
@@ -1,12 +1,11 @@
 interface MenteeInfoProfileProps {
   nickname: string;
-  email: string;
   schoolName: string;
   major: string;
   image: string;
 }
 
-const MenteeInfoProfile = ({ nickname, email, schoolName, major, image}: MenteeInfoProfileProps) => {
+const MenteeInfoProfile = ({ nickname, schoolName, major, image}: MenteeInfoProfileProps) => {
     return (
         <div className="text-white px-10 pb-10 pt-6">
             <div className="flex items-center">
@@ -17,7 +16,6 @@ const MenteeInfoProfile = ({ nickname, email, schoolName, major, image}: MenteeI
                 />
                 <div className="ml-[20px]">
                     <p className="text-[16px] font-bold mb-[6px]">{nickname}</p>
-                    <p className="text-[14px] font-[300]">{email}</p>
                 </div>
             </div>
 
diff --git a/src/user/components/profileInfo/MentorInfoPortfolio.tsx b/src/user/components/profileInfo/MentorInfoPortfolio.tsx
index eb2a515..e30c7a3 100644
--- a/src/user/components/profileInfo/MentorInfoPortfolio.tsx
+++ b/src/user/components/profileInfo/MentorInfoPortfolio.tsx
@@ -1,5 +1,5 @@
 interface MentorInfoPortfolioProps {
-    portfolio: { url: string; description: string; size: number }[];
+    portfolio: { url: string; description: string; size: number } | null;
 }
 
 const MentorInfoPortfolio = ({ portfolio }: MentorInfoPortfolioProps) => {
@@ -7,21 +7,21 @@ const MentorInfoPortfolio = ({ portfolio }: MentorInfoPortfolioProps) => {
     const openFile = (fileUrl: string) => {
         window.open(fileUrl, "_blank");
     };
-  
+
+    // 포트폴리오가 없으면 렌더링 안 함
+    if (!portfolio) return null;
+
     return (
         <div className="px-4 my-2">
             <div className="font-bold text-[16px] my-4">포트폴리오</div>
-            <div className="mt-2 space-y-2">
-                {portfolio.map((file, index) => (
-                    <div
-                        key={index}
-                        className="bg-[#F2F2F6] rounded-[10px] px-5 py-3 text-[12px] flex items-center cursor-pointer"
-                        onClick={() => openFile(file.url)}
-                    >
-                        <span>{file.description}</span>
-                        <span className="text-[#94939B] ml-1">({file.size.toFixed(1)}MB)</span>
-                    </div>
-                ))}
+            <div
+                className="bg-[#F2F2F6] rounded-[10px] px-5 py-3 text-[12px] flex items-center cursor-pointer"
+                onClick={() => openFile(portfolio.url)}
+            >
+                <span>{portfolio.description}</span>
+                <span className="text-[#94939B] ml-1">
+                    ({(portfolio.size / 1000000).toFixed(1)}MB)
+                </span>
             </div>
         </div>
     );
diff --git a/src/user/components/profileInfo/MentorInfoProfile.tsx b/src/user/components/profileInfo/MentorInfoProfile.tsx
index 00d1256..64ecdf1 100644
--- a/src/user/components/profileInfo/MentorInfoProfile.tsx
+++ b/src/user/components/profileInfo/MentorInfoProfile.tsx
@@ -19,8 +19,8 @@ const MentorInfoProfile = ({ nickname, name, jobCategory, detailedJob, experienc
                 />
                 <div className="ml-[20px]">
                     <p className="text-[16px] font-bold mb-[6px]">{nickname}</p>
-                    <p className="text-[12px]">{jobCategory} | {detailedJob}</p>
-                    <p className="text-[12px]">{experience}년차</p>
+                    <p className="text-[12px]">{name}</p>
+                    <p className="text-[12px]">{jobCategory} | {detailedJob} | {experience}년차</p>
                 </div>
             </div>
 
diff --git a/src/user/menteetypes.ts b/src/user/menteetypes.ts
index 6980844..fbc82c1 100644
--- a/src/user/menteetypes.ts
+++ b/src/user/menteetypes.ts
@@ -1,16 +1,12 @@
 export interface MenteeData {
   nickname: string;
-  email: string;
   education: {
     schoolName: string;
     major: string;
   };
+  introduction: string;
   image: {
     fileName: string;
     filePath: string;
   };
-  introduction: {
-    title: string;
-    content: string;
-  };
 }
\ No newline at end of file
diff --git a/src/user/pages/ProfileEdit/MenteeInfo.tsx b/src/user/pages/ProfileEdit/MenteeInfo.tsx
index cc91def..1c3913c 100644
--- a/src/user/pages/ProfileEdit/MenteeInfo.tsx
+++ b/src/user/pages/ProfileEdit/MenteeInfo.tsx
@@ -1,34 +1,33 @@
-import { useState } from 'react';
+import { useState, useEffect } from 'react';
 import { useNavigate } from 'react-router-dom';
 import { ArrowLeft } from 'lucide-react';
 import { GlobalButton } from '@/global/ui/GlobalButton';
 
+import { getMenteeProfile } from '@/user/api/MenteeInfoApi';
+import { MenteeData } from '@/user/menteetypes';
+
 import MenteeInfoProfile from '@/user/components/profileInfo/MenteeInfoProfile';
 import MenteeInfoBio from '@/user/components/profileInfo/MenteeInfoBio';
 
 const MenteeInfo = () => {
   const navigate = useNavigate();
+  const [menteeData, setMenteeData] = useState<MenteeData | null>(null);
 
-  // 테스트용 멘티 데이터 && localStorage에서 데이터 불러오기 (api 연결시 제거)
-  const [menteeData, setMenteeData] = useState(() => {
-    const savedData = localStorage.getItem("menteeData");
-    return savedData ? JSON.parse(savedData) : {
-      nickname: "김멘티",
-      email: "kimtee@gmail.com",
-      education: {
-        schoolName: "경북대학교 · 석사",
-        major: "심리학과 · 경영학과",
-      },
-      image: {
-        fileName: "",
-        filePath: "",
-      },
-      introduction: {
-        title: "광고 기획자를 꿈꾸는 열정넘치는 학생입니다!",
-        content: "광고 기획자라는 점을 가지고 있는 상황에서 선배님들의 조언을 듣고 싶습니다",
+  useEffect(() => {
+    const fetchData = async () => {
+      try {
+        const data = await getMenteeProfile();
+        setMenteeData(data);
+      } catch (error) {
+        console.error('멘티 정보 로딩 실패:', error);
       }
     };
-  });
+    fetchData();
+  }, []);
+
+  if (!menteeData) {
+    return <div className="p-4">Loading...</div>;
+  }
 
   return (
     <div className="h-screen flex flex-col relative overflow-hidden">
@@ -53,7 +52,6 @@ const MenteeInfo = () => {
           {/* 프로필 섹션 */}
           <MenteeInfoProfile 
             nickname={menteeData.nickname}
-            email={menteeData.email}
             schoolName={menteeData.education.schoolName}
             major={menteeData.education.major}
             image={menteeData.image.filePath}
@@ -62,8 +60,7 @@ const MenteeInfo = () => {
 
         {/* 자기소개 */}
         <MenteeInfoBio 
-          title={menteeData.introduction.title}
-          content={menteeData.introduction.content}
+          introduction={menteeData.introduction}
         />
       </div>
 
diff --git a/src/user/pages/ProfileEdit/MenteeProfileEdit.tsx b/src/user/pages/ProfileEdit/MenteeProfileEdit.tsx
index 6d5b0f1..68531f9 100644
--- a/src/user/pages/ProfileEdit/MenteeProfileEdit.tsx
+++ b/src/user/pages/ProfileEdit/MenteeProfileEdit.tsx
@@ -2,6 +2,8 @@ import { useState, useEffect } from "react";
 import { useNavigate } from 'react-router-dom';
 import { ArrowLeft } from "lucide-react";
 
+import { getMenteeProfile, updateMenteeProfile } from "@/user/api/MenteeInfoApi";
+
 import { MenteeData } from "@/user/menteetypes";
 import EditProfileSectionMentee from "@/user/components/ProfileEdit/EditProfileSectionMentee";
 import EditBio from "@/user/components/ProfileEdit/EditBio";
@@ -9,38 +11,49 @@ import { GlobalButton } from "@/global/ui/GlobalButton";
 
 const MenteeProfileEdit = () => {
   const navigate = useNavigate();
+  const [menteeData, setMenteeData] = useState<MenteeData>({
+    nickname: '',
+    education: {
+      schoolName: '',
+      major: '',
+    },
+    introduction: '',
+    image: {
+      fileName: '',
+      filePath: '',
+    },
+  });
 
-  // 테스트용 멘티 데이터 && localStorage에서 데이터 불러오기 (api 연결시 제거)
-  const [menteeData, setMenteeData] = useState<MenteeData>(() => {
-    const savedData = localStorage.getItem("menteeData");
-    return savedData ? JSON.parse(savedData) : {
-      nickname: "김멘티",
-      email: "kimtee@gmail.com",
-      education: {
-        schoolName: "경북대학교 · 석사",
-        major: "심리학과 · 경영학과",
-      },
-      image: {
-        fileName: "",
-        filePath: "",
-      },
-      introduction: {
-        title: "광고 기획자를 꿈꾸는 열정넘치는 학생입니다!",
-        content: "광고 기획자라는 점을 가지고 있는 상황에서 선배님들의 조언을 듣고 싶습니다",
+  useEffect(() => {
+    const fetchData = async () => {
+      try {
+        const data = await getMenteeProfile();
+        setMenteeData(data);
+      } catch (error) {
+        console.error('멘티 프로필 로딩 실패:', error);
       }
     };
-  });
+    fetchData();
+  }, []);
 
-  // 수정된 내용을 localStorage에 저장하는 함수 (api 연결시 제거)
-  const handleSave = () => {
-    localStorage.setItem("menteeData", JSON.stringify(menteeData)); // localStorage에 저장
-    navigate("/user/menteeinfo"); // 수정 완료 후 MenteeInfo로 이동
+  const handleSave = async () => {
+    try {
+      if (!menteeData) return;
+      await updateMenteeProfile(menteeData);
+      navigate("/user/menteeinfo");
+    } catch (error) {
+      console.error("멘티 프로필 저장 실패:", error);
+      alert("프로필 저장 중 오류가 발생했습니다.");
+    }
   };
 
-  // 작성 완료 버튼 활성화 여부 확인
+  if (!menteeData) {
+    return <div className="p-4">Loading...</div>;
+  }
+
+  // 작성 완료 버튼 활성화 여부
   const isFormComplete =
-    menteeData.introduction.title.trim() !== "" &&
-    menteeData.introduction.content.trim() !== "";
+    menteeData.introduction.trim() !== "";
 
   return (
     <div className="h-screen flex flex-col relative overflow-hidden">
@@ -70,7 +83,6 @@ const MenteeProfileEdit = () => {
       {/* 저장 버튼 */}
       <div className="sticky px-4 py-4 border-t">
         <GlobalButton
-          // onClick={() => isFormComplete && navigate("/user/menteeinfo")}
           onClick={handleSave}
           disabled={!isFormComplete}
         >
diff --git a/src/user/pages/ProfileEdit/MentorInfo.tsx b/src/user/pages/ProfileEdit/MentorInfo.tsx
index 95bf9c2..7cfffad 100644
--- a/src/user/pages/ProfileEdit/MentorInfo.tsx
+++ b/src/user/pages/ProfileEdit/MentorInfo.tsx
@@ -3,6 +3,11 @@ import { useNavigate } from 'react-router-dom';
 import { ArrowLeft } from 'lucide-react';
 import { GlobalButton } from '@/global/ui/GlobalButton';
 
+import { getMentorProfile } from '@/user/api/MentorInfoApi';
+import { MentorData } from '@/user/types';
+import { reverseJobCategoryMapping, reverseDetailedJobMapping } from '@/user/components/mapping';
+import { reverseMentoringFieldMapping, reverseDayMapping } from '@/user/components/mapping';
+
 import MentorInfoProfile from '@/user/components/profileInfo/MentorInfoProfile';
 import MentorInfoBio from '@/user/components/profileInfo/MentorInfoBio';
 import MentorInfoFieldsHashtags from '@/user/components/profileInfo/MentorInfoFieldsHashtags';
@@ -12,49 +17,23 @@ import MentorInfoPortfolio from '@/user/components/profileInfo/MentorInfoPortfol
 
 const MentorInfo = () => {
   const navigate = useNavigate();
-
-  // 테스트용 멘티 데이터 && localStorage에서 데이터 불러오기 (api 연결시 제거)
-  const [mentorData, setMentorData] = useState(() => {
-    const savedData = localStorage.getItem("mentorData");
-    return savedData ? JSON.parse(savedData) : {
-      nickname: "바이",
-      email: "abcd@gmail.com",
-      education: {
-        schoolName: "경북대학교",
-        major: "컴퓨터공학",
-      },
-      organization: {
-        name: "OO주식회사",
-        jobCategory: "브랜드 마케팅",
-        detailedJob: "카피라이팅",
-        experience: 6,
-      },
-      count: 716,
-      image: {
-        fileName: "",
-        filePath: "",
-      },
-      introduction: {
-        title: "브랜드 마케팅에 대한 모든 것을 알려드립니다.",
-        content: "안녕하세요!\n저는 OO대학교 경영학과를 졸업하고 현재 XXXX에 다니고 있는 ‘바이’입니다.",
-      },        
-      timezone: {
-        days: ["월", "목"],
-        startTime: "09:00:00",
-        endTime: "17:00:00",
-      },
-      mentoringField: ["취업 준비", "커리어 고민"],        
-      hashtags: ["마케팅", "브랜드마케팅", "이직", "취준", "진로고민상담", "면접노하우"],
-      message: "안녕하세요, 멘티 여러분!\n브랜드 마케팅 경험을 바탕으로 여러분의 성장을 지원하고 싶습니다.",
-      portfolio: [
-        {
-          url: "https://example.com/portfolio1.pdf",
-          description: "브랜드 마케팅 포트폴리오.pdf",
-          size: 25,
-        },
-      ],
+  const [mentorData, setMentorData] = useState<MentorData | null>(null);
+
+  useEffect(() => {
+    const fetchData = async () => {
+      try {
+        const data = await getMentorProfile();
+        setMentorData(data);
+      } catch (error) {
+        console.error('멘토 정보 로딩 실패:', error);
+      }
     };
-  });
+    fetchData();
+  }, []);
+
+  if (!mentorData) {
+    return <div className="p-4">Loading...</div>;
+  }
 
   return (
     <div className="h-screen flex flex-col relative overflow-hidden">
@@ -70,7 +49,7 @@ const MentorInfo = () => {
               size={24}
               strokeWidth={1.0}
               className="text-white cursor-pointer"
-              onClick={() => navigate("/auth")}
+              onClick={() => navigate("/user")}
             />
             <span className="text-[20px] text-[#fff] font-[500]">멘토 프로필</span>
             <div className="w-6 h-6"></div>
@@ -80,8 +59,8 @@ const MentorInfo = () => {
           <MentorInfoProfile 
             nickname={mentorData.nickname} 
             name={mentorData.organization.name}
-            jobCategory={mentorData.organization.jobCategory}
-            detailedJob={mentorData.organization.detailedJob}
+            jobCategory={reverseJobCategoryMapping[mentorData.organization.jobCategory] || mentorData.organization.jobCategory}
+            detailedJob={reverseDetailedJobMapping[mentorData.organization.detailedJob] || mentorData.organization.detailedJob}
             experience={mentorData.organization.experience} 
             count={mentorData.count}
             image={mentorData?.image?.filePath || "/assets/ringusprofile.png"}
@@ -98,14 +77,14 @@ const MentorInfo = () => {
 
           {/* 선호 시간대 */}
           <MentorInfoTime
-            days={mentorData.timezone.days} 
+            days={mentorData.timezone.days.map((day) => reverseDayMapping[day] || day)}
             startTime={mentorData.timezone.startTime} 
             endTime={mentorData.timezone.endTime} 
           />
 
           {/* 멘토링 분야 & 해시태그 */}
           <MentorInfoFieldsHashtags 
-            mentoringField={mentorData.mentoringField} 
+            mentoringField={mentorData.mentoringField.map((field) => reverseMentoringFieldMapping[field] || field)}
             hashtags={mentorData.hashtags} 
           />
 
diff --git a/src/user/pages/ProfileEdit/MentorProfileEdit.tsx b/src/user/pages/ProfileEdit/MentorProfileEdit.tsx
index 088e27d..6515c77 100644
--- a/src/user/pages/ProfileEdit/MentorProfileEdit.tsx
+++ b/src/user/pages/ProfileEdit/MentorProfileEdit.tsx
@@ -4,6 +4,12 @@ import { ArrowLeft } from 'lucide-react';
 import { GlobalButton } from '@/global/ui/GlobalButton';
 
 import { MentorData } from '@/user/types';
+import { getMentorProfile, updateMentorProfile } from '@/user/api/MentorInfoApi';
+import { reverseJobCategoryMapping, reverseDetailedJobMapping } from '@/user/components/mapping';
+import { reverseMentoringFieldMapping, reverseDayMapping } from '@/user/components/mapping';
+import { jobCategoryMapping, detailedJobMapping } from '@/global/components/JobCategories';
+import { mentoringFieldMapping, dayMapping } from '@/user/components/mapping';
+
 import EditProfileSection from '@/user/components/ProfileEdit/EditProfileSection';
 import EditBio from '@/user/components/ProfileEdit/EditBio';
 import EditFields from '@/user/components/ProfileEdit/EditFields';
@@ -14,62 +20,71 @@ import EditPortfolio from '@/user/components/ProfileEdit/EditPortfolio';
 
 const MentorProfileEdit = () => {
   const navigate = useNavigate();
+  const [mentorData, setMentorData] = useState<MentorData | null>(null);
+    
+  useEffect(() => {
+    const fetchData = async () => {
+      try {
+        const data = await getMentorProfile();
+  
+        // 변환
+        const localizedData: MentorData = {
+          ...data,
+          mentoringField: data.mentoringField.map((f) => reverseMentoringFieldMapping[f] || f),
+          timezone: {
+            ...data.timezone,
+            days: data.timezone.days.map((d) => reverseDayMapping[d] || d),
+          },
+          organization: {
+            ...data.organization,
+            jobCategory: reverseJobCategoryMapping[data.organization.jobCategory] || data.organization.jobCategory,
+            detailedJob: reverseDetailedJobMapping[data.organization.detailedJob] || data.organization.detailedJob,
+          }
+        };
   
-  // 테스트용 멘티 데이터 && localStorage에서 데이터 불러오기 (api 연결시 제거)
-  const [mentorData, setMentorData] = useState<MentorData>(() => {
-    const savedData = localStorage.getItem("mentorData");
-    return savedData ? JSON.parse(savedData) : {
-      nickname: "바이",
-      email: "abcd@gmail.com",
-      education: {
-        schoolName: "경북대학교",
-        major: "컴퓨터공학",
-      },
-      organization: {
-        name: "OO주식회사",
-        jobCategory: "브랜드 마케팅",
-        detailedJob: "카피라이팅",
-        experience: 6,
-      },
-      count: 716,
-      image: {
-        fileName: "",
-        filePath: "",
-      },
-      introduction: {
-        title: "브랜드 마케팅에 대한 모든 것을 알려드립니다.",
-        content: "안녕하세요!\n저는 OO대학교 경영학과를 졸업하고 현재 XXXX에 다니고 있는 ‘바이’입니다.",
-      },
-      timezone: {
-        days: ["월", "목"],
-        startTime: "09:00:00",
-        endTime: "17:00:00",
-      },
-      mentoringField: ['취업 준비', '커리어 고민'],
-      hashtags: ['마케팅', '브랜드마케팅'],
-      message:
-        '안녕하세요, 멘티 여러분!\n브랜드 마케팅 경험을 바탕으로 여러분의 성장을 지원하고 싶습니다.',
-      portfolio: [
-        {
-          url: 'https://example.com/portfolio1.pdf',
-          description: '브랜드 마케팅 포트폴리오.pdf',
-          size: 25000000,
-         },
-      ],
+        setMentorData(localizedData);
+      } catch (error) {
+        console.error('멘토 정보 로딩 실패:', error);
+      }
     };
-  });
+    fetchData();
+  }, []);
+
 
-  // 수정된 내용을 localStorage에 저장하는 함수 (API 연결 시 제거)
-  const handleSave = () => {
-    localStorage.setItem("mentorData", JSON.stringify(mentorData)); // localStorage에 저장
-    navigate("/user/mentorinfo"); // 수정 완료 후 MentorInfo로 이동
+  if (!mentorData) {
+    return <div className="p-4">Loading...</div>;
+  }
+
+  const handleSave = async () => {
+    try {
+      const payload: MentorData = {
+        ...mentorData,
+        mentoringField: mentorData.mentoringField.map((field) => mentoringFieldMapping[field] || field),
+        timezone: {
+          ...mentorData.timezone,
+          days: mentorData.timezone.days.map((day) => dayMapping[day] || day),
+        },
+        organization: {
+          ...mentorData.organization,
+          jobCategory: jobCategoryMapping[mentorData.organization.jobCategory] || mentorData.organization.jobCategory,
+          detailedJob: detailedJobMapping[mentorData.organization.detailedJob] || mentorData.organization.detailedJob,
+        },
+      };
+  
+      await updateMentorProfile(payload);
+      navigate("/user/mentorinfo");
+    } catch (error) {
+      console.error("멘토 정보 저장 실패:", error);
+      alert("멘토 정보 저장 중 오류가 발생했습니다.");
+    }
   };
 
-  // 작성 완료 버튼 활성화 여부 확인
+  // 작성 완료 버튼 활성화 여부
   const isFormComplete =
-    mentorData.introduction.title.trim() !== '' &&
-    mentorData.introduction.content.trim() !== '' &&
-    mentorData.timezone.days.length > 0;
+    mentorData.introduction?.title?.trim() !== '' &&
+    mentorData.introduction?.content?.trim() !== '' &&
+    mentorData.timezone?.days?.length > 0;
+
 
   return (
     <div className="h-screen flex flex-col relative overflow-hidden">
diff --git a/src/user/types.ts b/src/user/types.ts
index 35c88e7..5fe4ad5 100644
--- a/src/user/types.ts
+++ b/src/user/types.ts
@@ -20,21 +20,17 @@ export interface MentorData {
     startTime: string;
     endTime: string;
   };
-
   hashtags: string[];
   message: string;
-
   portfolio: {
     url: string;
     description: string;
     size: number;
-  }[];
-
+  } | null;
   image: {
     fileName: string;
     filePath: string;
   };
 
   count: number;
-  email: string;
 }

From 6e71f41aae8cb690e4bc22f57fdffbe4b8bbabac Mon Sep 17 00:00:00 2001
From: wnhaoo <153691178+wnhaoo@users.noreply.github.com>
Date: Mon, 24 Mar 2025 10:45:40 +0900
Subject: [PATCH 3/4] =?UTF-8?q?feat:=20=EB=A9=98=ED=86=A0=EB=A7=81=20?=
 =?UTF-8?q?=EB=A9=98=ED=86=A0=EC=83=81=EC=84=B8=20api=20=EC=97=B0=EA=B2=B0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/app/routes/Router.tsx               |  2 +-
 src/mentorship/api/MentorViewApi.ts     | 26 ++++++++
 src/mentorship/pages/MentorInfoView.tsx | 79 ++++++++++++-------------
 3 files changed, 66 insertions(+), 41 deletions(-)
 create mode 100644 src/mentorship/api/MentorViewApi.ts

diff --git a/src/app/routes/Router.tsx b/src/app/routes/Router.tsx
index 32ccdd7..a9e4a75 100644
--- a/src/app/routes/Router.tsx
+++ b/src/app/routes/Router.tsx
@@ -54,7 +54,7 @@ export const Router = () => {
       </Route>
       <Route path="/mentorship" element={<MentorshipLayout />}>
         <Route path="" element={<MentorList />} />
-        <Route path="info" element={<MentorInfoView />} />
+        <Route path="info/:mentorId" element={<MentorInfoView />} />
         <Route path="suggestion" element={<Suggestion />} />
       </Route>
     </Routes>
diff --git a/src/mentorship/api/MentorViewApi.ts b/src/mentorship/api/MentorViewApi.ts
new file mode 100644
index 0000000..136e1d8
--- /dev/null
+++ b/src/mentorship/api/MentorViewApi.ts
@@ -0,0 +1,26 @@
+import axiosInstance from '@/global/api/axiosInstance';
+import { MentorData } from '@/user/types';
+
+export const getMentorById = async (mentorId: number): Promise<MentorData> => {
+  const response = await axiosInstance.get(`/v1/mentor/${mentorId}`);
+  const data = response.data.data;
+
+  return {
+    nickname: data.nickname ?? '',
+    education: data.education ?? { schoolName: '', major: '' },
+    organization: data.organization ?? {
+      name: '',
+      jobCategory: '',
+      detailedJob: '',
+      experience: 0,
+    },
+    introduction: data.introduction ?? { title: '', content: '' },
+    timezone: data.timezone ?? { days: [], startTime: '', endTime: '' },
+    mentoringField: data.mentoringField ?? [],
+    hashtags: data.hashtags ?? [],
+    message: data.message ?? '',
+    portfolio: data.portfolio ?? { url: '', description: '', size: 0 },
+    image: data.image ?? { fileName: '', filePath: '' },
+    count: data.count ?? 0,
+  };
+};
\ No newline at end of file
diff --git a/src/mentorship/pages/MentorInfoView.tsx b/src/mentorship/pages/MentorInfoView.tsx
index 16ac155..c4f93ad 100644
--- a/src/mentorship/pages/MentorInfoView.tsx
+++ b/src/mentorship/pages/MentorInfoView.tsx
@@ -1,9 +1,14 @@
 import { useState, useEffect } from 'react';
-import { useNavigate } from 'react-router-dom';
+import { useNavigate, useParams } from 'react-router-dom';
 import { ArrowLeft } from 'lucide-react';
 import { Bookmark } from 'lucide-react';
 import { GlobalButton } from '@/global/ui/GlobalButton';
 
+import { getMentorById } from '../api/MentorViewApi';
+import { MentorData } from '@/user/types';
+import { reverseJobCategoryMapping, reverseDetailedJobMapping } from '@/user/components/mapping';
+import { reverseMentoringFieldMapping, reverseDayMapping } from '@/user/components/mapping';
+
 import MentorInfoProfile from '../../user/components/profileInfo/MentorInfoProfile';
 import MentorInfoBio from '../../user/components/profileInfo/MentorInfoBio';
 import MentorInfoFieldsHashtags from '../../user/components/profileInfo/MentorInfoFieldsHashtags';
@@ -12,48 +17,40 @@ import MentorInfoMessage from '../../user/components/profileInfo/MentorInfoMessa
 import MentorInfoPortfolio from '../../user/components/profileInfo/MentorInfoPortfolio';
 
 const MentorInfoView = () => {
+  const { mentorId } = useParams<{ mentorId: string }>();
   const navigate = useNavigate();
   const [isBookmarked, setIsBookmarked] = useState(false);
+  const [mentorData, setMentorData] = useState<MentorData | null>(null);
 
-  // 테스트용 멘티 데이터 && localStorage에서 데이터 불러오기 (api 연결시 제거)
-  const [mentorData, setMentorData] = useState(() => {
-    const savedData = localStorage.getItem("mentorData");
-    return savedData ? JSON.parse(savedData) : {
-      nickname: "바이",
-      introduction: {
-        title: "브랜드 마케팅에 대한 모든 것을 알려드립니다.",
-        content: "안녕하세요!\n저는 OO대학교 경영학과를 졸업하고 현재 XXXX에 다니고 있는 ‘바이’입니다.",
-      },        
-      mentoringField: ["취업 준비", "커리어 고민"],        
-      education: {
-        schoolName: "경북대학교",
-        major: "컴퓨터공학",
-      },
-      organization: {
-        name: "OO주식회사",
-        jobCategory: "브랜드 마케팅",
-        detailedJob: "카피라이팅",
-        experience: 6,
-      },
-      timezone: {
-        days: ["월", "목"],
-        startTime: "09:00:00",
-        endTime: "17:00:00",
-      },
-      hashtags: ["마케팅", "브랜드마케팅", "이직", "취준", "진로고민상담", "면접노하우"],
-      message: "안녕하세요, 멘티 여러분!\n브랜드 마케팅 경험을 바탕으로 여러분의 성장을 지원하고 싶습니다.",
-      portfolio: {
-        url: 'https://example.com/portfolio1.pdf',
-        description: '브랜드 마케팅 포트폴리오.pdf',
-        size: 8000000,
-      },
-      image: {
-        fileName: "",
-        filePath: "",
-      },
-      count: 716,
+  useEffect(() => {
+    const fetchData = async () => {
+      try {
+        if (!mentorId || isNaN(Number(mentorId))) return;
+        const data = await getMentorById(Number(mentorId));
+
+        // 매핑
+        const localizedData: MentorData = {
+          ...data,
+          mentoringField: data.mentoringField.map((f) => reverseMentoringFieldMapping[f] || f),
+          timezone: {
+            ...data.timezone,
+            days: data.timezone.days.map((d) => reverseDayMapping[d] || d),
+          },
+          organization: {
+            ...data.organization,
+            jobCategory: reverseJobCategoryMapping[data.organization.jobCategory] || data.organization.jobCategory,
+            detailedJob: reverseDetailedJobMapping[data.organization.detailedJob] || data.organization.detailedJob,
+          },
+        };
+
+        setMentorData(localizedData);
+      } catch (err) {
+        console.error("멘토 상세 불러오기 실패:", err);
+      }
     };
-  });
+
+    fetchData();
+  }, [mentorId]);
 
   useEffect(() => {
     const storedBookmark = localStorage.getItem("isBookmarked");
@@ -66,6 +63,8 @@ const MentorInfoView = () => {
     localStorage.setItem("isBookmarked", newBookmarkState.toString());
   };
 
+  if (!mentorData) return <div className="p-4">Loading...</div>;
+
   return (
     <div className="h-screen flex flex-col relative overflow-hidden">
 
@@ -114,7 +113,7 @@ const MentorInfoView = () => {
 
           {/* 선호 시간대 */}
           <MentorInfoTime
-            days={mentorData.days} 
+            days={mentorData.timezone.days} 
             startTime={mentorData.timezone.startTime} 
             endTime={mentorData.timezone.endTime} 
           />

From aa83ad83a9b3e4daa954e54f78ed2e37661aab8f Mon Sep 17 00:00:00 2001
From: wnhaoo <153691178+wnhaoo@users.noreply.github.com>
Date: Mon, 24 Mar 2025 22:41:06 +0900
Subject: [PATCH 4/4] chore: develop pull

---
 src/mentorship/pages/MentorInfoView.tsx          | 4 ++--
 src/user/pages/ProfileEdit/MentorInfo.tsx        | 4 ++--
 src/user/pages/ProfileEdit/MentorProfileEdit.tsx | 6 +++---
 3 files changed, 7 insertions(+), 7 deletions(-)

diff --git a/src/mentorship/pages/MentorInfoView.tsx b/src/mentorship/pages/MentorInfoView.tsx
index c4f93ad..3ef3c2e 100644
--- a/src/mentorship/pages/MentorInfoView.tsx
+++ b/src/mentorship/pages/MentorInfoView.tsx
@@ -6,8 +6,8 @@ import { GlobalButton } from '@/global/ui/GlobalButton';
 
 import { getMentorById } from '../api/MentorViewApi';
 import { MentorData } from '@/user/types';
-import { reverseJobCategoryMapping, reverseDetailedJobMapping } from '@/user/components/mapping';
-import { reverseMentoringFieldMapping, reverseDayMapping } from '@/user/components/mapping';
+import { reverseJobCategoryMapping, reverseDetailedJobMapping } from '@/user/components/Mapping';
+import { reverseMentoringFieldMapping, reverseDayMapping } from '@/user/components/Mapping';
 
 import MentorInfoProfile from '../../user/components/profileInfo/MentorInfoProfile';
 import MentorInfoBio from '../../user/components/profileInfo/MentorInfoBio';
diff --git a/src/user/pages/ProfileEdit/MentorInfo.tsx b/src/user/pages/ProfileEdit/MentorInfo.tsx
index 7cfffad..8fb94e2 100644
--- a/src/user/pages/ProfileEdit/MentorInfo.tsx
+++ b/src/user/pages/ProfileEdit/MentorInfo.tsx
@@ -5,8 +5,8 @@ import { GlobalButton } from '@/global/ui/GlobalButton';
 
 import { getMentorProfile } from '@/user/api/MentorInfoApi';
 import { MentorData } from '@/user/types';
-import { reverseJobCategoryMapping, reverseDetailedJobMapping } from '@/user/components/mapping';
-import { reverseMentoringFieldMapping, reverseDayMapping } from '@/user/components/mapping';
+import { reverseJobCategoryMapping, reverseDetailedJobMapping } from '@/user/components/Mapping';
+import { reverseMentoringFieldMapping, reverseDayMapping } from '@/user/components/Mapping';
 
 import MentorInfoProfile from '@/user/components/profileInfo/MentorInfoProfile';
 import MentorInfoBio from '@/user/components/profileInfo/MentorInfoBio';
diff --git a/src/user/pages/ProfileEdit/MentorProfileEdit.tsx b/src/user/pages/ProfileEdit/MentorProfileEdit.tsx
index 6515c77..eb0a530 100644
--- a/src/user/pages/ProfileEdit/MentorProfileEdit.tsx
+++ b/src/user/pages/ProfileEdit/MentorProfileEdit.tsx
@@ -5,10 +5,10 @@ import { GlobalButton } from '@/global/ui/GlobalButton';
 
 import { MentorData } from '@/user/types';
 import { getMentorProfile, updateMentorProfile } from '@/user/api/MentorInfoApi';
-import { reverseJobCategoryMapping, reverseDetailedJobMapping } from '@/user/components/mapping';
-import { reverseMentoringFieldMapping, reverseDayMapping } from '@/user/components/mapping';
+import { reverseJobCategoryMapping, reverseDetailedJobMapping } from '@/user/components/Mapping';
+import { reverseMentoringFieldMapping, reverseDayMapping } from '@/user/components/Mapping';
 import { jobCategoryMapping, detailedJobMapping } from '@/global/components/JobCategories';
-import { mentoringFieldMapping, dayMapping } from '@/user/components/mapping';
+import { mentoringFieldMapping, dayMapping } from '@/user/components/Mapping';
 
 import EditProfileSection from '@/user/components/ProfileEdit/EditProfileSection';
 import EditBio from '@/user/components/ProfileEdit/EditBio';