From 21cabbe20b8ef22d21c847cfdbeaa20377308a7b Mon Sep 17 00:00:00 2001
From: ttipo <kysung114y@gmail.com>
Date: Mon, 22 Jun 2026 23:57:22 +0900
Subject: [PATCH] =?UTF-8?q?refactor:=20ScheduleAvatar=20=EB=A5=BC=20UserAv?=
 =?UTF-8?q?atar=20=EC=96=B4=EB=8C=91=ED=84=B0=EB=A1=9C=20=EC=A0=95?=
 =?UTF-8?q?=EB=A6=AC=20(Phase=203-4)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

ScheduleAvatar 가 복제하던 이미지/실루엣 렌더링을 제거하고, 공용 UserAvatar 를
size(px)로 감싸는 얇은 래퍼로 전환. 아바타 표시 로직을 UserAvatar 단일 소스로 통일
(.sa 클래스는 상세 패널 스택 CSS 훅으로 유지, 사용처 변경 없음).

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
---
 .../components/schedule/ScheduleAvatar.vue    | 51 +++++--------------
 1 file changed, 12 insertions(+), 39 deletions(-)

diff --git a/frontend/src/components/schedule/ScheduleAvatar.vue b/frontend/src/components/schedule/ScheduleAvatar.vue
index eab686d..bb5ea62 100644
--- a/frontend/src/components/schedule/ScheduleAvatar.vue
+++ b/frontend/src/components/schedule/ScheduleAvatar.vue
@@ -1,9 +1,10 @@
 <script setup lang="ts">
-// 일정 참석자 아바타 — 사이트 공용 UserAvatar 와 동일한 방식.
-// 프로필 이미지가 있으면 사진, 없으면 사람 실루엣 placeholder(색상+이니셜 방식은 폐기).
-import { computed } from 'vue'
+// 일정 참석자 아바타 — 사이트 공용 UserAvatar 를 size(px)로 감싸는 얇은 어댑터.
+// 렌더링(이미지/실루엣)은 UserAvatar 가 단일 책임지고, 여기선 크기/원형 래퍼만 담당.
+// (.sa 클래스는 상세 패널 아바타 스택 CSS 의 훅으로 유지)
+import UserAvatar from '@/components/UserAvatar.vue'
 
-const props = withDefaults(
+withDefaults(
   defineProps<{
     name?: string
     avatarUrl?: string | null
@@ -11,52 +12,24 @@ const props = withDefaults(
   }>(),
   { name: '', avatarUrl: null, size: 21 },
 )
-
-const dim = computed(() => `${props.size}px`)
 </script>
 
 <template>
   <span
     class="sa"
-    :style="{ width: dim, height: dim }"
+    :style="{ width: `${size}px`, height: `${size}px` }"
   >
-    <img
-      v-if="avatarUrl"
-      class="sa-img"
-      :src="avatarUrl"
-      :alt="name || '프로필 이미지'"
-    >
-    <svg
-      v-else
-      class="sa-ph"
-      viewBox="0 0 24 24"
-      fill="currentColor"
-      aria-hidden="true"
-    >
-      <path d="M12 12.5a4.25 4.25 0 1 0 0-8.5 4.25 4.25 0 0 0 0 8.5Z" />
-      <path d="M4.5 19.25c0-3.04 3.36-5 7.5-5s7.5 1.96 7.5 5v.75H4.5v-.75Z" />
-    </svg>
+    <UserAvatar
+      :url="avatarUrl"
+      :name="name"
+    />
   </span>
 </template>
 
 <style scoped>
 .sa {
-  display: grid;
-  place-items: center;
-  border-radius: 50%;
-  overflow: hidden;
-  background: #e5e7eb;
-  flex-shrink: 0;
-}
-.sa-img {
-  width: 100%;
-  height: 100%;
-  object-fit: cover;
   display: block;
-}
-.sa-ph {
-  width: 64%;
-  height: 64%;
-  color: #9aa1ac;
+  flex-shrink: 0;
+  border-radius: 50%;
 }
 </style>