From aff10b4755a69564088f6540f365879d4976fc87 Mon Sep 17 00:00:00 2001
From: manNomi <hanmw110@naver.com>
Date: Fri, 26 Jun 2026 13:48:00 +0900
Subject: [PATCH] =?UTF-8?q?fix:=20=EC=BB=A4=EB=AE=A4=EB=8B=88=ED=8B=B0=20?=
 =?UTF-8?q?=EC=83=81=EC=84=B8=20=EA=B8=B0=EB=B3=B8=20=ED=94=84=EB=A1=9C?=
 =?UTF-8?q?=ED=95=84=20=EC=9D=B4=EB=AF=B8=EC=A7=80=20=ED=86=B5=EC=9D=BC?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../[boardCode]/[postId]/CommentSection.tsx      | 14 ++------------
 .../community/[boardCode]/[postId]/Content.tsx   | 16 ++--------------
 2 files changed, 4 insertions(+), 26 deletions(-)

diff --git a/apps/web/src/app/community/[boardCode]/[postId]/CommentSection.tsx b/apps/web/src/app/community/[boardCode]/[postId]/CommentSection.tsx
index d14d36058..e1024dffc 100644
--- a/apps/web/src/app/community/[boardCode]/[postId]/CommentSection.tsx
+++ b/apps/web/src/app/community/[boardCode]/[postId]/CommentSection.tsx
@@ -5,12 +5,10 @@ import { useMemo, useState } from "react";
 import { useDeleteComment } from "@/apis/community";
 import useBlockCommunityUser from "@/app/community/_hooks/useBlockCommunityUser";
 import Dropdown from "@/components/ui/Dropdown";
-import Image from "@/components/ui/FallbackImage";
-import { DEFAULT_PROFILE_IMAGE } from "@/constants/profile";
+import ProfileWithBadge from "@/components/ui/ProfileWithBadge";
 import useReportedPostsStore from "@/lib/zustand/useReportedPostsStore";
 import { IconMoreVertFilled, IconSubComment } from "@/public/svgs";
 import type { Comment as CommentType, CommunityUser } from "@/types/community";
-import { normalizeImageUrlToUploadCdn } from "@/utils/cdnUrl";
 import { convertISODateToDateTime } from "@/utils/datetimeUtils";
 import CommentInput from "./CommentInput";
 
@@ -152,15 +150,7 @@ const Comment = ({
 const CommentProfile = ({ user }: { user: CommunityUser }) => {
   return (
     <div className="flex items-center gap-2">
-      <div className="h-[25px] w-[25px] rounded-full bg-bg-600">
-        <Image
-          className="h-full w-full rounded-full"
-          src={user?.profileImageUrl ? normalizeImageUrlToUploadCdn(user?.profileImageUrl) : DEFAULT_PROFILE_IMAGE}
-          width={40}
-          height={40}
-          alt="alt"
-        />
-      </div>
+      <ProfileWithBadge profileImageUrl={user?.profileImageUrl} width={25} height={25} />
       <div className="overflow-hidden text-black typo-medium-2">{user?.nickname}</div>
     </div>
   );
diff --git a/apps/web/src/app/community/[boardCode]/[postId]/Content.tsx b/apps/web/src/app/community/[boardCode]/[postId]/Content.tsx
index cc5841457..8fb58cab6 100644
--- a/apps/web/src/app/community/[boardCode]/[postId]/Content.tsx
+++ b/apps/web/src/app/community/[boardCode]/[postId]/Content.tsx
@@ -3,8 +3,8 @@ import { useEffect, useState } from "react";
 import { useDeleteLike, usePostLike } from "@/apis/community";
 import Image from "@/components/ui/FallbackImage";
 import LinkifyText from "@/components/ui/LinkifyText";
+import ProfileWithBadge from "@/components/ui/ProfileWithBadge";
 import { COMMUNITY_MAX_UPLOAD_IMAGES } from "@/constants/community";
-import { DEFAULT_PROFILE_IMAGE } from "@/constants/profile";
 import { showIconToast } from "@/lib/toast/showIconToast";
 import { IconCloseFilled, IconPostLikeFilled, IconPostLikeOutline } from "@/public/svgs";
 import { IconCommunication } from "@/public/svgs/community";
@@ -115,19 +115,7 @@ const Content = ({ post, postId }: ContentProps) => {
 
       <div className="flex h-16 items-center justify-between border-y border-gray-c-100 px-5 py-3">
         <div className="flex gap-2.5">
-          <div className="h-10 w-10 rounded-full bg-bg-600">
-            <Image
-              className="h-full w-full rounded-full object-cover"
-              src={
-                post.postFindSiteUserResponse.profileImageUrl
-                  ? normalizeImageUrlToUploadCdn(post.postFindSiteUserResponse.profileImageUrl)
-                  : DEFAULT_PROFILE_IMAGE
-              }
-              width={40}
-              height={40}
-              alt=""
-            />
-          </div>
+          <ProfileWithBadge profileImageUrl={post.postFindSiteUserResponse.profileImageUrl} width={40} height={40} />
           <div className="flex flex-col">
             <div className="overflow-hidden text-ellipsis font-serif text-black typo-medium-2">
               {post.postFindSiteUserResponse.nickname || ""}