From 02473ce8a4c3c425432f7190025aa54d0f875954 Mon Sep 17 00:00:00 2001
From: xxinzzi <156905845+xxinzzi@users.noreply.github.com>
Date: Tue, 3 Dec 2024 17:58:28 +0900
Subject: [PATCH 1/2] =?UTF-8?q?Fix:=20post=20=EB=A6=AC=EC=8A=A4=ED=8F=B0?=
 =?UTF-8?q?=EC=8A=A4=20=EC=88=98=EC=A0=95=20=EB=B0=8F=20=EC=A0=81=EC=9A=A9?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/apis/post/dto.ts       |   3 +-
 src/pages/MyPage/index.tsx | 276 ++++++++++++++++++-------------------
 2 files changed, 137 insertions(+), 142 deletions(-)

diff --git a/src/apis/post/dto.ts b/src/apis/post/dto.ts
index a1387021..68d4c6eb 100644
--- a/src/apis/post/dto.ts
+++ b/src/apis/post/dto.ts
@@ -43,8 +43,7 @@ export interface GetPostListData {
 	meta: PaginationMeta;
 }
 export interface UserPostSummary {
-	userId: number;
-	postId: number;
+	id: number;
 	createdAt: Date;
 	imageUrl: string;
 	postLikesCount: number;
diff --git a/src/pages/MyPage/index.tsx b/src/pages/MyPage/index.tsx
index 79109731..64048207 100644
--- a/src/pages/MyPage/index.tsx
+++ b/src/pages/MyPage/index.tsx
@@ -1,19 +1,19 @@
 import React, { useState, useEffect } from 'react';
 import { useNavigate } from 'react-router-dom';
 import {
-    ProfileContainer,
-    Header,
-    StatsContainer,
-    Stat,
-    StatNumber,
-    StatLabel,
-    PostsContainer,
-    AddButton,
-} from "./styles";
+	ProfileContainer,
+	Header,
+	StatsContainer,
+	Stat,
+	StatNumber,
+	StatLabel,
+	PostsContainer,
+	AddButton,
+} from './styles';
 import { OODDFrame } from '../../components/Frame/Frame';
 import NavbarProfile from '../../components/NavbarProfile';
 import NavBar from '../../components/NavBar';
-import ButtonSecondary from "./ButtonSecondary";
+import ButtonSecondary from './ButtonSecondary';
 import PostItem from '../../components/PostItem';
 import imageBasic from '../../assets/default/defaultProfile.svg';
 import Loading from '../../components/Loading';
@@ -26,148 +26,144 @@ import insta from '../../assets/default/insta.svg';
 import photo from '../../assets/default/photo.svg';
 import UserProfile from '../../components/UserProfile';
 
