feat. GR_GALLERY_01 템플릿 제작

layers/components/blocks/modal/YouTube.vue

@@ -50,6 +50,8 @@
 </template>
 
 <script setup lang="ts">
+import { getYouTubeEmbedUrl } from '#layers/utils/youtube'
+
 interface Props {
   isOpen: boolean
   youtubeUrl: string
@@ -72,28 +74,8 @@ const props = withDefaults(defineProps<Props>(), {
 
 const emit = defineEmits<Emits>()
 
-// [TODO] YouTube URL을 임베드 가능한 형태로 변환
 const embedUrl = computed(() => {
-  if (!props.youtubeUrl) return ''
-
-  // YouTube Shorts URL 처리
-  if (props.youtubeUrl.includes('/shorts/')) {
-    const videoId = props.youtubeUrl.split('/shorts/')[1]?.split('?')[0]
-    return `https://www.youtube.com/embed/${videoId}`
-  }
-
-  // 일반 YouTube URL 처리
-  if (props.youtubeUrl.includes('youtube.com/watch?v=')) {
-    const videoId = props.youtubeUrl.split('v=')[1]?.split('&')[0]
-    return `https://www.youtube.com/embed/${videoId}`
-  }
-
-  // 이미 임베드 URL인 경우
-  if (props.youtubeUrl.includes('youtube.com/embed/')) {
-    return props.youtubeUrl
-  }
-
-  return props.youtubeUrl
+  return getYouTubeEmbedUrl(props.youtubeUrl)
 })
 
 // ESC 키로 모달 닫기