에디터 미디어 선택 로직 분리

components/admin/AdminMarkdownEditor.vue

@@ -21,6 +21,13 @@ import {
   getEditorHistoryEntrySelection,
   getEditorHistoryEntryValue
 } from '../../lib/markdown-editor-history.js'
+import {
+  createMediaBlockMarkdown,
+  getMediaItemKind,
+  getMediaPickerPreviewUrl,
+  isMediaItemSelectableForTarget,
+  isUploadFileAllowedForMediaTarget
+} from '../../lib/markdown-editor-media.js'
 import {
   filterSlashCommands,
   getSlashCommandFocusTarget,
@@ -33,13 +40,6 @@ import {
 import { buildCalloutOpenerLine, CALLOUT_BACKGROUND_OPTIONS, QUOTE_BACKGROUND_OPTIONS } from '../../lib/markdown-callout.js'
 import { buildCodeFenceOpener } from '../../lib/markdown-code-block.js'
 import { buildToggleOpenerLine } from '../../lib/markdown-toggle.js'
-import {
-  getPostBodyPreviewThumbnailUrl,
-  isPageCoverThumbnailUrl,
-  isPostBodyThumbnailUrl,
-  isPostCardThumbnailUrl,
-  withGeneratedImageCacheVersion
-} from '../../lib/post-card-thumbnail-url.js'
 import { getTextareaCaretCoordinates } from '../../lib/textarea-caret-coordinates.js'
 import {
   buildDefaultUploadSizeLimits,
@@ -1788,98 +1788,12 @@ const parseEditorImageLine = (line) => {
   }
 }
 
-/**
- * 파일 크기를 표시용 문자열로 변환한다.
- * @param {number} size - 바이트 크기
- * @returns {string} 표시용 크기
- */
-const formatMediaFileSize = (size) => {
-  const value = Number(size || 0)
-
-  if (!Number.isFinite(value) || value <= 0) {
-    return ''
-  }
-
-  if (value < 1024) {
-    return `${value} B`
-  }
-
-  if (value < 1024 * 1024) {
-    return `${Math.round(value / 1024)} KB`
-  }
-
-  return `${(value / 1024 / 1024).toFixed(1).replace(/\.0$/, '')} MB`
-}
-
-/**
- * 미디어 항목 종류를 반환한다.
- * @param {Object} item - 미디어 항목
- * @returns {'image'|'video'|'audio'|'file'} 미디어 종류
- */
-const getMediaItemKind = (item) => {
-  if (item?.kind) {
-    return item.kind
-  }
-
-  const source = `${item?.extension || ''} ${item?.url || ''}`.toLowerCase()
-
-  if (/\.(jpe?g|png|webp|gif)(\?|$)/i.test(source)) {
-    return 'image'
-  }
-
-  if (/\.(mp4|webm|mov)(\?|$)/i.test(source)) {
-    return 'video'
-  }
-
-  if (/\.(mp3|wav|ogg|m4a)(\?|$)/i.test(source)) {
-    return 'audio'
-  }
-
-  return 'file'
-}
-
 /**
  * 미디어 항목이 현재 선택 대상과 맞는지 확인한다.
  * @param {Object} item - 미디어 항목
  * @returns {boolean} 선택 가능 여부
  */
-const isMediaItemSelectableForTarget = (item) => {
-  if (isPostCardThumbnailUrl(item?.url) || isPostBodyThumbnailUrl(item?.url) || isPageCoverThumbnailUrl(item?.url)) {
-    return false
-  }
-
-  const kind = getMediaItemKind(item)
-
-  if (['image', 'gallery', 'active-gallery'].includes(mediaPickerTarget.value)) {
-    return kind === 'image'
-  }
-
-  return kind === mediaPickerTarget.value
-}
-
-/**
- * 미디어 선택 모달에서 사용할 가벼운 이미지 미리보기 URL을 반환한다.
- * 선택·삽입 값은 원본 URL을 유지하고, 화면 표시만 파생 이미지를 우선 사용한다.
- * @param {Object} item - 미디어 항목
- * @returns {string} 미리보기 URL
- */
-const getMediaPickerPreviewUrl = (item) => {
-  const url = String(item?.url || '')
-
-  if (getMediaItemKind(item) !== 'image') {
-    return url
-  }
-
-  if (item?.bodyThumbnailStatus?.hasThumbnail) {
-    return withGeneratedImageCacheVersion(getPostBodyPreviewThumbnailUrl(url), `${item?.updatedAt || ''}-${item?.size || ''}`)
-  }
-
-  if (item?.thumbnailStatus?.hasThumbnail && item.thumbnailStatus.thumbnailUrl) {
-    return withGeneratedImageCacheVersion(item.thumbnailStatus.thumbnailUrl, `${item?.updatedAt || ''}-${item?.size || ''}`)
-  }
-
-  return url
-}
+const isMediaItemSelectableForCurrentTarget = (item) => isMediaItemSelectableForTarget(item, mediaPickerTarget.value)
 
 /**
  * 미디어 선택 모달 파생 이미지 로드 실패 시 원본 URL로 되돌린다.
@@ -1904,47 +1818,7 @@ const onMediaPickerImageError = (event, item) => {
  * @returns {boolean} 허용 여부
  */
 const isUploadFileAllowedForPicker = (file) => {
-  if (['image', 'gallery', 'active-gallery'].includes(mediaPickerTarget.value)) {
-    return file.type.startsWith('image/')
-  }
-
-  if (mediaPickerTarget.value === 'video') {
-    return file.type.startsWith('video/')
-  }
-
-  if (mediaPickerTarget.value === 'audio') {
-    return file.type.startsWith('audio/')
-  }
-
-  return !file.type.startsWith('image/') && !file.type.startsWith('video/') && !file.type.startsWith('audio/')
-}
-
-/**
- * 미디어 항목으로 Prose 미디어 블록을 만든다.
- * @param {'video'|'audio'|'file'} blockType - 블록 유형
- * @param {Object} item - 미디어 항목
- * @returns {string[]} 마크다운 줄
- */
-const createMediaBlockMarkdown = (blockType, item) => {
-  const title = item.title || item.name || ''
-
-  if (blockType === 'video') {
-    return [':::video', `url=${item.url}`, `title=${title}`, 'caption=', ':::']
-  }
-
-  if (blockType === 'audio') {
-    return [':::audio', `url=${item.url}`, `title=${title}`, 'description=', ':::']
-  }
-
-  return [
-    ':::file',
-    `url=${item.url}`,
-    `title=${item.name || title}`,
-    'description=',
-    `name=${item.name || title}`,
-    `size=${formatMediaFileSize(item.size)}`,
-    ':::'
-  ]
+  return isUploadFileAllowedForMediaTarget(file, mediaPickerTarget.value)
 }
 
 /**
@@ -3194,7 +3068,7 @@ const closeMediaPicker = () => {
  * 현재 미디어 선택 페이지의 표시 목록
  * @returns {Array<Object>} 표시할 미디어 목록
  */
-const filteredMediaItems = computed(() => mediaItems.value.filter(isMediaItemSelectableForTarget))
+const filteredMediaItems = computed(() => mediaItems.value.filter(isMediaItemSelectableForCurrentTarget))
 
 const mediaPickerPageCount = computed(() => Math.max(1, Number(mediaPickerPagination.value.pageCount) || 1))
 
@@ -3545,7 +3419,7 @@ const uploadFromMediaModal = async (files) => {
   try {
     const uploadedFiles = await uploadMediaFiles(files)
     const uploadedUrls = uploadedFiles
-      .filter(isMediaItemSelectableForTarget)
+      .filter(isMediaItemSelectableForCurrentTarget)
       .map((file) => file.url)
     selectedMediaItemMap.value = uploadedFiles.reduce((map, file) => {
       if (uploadedUrls.includes(file.url)) {