-import { getUserPostListApi } from "../../apis/post";
-import { UserPostSummary } from "../../apis/post/dto";
-import { getUserInfoApi } from "../../apis/user";
-import { UserInfoData } from "../../apis/user/dto";
+import { getUserPostListApi } from '../../apis/post';
+import { UserPostSummary } from '../../apis/post/dto';
+import { getUserInfoApi } from '../../apis/user';
+import { UserInfoData } from '../../apis/user/dto';
 
 const MyPage: React.FC = () => {
-    const [isLoading, setIsLoading] = useState(true);
-    const [isBottomSheetOpen, setIsBottomSheetOpen] = useState(false);
-    const [posts, setPosts] = useState<UserPostSummary[]>([]);
-    const [totalPosts, setTotalPosts] = useState(0);
-    const [userInfo, setUserInfo] = useState<UserInfoData | null>(null);
-    const navigate = useNavigate();
+	const [isLoading, setIsLoading] = useState(true);
+	const [isBottomSheetOpen, setIsBottomSheetOpen] = useState(false);
+	const [posts, setPosts] = useState<UserPostSummary[]>([]);
+	const [totalPosts, setTotalPosts] = useState(0);
+	const [userInfo, setUserInfo] = useState<UserInfoData | null>(null);
+	const navigate = useNavigate();
 
-    const bottomSheetMenuProps: BottomSheetMenuProps = {
-        items: [
-            {
-                text: '인스타 피드 가져오기',
-                action: () => {
-                    setIsBottomSheetOpen(false);
-                    navigate('/insta-connect');
-                },
-                icon: insta,
-            },
-            {
-                text: '사진 올리기',
-                action: () => {
-                    setIsBottomSheetOpen(false);
-                    navigate('/image-select');
-                },
-                icon: photo,
-            },
-        ],
-        marginBottom: '50px',
-    };
+	const bottomSheetMenuProps: BottomSheetMenuProps = {
+		items: [
+			{
+				text: '인스타 피드 가져오기',
+				action: () => {
+					setIsBottomSheetOpen(false);
+					navigate('/insta-connect');
+				},
+				icon: insta,
+			},
+			{
+				text: '사진 올리기',
+				action: () => {
+					setIsBottomSheetOpen(false);
+					navigate('/image-select');
+				},
+				icon: photo,
+			},
+		],
+		marginBottom: '50px',
+	};
 
-    const bottomSheetProps: BottomSheetProps<BottomSheetMenuProps> = {
-        isOpenBottomSheet: isBottomSheetOpen,
-        isHandlerVisible: true,
-        Component: BottomSheetMenu,
-        componentProps: bottomSheetMenuProps,
-        onCloseBottomSheet: () => {
-            setIsBottomSheetOpen(false);
-        },
-    };
+	const bottomSheetProps: BottomSheetProps<BottomSheetMenuProps> = {
+		isOpenBottomSheet: isBottomSheetOpen,
+		isHandlerVisible: true,
+		Component: BottomSheetMenu,
+		componentProps: bottomSheetMenuProps,
+		onCloseBottomSheet: () => {
+			setIsBottomSheetOpen(false);
+		},
+	};
 
-    const handleOpenSheet = () => {
-        setIsBottomSheetOpen(true);
-    };
+	const handleOpenSheet = () => {
+		setIsBottomSheetOpen(true);
+	};
 
-    // 사용자 정보 조회 API
-    const fetchUserInfo = async () => {
-        try {
-            const storedUserId = localStorage.getItem('my_id');
-            if (!storedUserId) {
-                console.error('User ID not found in localStorage');
-                return;
-            }
+	// 사용자 정보 조회 API
+	const fetchUserInfo = async () => {
+		try {
+			const storedUserId = localStorage.getItem('my_id');
+			if (!storedUserId) {
+				console.error('User ID not found in localStorage');
+				return;
+			}
 
-            const response = await getUserInfoApi(Number(storedUserId));
-            setUserInfo(response.data);
-        } catch (error) {
-            console.error('Error fetching user info:', error);
-        }
-    };
-    
-    // 게시물 리스트 조회 API
-    const fetchPostList = async () => {
-        try {
-            const storedUserId = localStorage.getItem('my_id'); 
-            if (!storedUserId) {
-                console.error('User ID not found in localStorage');
-                return;
-            }
+			const response = await getUserInfoApi(Number(storedUserId));
+			setUserInfo(response.data);
+		} catch (error) {
+			console.error('Error fetching user info:', error);
+		}
+	};
 
-            const response = await getUserPostListApi(1, 10, Number(storedUserId)); 
-            const { post, totalPostsCount } = response.data;
+	// 게시물 리스트 조회 API
+	const fetchPostList = async () => {
+		try {
+			const storedUserId = localStorage.getItem('my_id');
+			if (!storedUserId) {
+				console.error('User ID not found in localStorage');
+				return;
+			}
 
-            setPosts(post); // 게시물 목록 상태 업데이트 (UserPostSummary 사용!)
-            setTotalPosts(totalPostsCount); // 총 게시물 수 상태 업데이트
-        } catch (error) {
-            console.error('Error fetching user post list:', error); 
-        } finally {
-            setIsLoading(false); // 로딩 상태 종료
-        }
-    };
+			const response = await getUserPostListApi(1, 10, Number(storedUserId));
+			const { post, totalPostsCount } = response.data;
 
-    useEffect(() => {
-        fetchPostList();
-        fetchUserInfo();
-    }, []);
+			setPosts(post); // 게시물 목록 상태 업데이트 (UserPostSummary 사용!)
+			setTotalPosts(totalPostsCount); // 총 게시물 수 상태 업데이트
+		} catch (error) {
+			console.error('Error fetching user post list:', error);
+		} finally {
+			setIsLoading(false); // 로딩 상태 종료
+		}
+	};
 
-    if (isLoading) {
-        return <Loading />;
-    }
+	useEffect(() => {
+		fetchPostList();
+		fetchUserInfo();
+	}, []);
 
-    return (
-        <OODDFrame>
-            <ProfileContainer>
-                <AddButton onClick={handleOpenSheet}>
-                    <img src={button_plus} alt="Add" />
-                </AddButton>
-                <BottomSheet {...bottomSheetProps} />
-                <NavbarProfile />
-                <Header>
-                    <UserProfile
-                       userImg={userInfo?.profilePictureUrl || imageBasic}
-                       nickname={userInfo?.nickname || '알수없음'}
-                       bio={userInfo?.bio || '소개글이 없습니다.'}
-                    />
-                </Header>
-                <ButtonSecondary />
-                <StatsContainer>
-                    <Stat>
-                        <StatLabel>OOTD</StatLabel>
-                        <StatNumber>{totalPosts || 0}</StatNumber>
-                    </Stat>
-                    <Stat>
-                        <StatLabel>코멘트</StatLabel>
-                        <StatNumber>
-                            {posts.reduce((sum, post) => sum + (post.postCommentsCount || 0), 0)}
-                        </StatNumber>
-                    </Stat>
-                    <Stat>
-                        <StatLabel>좋아요</StatLabel>
-                        <StatNumber>
-                            {posts.reduce((sum, post) => sum + (post.postLikesCount || 0), 0)}
-                        </StatNumber>
-                    </Stat>
-                </StatsContainer>
-                <PostsContainer>
-                    {posts.length > 0 ? (
-                        posts
-                            .sort((a, b) => Number(b.isRepresentative) - Number(a.isRepresentative))
-                            .map((post) => <PostItem key={post.postId} post={post} />)
-                    ) : (
-                        <p>게시물이 없습니다.</p>
-                    )}
-                </PostsContainer>
-                <NavBar />
-            </ProfileContainer>
-        </OODDFrame>
-    );
+	if (isLoading) {
+		return <Loading />;
+	}
+
+	return (
+		<OODDFrame>
+			<ProfileContainer>
+				<AddButton onClick={handleOpenSheet}>
+					<img src={button_plus} alt="Add" />
+				</AddButton>
+				<BottomSheet {...bottomSheetProps} />
+				<NavbarProfile />
+				<Header>
+					<UserProfile
+						userImg={userInfo?.profilePictureUrl || imageBasic}
+						nickname={userInfo?.nickname || '알수없음'}
+						bio={userInfo?.bio || '소개글이 없습니다.'}
+					/>
+				</Header>
+				<ButtonSecondary />
+				<StatsContainer>
+					<Stat>
+						<StatLabel>OOTD</StatLabel>
+						<StatNumber>{totalPosts || 0}</StatNumber>
+					</Stat>
+					<Stat>
+						<StatLabel>코멘트</StatLabel>
+						<StatNumber>{posts.reduce((sum, post) => sum + (post.postCommentsCount || 0), 0)}</StatNumber>
+					</Stat>
+					<Stat>
+						<StatLabel>좋아요</StatLabel>
+						<StatNumber>{posts.reduce((sum, post) => sum + (post.postLikesCount || 0), 0)}</StatNumber>
+					</Stat>
+				</StatsContainer>
+				<PostsContainer>
+					{posts.length > 0 ? (
+						posts
+							.sort((a, b) => Number(b.isRepresentative) - Number(a.isRepresentative))
+							.map((post) => <PostItem key={post.id} post={post} />)
+					) : (
+						<p>게시물이 없습니다.</p>
+					)}
+				</PostsContainer>
+				<NavBar />
+			</ProfileContainer>
+		</OODDFrame>
+	);
 };
 
 export default MyPage;

