🐛 project, task, mypage API 연동 관련 UI 이슈 해결

src/app/api/project/projectApi.js

@@ -97,3 +97,14 @@ export const deleteProject = async (projectId) => {
     }
 };
 
+// 스프린트별 기여도 랭킹 조회
+export const fetchSprintContributions = async (sprintId) => {
+    try {
+        const res = await axiosWithAuthorization.get(`/contributions/${sprintId}`);
+        console.log("스프린트별 기여도 랭킹 조회:", res.data);
+        return res.data.data;
+    } catch (error) {
+        const message = error?.response?.data?.data?.message ?? "스프린트별 기여도 랭킹 조회를 조회할 수 없습니다.";
+        throw new Error(message);
+    }
+};

src/app/api/user/userApi.js

@@ -10,4 +10,19 @@ export const fetchUserData = async () => {
         const message = error?.response?.data?.data?.message ?? "회원 정보를 조회할 수 없습니다.";
         throw new Error(message);
     }
+};
+
+
+// [개인 페이지] 개별 회원 기여도 점수 조회
+export const fetchUserContributionData = async (projectId, sprintId) => {
+    try {
+        const res = await axiosWithAuthorization.get(`/contributions/${projectId}/me`, {
+            params: { sprintId },
+        });
+        console.log("[개인 페이지] 개별 회원 기여도 점수 조회:", res.data);
+        return res.data.data;
+    } catch (error) {
+        const message = error?.response?.data?.data?.message ?? "[개인 페이지] 개별 회원 기여도 점수를 조회할 수 없습니다.";
+        throw new Error(message);
+    }
 };

src/app/home/home.js

@@ -197,7 +197,12 @@ export default function Home() {
   }, [selectedId]);
 
 
-  // 팀 설명 15글자 이상이면 축약 표시
+  // 팀 이름 4글자 이상이면 축약 표시
+  const reduceName = (name) => {
+    return name.length > 4 ? name.slice(0, 4) + ".." : name;
+};
+
+  // 팀 설명 10글자 이상이면 축약 표시
   const reduceDescription = (name) => {
     return name.length > 10 ? name.slice(0, 10) + ".." : name;
 };
@@ -276,7 +281,7 @@ export default function Home() {
                   window.location.href = `/team/${team.teamId}`;
                 }}>
                   <S.TitleContainer>
-                    <S.Title>{team.teamName}</S.Title>
+                    <S.Title>{reduceName(team.teamName)}</S.Title>
                     <S.MoreButton
                       onClick={(e) => {
                         e.stopPropagation();

src/app/mypage/mypage.js

@@ -14,6 +14,7 @@ import LeaderModal from "./leader_modal";
 import { fetchProjectData, fetchProjectUser } from "@/app/api/project/projectApi";
 import { fetchMySprintTaskData  } from "@/app/api/sprint/sprintApi";
 import { completeTask, sosTask } from  "@/app/api/task/taskApi";
+import { fetchUserContributionData } from "@/app/api/user/userApi"
 
 import { useAlert } from "@/context/AlertContext";
 
@@ -35,6 +36,8 @@ export default function My({ projectId }) {
     const [currentSprint, setCurrentSprint] = useState(null);
     const [currentSprintIndex, setCurrentSprintIndex] = useState(0);
 
+    const [myContributionScore, setMyContributionScore] = useState(null);
+
     const [clickCountMap, setClickCountMap] = useState({});
 
     useEffect(() => {
@@ -184,6 +187,21 @@ export default function My({ projectId }) {
         }
     };
 
+    useEffect(() => {
+        const loadMyContribution = async () => {
+            if (!ProjectId || !currentSprint?.id) return;
+
+            try {
+                const data = await fetchUserContributionData(ProjectId, currentSprint.id);
+                setMyContributionScore(data?.score ?? 0);
+            } catch (error) {
+                setMyContributionScore(0); // 실패 시 0으로 대체
+            }
+        };
+
+        loadMyContribution();
+    }, [ProjectId, currentSprint?.id]);
+
     // 모달 상태에 따라 스크롤 제어
     useEffect(() => {
         const disableScroll = () => {
@@ -216,7 +234,7 @@ export default function My({ projectId }) {
                 <M.ProfileSection>
                     <M.ProfileImage $profileImage={projectUserData?.profileImageUrl} />
                     <M.ProfileInfo>
-                        <M.Username>{projectUserData?.projectNickname} <span style={{ fontWeight: "normal" }}>님의 마이페이지</span></M.Username>
+                        <M.Username>{projectUserData?.nickname} <span style={{ fontWeight: "normal" }}>님의 마이페이지</span></M.Username>
                         <div style={{ display: "flex", gap: "10px", alignItems: "center" }}>
 
                         <Link href={`/project/${projectData?.projectId}/feedback`}>
@@ -268,7 +286,7 @@ export default function My({ projectId }) {
                         <M.ContributionWrapper>
                             <M.ContributionTitle>기여도</M.ContributionTitle>
                             {typeof currentSprint?.progress === "number" && !isNaN(currentSprint.progress) && (
-                                <ContributionCircle percentage={currentSprint.progress} />
+                                <ContributionCircle percentage={myContributionScore} />
                             )}
                         </M.ContributionWrapper>
 
@@ -277,7 +295,7 @@ export default function My({ projectId }) {
                         <M.RoleWrapper>
                             <M.RoleTitle>역할</M.RoleTitle>
                             <M.RoleText>
-                            {projectUserData?.data?.role === "ADMIN" ? "팀장" : "팀원"}
+                            {projectUserData?.role === "ADMIN" ? "팀장" : "팀원"}
                             </M.RoleText>
                         </M.RoleWrapper>
 

src/app/project/meeting_modal.js

@@ -29,7 +29,8 @@ export default function MeetingModal({
   setStartTime,
   endTime,
   setEndTime,
-  sprintId,            
+  sprintId,
+  sprintTitle,            
   isEditing,
   onMeetingSaved,      
   onMeetingDeleted     
@@ -116,7 +117,7 @@ export default function MeetingModal({
   return (
     <m.ModalOverlay>
       <ModalContent onClick={(e) => e.stopPropagation()}>
-        <m.Title>Sprint {sprintId} 팀 미팅</m.Title>
+        <m.Title>Sprint {sprintTitle} 팀 미팅</m.Title>
         <m.CloseButton onClick={onClose}>
           <IoClose size={24} />
         </m.CloseButton>
@@ -130,6 +131,8 @@ export default function MeetingModal({
               setMeetingTitle(e.target.value);
               setIsTitleChanged(true);
             }}
+            maxLength={15}
+            placeholder="회의 명을 입력하세요 (15자 이내)"
           />
         </m.InputWrapper>
         {/* 날짜 입력 */}