diff --git a/.env.example b/.env.example
index 23decc2..c682ff5 100644
--- a/.env.example
+++ b/.env.example
@@ -4,6 +4,7 @@ DATABASE_NAME=sori_studio
POSTGRES_DB=sori_studio
POSTGRES_USER=sori_studio
POSTGRES_PASSWORD=replace-with-random-password
+DB_BIND_ADDRESS=127.0.0.1
DB_PORT=43081
# Auth
@@ -15,6 +16,8 @@ MEMBER_SESSION_SECRET=replace-with-random-password
# Upload
UPLOAD_DIR=/uploads
+# 마이그레이션·reconcile 완료 후 database. 신규 설치는 filesystem으로 시작한 뒤 reconcile → database.
+MEDIA_CATALOG_MODE=database
MAX_FILE_SIZE=10485760
MAX_VIDEO_FILE_SIZE=209715200
MAX_AUDIO_FILE_SIZE=52428800
diff --git a/.gitignore b/.gitignore
index 8674649..f9160b8 100644
--- a/.gitignore
+++ b/.gitignore
@@ -28,6 +28,8 @@ npm-debug.log*
# Test
coverage/
+playwright-report/
+test-results/
# Reference theme sample (do not commit)
ZCF-v1.0.5/
diff --git a/components/admin/AdminPageForm.vue b/components/admin/AdminPageForm.vue
index ddf677d..5705a4b 100644
--- a/components/admin/AdminPageForm.vue
+++ b/components/admin/AdminPageForm.vue
@@ -266,25 +266,33 @@ const handlePageSectionKeydown = (event) => {
/**
* 페이지 폼의 저장 비교용 문자열을 생성한다.
+ * @param {Object|null} [payload] - 서버에 저장한 페이지 입력값
* @returns {string} 직렬화된 폼 상태
*/
-const serializePageForm = () => JSON.stringify({
+const serializePageForm = (payload = null) => JSON.stringify(payload || {
title: form.title.trim(),
slug: pageSlug.value,
status: form.status,
renderMode: form.renderMode,
- content: form.content,
- isListed: form.isListed,
- isFeatured: form.isFeatured,
+ content: form.renderMode === 'html_document' ? normalizeHtmlTagQuotes(form.content) : form.content,
+ featuredImage: form.listingImage.trim() || null,
+ isListed: Boolean(form.isListed),
+ isFeatured: Boolean(form.isListed && form.isFeatured),
listingSection: form.listingSection.trim(),
listingTitle: form.listingTitle.trim(),
listingDescription: form.listingDescription.trim(),
- listingImage: form.listingImage.trim(),
listingSortOrder: Number(form.listingSortOrder || 0)
})
const hasUnsavedPageChanges = computed(() => serializePageForm() !== savedPageSnapshot.value)
+const {
+ isUnsavedModalOpen,
+ stayOnUnsavedPage,
+ leaveUnsavedPage,
+ allowNextRouteLeave
+} = useAdminUnsavedChangesGuard(hasUnsavedPageChanges)
+
const headerStatusText = computed(() => {
if (props.saving) {
return 'Saving...'
@@ -546,15 +554,17 @@ const submitPage = () => {
/**
* 현재 폼 상태를 저장 완료 기준점으로 표시한다.
+ * @param {Object|null} [savedPayload] - 실제 서버에 저장된 입력값
* @returns {void}
*/
-const markSaved = () => {
- savedPageSnapshot.value = serializePageForm()
+const markSaved = (savedPayload = null) => {
+ savedPageSnapshot.value = serializePageForm(savedPayload)
}
onMounted(markSaved)
defineExpose({
+ allowNextRouteLeave,
markSaved
})
@@ -924,5 +934,11 @@ defineExpose({
+
+
diff --git a/components/admin/AdminPostForm.vue b/components/admin/AdminPostForm.vue
index 517b03f..cbb2f93 100644
--- a/components/admin/AdminPostForm.vue
+++ b/components/admin/AdminPostForm.vue
@@ -771,14 +771,14 @@ const shouldServerAutosaveDraft = computed(() => {
})
/**
- * 발행·예약 글만 미저장 이탈을 막는다(초안은 서버 자동 저장·이탈 직전 플러시로 처리)
+ * 자동 저장할 수 없는 초안과 발행 상태 글의 미저장 이탈을 막는다.
* @returns {boolean}
*/
const isRouteLeaveDirty = computed(() => {
if (!hasUnsavedPostChanges.value) {
return false
}
- if (props.saving) {
+ if (props.saving || props.autoSaving || isFailedDraftAutosavePayload.value || !canPersistDraftPayload.value) {
return true
}
if (['publishedLive', 'scheduled', 'members', 'private'].includes(persistedPublishKind.value)) {
diff --git a/components/comments/PostComments.vue b/components/comments/PostComments.vue
index 16c959f..b985250 100644
--- a/components/comments/PostComments.vue
+++ b/components/comments/PostComments.vue
@@ -19,6 +19,7 @@ const replyBody = ref('')
const activeReplyTargetId = ref('')
const sortOption = ref('latest')
const brokenAvatarCommentIds = ref([])
+let commentsRequestId = 0
const canSubmitComment = computed(() => Boolean(newCommentBody.value.trim()) && !submitting.value)
const canSubmitReply = computed(() => Boolean(replyBody.value.trim()) && !submittingReplyId.value)
@@ -119,22 +120,53 @@ const fetchMember = async () => {
}
}
+/**
+ * 게시물 변경 시 댓글 입력·답글·오류 상태를 초기화한다.
+ * @returns {void}
+ */
+const resetCommentState = () => {
+ commentsRequestId += 1
+ comments.value = []
+ loadingComments.value = false
+ submitting.value = false
+ submittingReplyId.value = ''
+ likingCommentIds.value = []
+ errorMessage.value = ''
+ replyErrorMessage.value = ''
+ newCommentBody.value = ''
+ replyBody.value = ''
+ activeReplyTargetId.value = ''
+ sortOption.value = 'latest'
+ brokenAvatarCommentIds.value = []
+}
+
/**
* 댓글 목록을 조회한다.
* @returns {Promise}
*/
const fetchComments = async () => {
+ const requestId = ++commentsRequestId
+ const requestedSlug = props.slug
loadingComments.value = true
errorMessage.value = ''
try {
- const response = await $fetch(`/api/posts/${props.slug}/comments`)
+ const response = await $fetch(`/api/posts/${requestedSlug}/comments`)
+
+ if (requestId !== commentsRequestId || requestedSlug !== props.slug) {
+ return
+ }
comments.value = response.comments || []
} catch (error) {
+ if (requestId !== commentsRequestId || requestedSlug !== props.slug) {
+ return
+ }
comments.value = []
errorMessage.value = error?.data?.message || '댓글을 불러오지 못했습니다.'
} finally {
- loadingComments.value = false
+ if (requestId === commentsRequestId && requestedSlug === props.slug) {
+ loadingComments.value = false
+ }
}
}
@@ -148,22 +180,30 @@ const submitComment = async () => {
return
}
+ const requestedSlug = props.slug
submitting.value = true
errorMessage.value = ''
try {
- await $fetch(`/api/posts/${props.slug}/comments`, {
+ await $fetch(`/api/posts/${requestedSlug}/comments`, {
method: 'POST',
body: {
body
}
})
+ if (requestedSlug !== props.slug) {
+ return
+ }
newCommentBody.value = ''
await fetchComments()
} catch (error) {
- errorMessage.value = error?.data?.message || '댓글 작성에 실패했습니다.'
+ if (requestedSlug === props.slug) {
+ errorMessage.value = error?.data?.message || '댓글 작성에 실패했습니다.'
+ }
} finally {
- submitting.value = false
+ if (requestedSlug === props.slug) {
+ submitting.value = false
+ }
}
}
@@ -199,23 +239,31 @@ const submitReply = async (parentId) => {
return
}
+ const requestedSlug = props.slug
submittingReplyId.value = parentId
replyErrorMessage.value = ''
try {
- await $fetch(`/api/posts/${props.slug}/comments`, {
+ await $fetch(`/api/posts/${requestedSlug}/comments`, {
method: 'POST',
body: {
body,
parentId
}
})
+ if (requestedSlug !== props.slug) {
+ return
+ }
closeReplyForm()
await fetchComments()
} catch (error) {
- replyErrorMessage.value = error?.data?.message || '답글 작성에 실패했습니다.'
+ if (requestedSlug === props.slug) {
+ replyErrorMessage.value = error?.data?.message || '답글 작성에 실패했습니다.'
+ }
} finally {
- submittingReplyId.value = ''
+ if (requestedSlug === props.slug) {
+ submittingReplyId.value = ''
+ }
}
}
@@ -236,14 +284,18 @@ const toggleLike = async (commentId) => {
return
}
+ const requestedSlug = props.slug
likingCommentIds.value = [...likingCommentIds.value, commentId]
errorMessage.value = ''
try {
- const result = await $fetch(`/api/posts/${props.slug}/comments/${commentId}/like`, {
+ const result = await $fetch(`/api/posts/${requestedSlug}/comments/${commentId}/like`, {
method: 'POST'
})
+ if (requestedSlug !== props.slug) {
+ return
+ }
comments.value = comments.value.map((item) => {
if (item.id !== commentId) {
return item
@@ -255,9 +307,13 @@ const toggleLike = async (commentId) => {
}
})
} catch (error) {
- errorMessage.value = error?.data?.message || '좋아요 처리에 실패했습니다.'
+ if (requestedSlug === props.slug) {
+ errorMessage.value = error?.data?.message || '좋아요 처리에 실패했습니다.'
+ }
} finally {
- likingCommentIds.value = likingCommentIds.value.filter((id) => id !== commentId)
+ if (requestedSlug === props.slug) {
+ likingCommentIds.value = likingCommentIds.value.filter((id) => id !== commentId)
+ }
}
}
@@ -305,6 +361,15 @@ const repliesByParent = computed(() => {
onMounted(async () => {
await Promise.all([fetchMember(), fetchComments()])
})
+
+watch(() => props.slug, async (nextSlug, previousSlug) => {
+ if (!nextSlug || nextSlug === previousSlug) {
+ return
+ }
+
+ resetCommentState()
+ await fetchComments()
+})
diff --git a/components/site/LeftSidebar.vue b/components/site/LeftSidebar.vue
index 8d3bec8..046d911 100644
--- a/components/site/LeftSidebar.vue
+++ b/components/site/LeftSidebar.vue
@@ -232,7 +232,8 @@ onMounted(() => {