v0.1.43 - 인증 강제와 회원 탈퇴 흐름 정리

src/App.vue

@@ -11,6 +11,8 @@ import StatsDashboard from './components/StatsDashboard.vue'
 import { fetchAdminOverview } from './lib/adminApi'
 import {
   clearAuthState,
+  confirmVerification,
+  deleteAccount,
   fetchCurrentUser,
   confirmPasswordReset,
   login,
@@ -88,10 +90,15 @@ const passwordForm = reactive({
   newPassword: '',
   confirmPassword: '',
 })
+const accountDeleteForm = reactive({
+  currentPassword: '',
+})
 const profileBusy = ref(false)
 const passwordBusy = ref(false)
 const profileMessage = ref('')
 const passwordMessage = ref('')
+const accountDeleteBusy = ref(false)
+const accountDeleteMessage = ref('')
 const carryoverMessage = ref('')
 const carryoverCheckPolicy = ref(readCarryoverCheckPolicy())
 const carryoverCheckPrompt = ref(null)
@@ -1443,6 +1450,10 @@ function resetPasswordForm() {
   passwordForm.confirmPassword = ''
 }
 
+function resetAccountDeleteForm() {
+  accountDeleteForm.currentPassword = ''
+}
+
 function openAuthDialog(mode = 'login') {
   authMode.value = mode
   authMessage.value = ''
@@ -1472,6 +1483,43 @@ function openPasswordResetFromUrl() {
   authDialogOpen.value = true
 }
 
+async function openVerificationFromUrl() {
+  if (typeof window === 'undefined') {
+    return
+  }
+
+  const url = new URL(window.location.href)
+
+  if (!url.pathname.includes('verify-email')) {
+    return
+  }
+
+  const token = url.searchParams.get('token') ?? ''
+
+  if (!token) {
+    authMode.value = 'login'
+    authMessage.value = '이메일 인증 링크가 올바르지 않습니다.'
+    authDialogOpen.value = true
+    return
+  }
+
+  authBusy.value = true
+  authMode.value = 'login'
+  authDialogOpen.value = true
+
+  try {
+    const result = await confirmVerification({ token })
+    authMessage.value = result.message || '이메일 인증이 완료되었습니다. 이제 로그인할 수 있습니다.'
+    url.pathname = '/'
+    url.search = ''
+    window.history.replaceState({}, '', url.toString())
+  } catch (error) {
+    authMessage.value = toUserFacingApiError(error, '이메일 인증 링크를 처리하지 못했습니다.')
+  } finally {
+    authBusy.value = false
+  }
+}
+
 function closeAuthDialog() {
   authDialogOpen.value = false
   authMessage.value = ''
@@ -1537,7 +1585,14 @@ async function submitAuthForm() {
           password: authForm.password,
         })
 
-    await applyAuthSuccess(result, authMode.value === 'login' && authForm.rememberSession)
+    if (authMode.value === 'signup') {
+      authMode.value = 'login'
+      authForm.password = ''
+      authMessage.value = result.message
+      return
+    }
+
+    await applyAuthSuccess(result, authForm.rememberSession)
   } catch (error) {
     authMessage.value = toUserFacingApiError(error, '인증 처리 중 문제가 발생했습니다.')
   } finally {
@@ -1588,6 +1643,7 @@ function logout() {
   adminMessage.value = ''
   adminUsers.value = []
   adminRecentLogins.value = []
+  accountDeleteMessage.value = ''
   adminOverview.value = {
     totalUsers: 0,
     totalAdmins: 0,
@@ -1607,6 +1663,7 @@ function logout() {
   restoreLocalPlannerRecords()
   resetGoalForm()
   resetPasswordForm()
+  resetAccountDeleteForm()
 }
 
 async function loadAdminDashboard() {
@@ -1806,6 +1863,10 @@ function updatePasswordField({ field, value }) {
   passwordForm[field] = value
 }
 
+function updateAccountDeleteField({ field, value }) {
+  accountDeleteForm[field] = value
+}
+
 async function submitProfileForm() {
   profileBusy.value = true
   profileMessage.value = ''
@@ -1862,6 +1923,36 @@ async function submitPasswordForm() {
   }
 }
 
+async function submitDeleteAccount() {
+  if (!accountDeleteForm.currentPassword) {
+    accountDeleteMessage.value = '회원 탈퇴를 위해 현재 비밀번호를 입력해 주세요.'
+    return
+  }
+
+  const confirmed = window.confirm('정말로 회원 탈퇴하시겠습니까? 작성한 플래너와 목표 데이터도 함께 삭제됩니다.')
+
+  if (!confirmed) {
+    return
+  }
+
+  accountDeleteBusy.value = true
+  accountDeleteMessage.value = ''
+
+  try {
+    const result = await deleteAccount(authToken.value, {
+      currentPassword: accountDeleteForm.currentPassword,
+    })
+    resetAccountDeleteForm()
+    logout()
+    authMessage.value = ''
+    window.alert(result.message || '회원 탈퇴가 완료되었습니다.')
+  } catch (error) {
+    accountDeleteMessage.value = error.message || '회원 탈퇴를 처리하지 못했습니다.'
+  } finally {
+    accountDeleteBusy.value = false
+  }
+}
+
 function replacePlannerRecords(nextRecords) {
   Object.keys(plannerRecords).forEach((key) => {
     delete plannerRecords[key]
@@ -2026,6 +2117,12 @@ async function printPlannerRange() {
   window.print()
 }
 
+async function initializeAppSession() {
+  await openVerificationFromUrl()
+  openPasswordResetFromUrl()
+  await restoreAuthSession()
+}
+
 onMounted(() => {
   resetGoalForm()
   setSyncFeedback('local', '로그인 후 클라우드 저장을 사용할 수 있습니다.', {
@@ -2034,8 +2131,7 @@ onMounted(() => {
   updateWindowWidth()
   window.addEventListener('resize', updateWindowWidth)
   window.addEventListener('keydown', handleGlobalKeydown)
-  openPasswordResetFromUrl()
-  restoreAuthSession()
+  initializeAppSession()
 })
 
 onBeforeUnmount(() => {
@@ -2961,13 +3057,18 @@ onBeforeUnmount(() => {
         :password-busy="passwordBusy"
         :profile-message="profileMessage"
         :password-message="passwordMessage"
+        :account-delete-form="accountDeleteForm"
+        :account-delete-busy="accountDeleteBusy"
+        :account-delete-message="accountDeleteMessage"
         :guide-tooltip-reset-message="guideTooltipResetMessage"
         :carryover-check-policy="carryoverCheckPolicy"
         @update:profile-field="updateProfileField"
         @update:password-field="updatePasswordField"
+        @update:account-delete-field="updateAccountDeleteField"
         @update:carryover-check-policy="updateCarryoverCheckPolicy"
         @submit:profile="submitProfileForm"
         @submit:password="submitPasswordForm"
+        @submit:delete-account="submitDeleteAccount"
         @reset-guide-tooltips="resetGuideTooltips"
       />