From abafd2f25129344e48fad3b68d90e193483ed710 Mon Sep 17 00:00:00 2001
From: xxinzzi <156905845+xxinzzi@users.noreply.github.com>
Date: Tue, 3 Dec 2024 18:00:21 +0900
Subject: [PATCH 2/2] =?UTF-8?q?Fix:=20=EB=A6=AC=EC=8A=A4=ED=8F=B0=EC=8A=A4?=
 =?UTF-8?q?=20=EC=88=98=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/PostItem/index.tsx | 4 ++--
 src/pages/ProfileViewer/index.tsx | 5 ++---
 2 files changed, 4 insertions(+), 5 deletions(-)

diff --git a/src/components/PostItem/index.tsx b/src/components/PostItem/index.tsx
index e56ad732..2cbe0fd1 100644
--- a/src/components/PostItem/index.tsx
+++ b/src/components/PostItem/index.tsx
@@ -21,14 +21,14 @@ const PostItem: React.FC<PostItemProps> = ({ post, isMyPost = true }) => {
 	const imageUrl = post.imageUrl || 'https://via.placeholder.com/72';
 
 	const handleClick = () => {
-		const path = isMyPost ? `/my-post/${post.postId}` : `/post/${post.postId}`;
+		const path = isMyPost ? `/my-post/${post.id}` : `/post/${post.id}`;
 		navigate(path);
 	};
 
 	return (
 		<PostItemContainer onClick={handleClick}>
 			<PostImageContainer>
-				<PostImage src={imageUrl} alt={`post-${post.postId}`} />
+				<PostImage src={imageUrl} alt={`post-${post.id}`} />
 				{post.isRepresentative && <PinSvg src={PinIcon} />}
 				<LikesOverlay>
 					<Icon src={HeartSvg} alt="heart icon" />
diff --git a/src/pages/ProfileViewer/index.tsx b/src/pages/ProfileViewer/index.tsx
index 68969a76..cddcdf88 100644
--- a/src/pages/ProfileViewer/index.tsx
+++ b/src/pages/ProfileViewer/index.tsx
@@ -226,9 +226,8 @@ const ProfileViewer: React.FC = () => {
 				</CounterContainer>
 				<PostListContainer>
 					{representativePosts.length > 0 &&
-						representativePosts.map((post) => <PostItem post={post} key={post.postId} isMyPost={false} />)}
-					{otherPosts.length > 0 &&
-						otherPosts.map((post) => <PostItem key={post.postId} post={post} isMyPost={false} />)}
+						representativePosts.map((post) => <PostItem post={post} key={post.id} isMyPost={false} />)}
+					{otherPosts.length > 0 && otherPosts.map((post) => <PostItem key={post.id} post={post} isMyPost={false} />)}
 				</PostListContainer>
 				{activeBottomSheet === 'main' && (
 					<BottomSheet