<script setup lang="ts">
import type { NuxtError } from '#app'

// 전역 에러 페이지 — 404 등 라우팅/렌더 실패 시 노출 (기존 NotFoundPage 대체)
defineProps<{ error: NuxtError }>()

// 홈으로 복귀하며 에러 상태 초기화
function handleHome() {
  clearError({ redirect: '/' })
}
</script>

<template>
  <main class="error-page" role="alert">
    <h1>{{ error.statusCode }}</h1>
    <p v-if="error.statusCode === 404">요청하신 정보나 페이지를 찾을 수 없습니다.</p>
    <p v-else>일시적인 시스템 오류가 발생했습니다.</p>
    <button type="button" @click="handleHome">홈으로 돌아가기</button>
  </main>
</template>

<style scoped>
.error-page {
  padding: 2rem;
  text-align: center;
}

button {
  margin-top: 1rem;
  padding: 0.5rem 1rem;
  cursor: pointer;
}
</style>
