From 5f9f9789aac7f76d393c695a161dbf4900ab60e5 Mon Sep 17 00:00:00 2001
From: caadiq <caadiq@gmail.com>
Date: Thu, 22 Jan 2026 23:03:18 +0900
Subject: [PATCH] =?UTF-8?q?feat:=20=EA=B4=80=EB=A6=AC=EC=9E=90=20404=20?=
 =?UTF-8?q?=EC=97=90=EB=9F=AC=20=ED=8E=98=EC=9D=B4=EC=A7=80=20=EC=B6=94?=
 =?UTF-8?q?=EA=B0=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- pages/pc/admin/common/NotFound.jsx 생성
- AdminLayout 사용, 대시보드 이동 버튼 포함
- App.jsx에 /admin/* catch-all 라우트 추가

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
---
 docs/frontend-improvement.md                  |  2 +-
 frontend-temp/src/App.jsx                     |  3 +
 .../src/pages/pc/admin/common/NotFound.jsx    | 97 +++++++++++++++++++
 3 files changed, 101 insertions(+), 1 deletion(-)
 create mode 100644 frontend-temp/src/pages/pc/admin/common/NotFound.jsx

diff --git a/docs/frontend-improvement.md b/docs/frontend-improvement.md
index 32aaec1..710c7ea 100644
--- a/docs/frontend-improvement.md
+++ b/docs/frontend-improvement.md
@@ -170,7 +170,7 @@ pages/pc/admin/schedules/
 5. [ ] AlbumForm.jsx 분리
 
 ### Phase 3: 추가 개선
-1. [ ] 관리자 페이지용 에러 페이지 추가 (404, 500 등)
+1. [x] 관리자 페이지용 에러 페이지 추가 (404)
 2. [ ] 모든 페이지 동작 확인
 3. [ ] 빌드 확인
 
diff --git a/frontend-temp/src/App.jsx b/frontend-temp/src/App.jsx
index 98b9b9e..51bc0e1 100644
--- a/frontend-temp/src/App.jsx
+++ b/frontend-temp/src/App.jsx
@@ -38,6 +38,7 @@ import AdminYouTubeEditForm from '@/pages/pc/admin/schedules/edit/YouTubeEditFor
 import AdminScheduleCategory from '@/pages/pc/admin/schedules/ScheduleCategory';
 import AdminScheduleDict from '@/pages/pc/admin/schedules/ScheduleDict';
 import AdminScheduleBots from '@/pages/pc/admin/schedules/ScheduleBots';
+import AdminNotFound from '@/pages/pc/admin/common/NotFound';
 
 // Mobile 페이지
 import MobileHome from '@/pages/mobile/home/Home';
@@ -92,6 +93,8 @@ function App() {
             <Route path="/admin/schedule/categories" element={<AdminScheduleCategory />} />
             <Route path="/admin/schedule/dict" element={<AdminScheduleDict />} />
             <Route path="/admin/schedule/bots" element={<AdminScheduleBots />} />
+            {/* 관리자 404 페이지 */}
+            <Route path="/admin/*" element={<AdminNotFound />} />
 
             {/* 일반 페이지 (레이아웃 포함) */}
             <Route
diff --git a/frontend-temp/src/pages/pc/admin/common/NotFound.jsx b/frontend-temp/src/pages/pc/admin/common/NotFound.jsx
new file mode 100644
index 0000000..6a68506
--- /dev/null
+++ b/frontend-temp/src/pages/pc/admin/common/NotFound.jsx
@@ -0,0 +1,97 @@
+import { motion } from 'framer-motion';
+import { Link } from 'react-router-dom';
+import { Home, ArrowLeft } from 'lucide-react';
+import { AdminLayout } from '@/components/pc/admin';
+import { useAdminAuth } from '@/hooks/pc/admin';
+
+/**
+ * 관리자 404 페이지
+ */
+function AdminNotFound() {
+  const { user } = useAdminAuth();
+
+  return (
+    <AdminLayout user={user}>
+      <div className="flex-1 flex items-center justify-center min-h-[calc(100vh-200px)]">
+        <div className="text-center px-6">
+          {/* 404 숫자 */}
+          <motion.div
+            initial={{ opacity: 0, scale: 0.5 }}
+            animate={{ opacity: 1, scale: 1 }}
+            transition={{ duration: 0.5, type: 'spring', stiffness: 100 }}
+            className="mb-8"
+          >
+            <h1 className="text-[150px] font-bold leading-none bg-gradient-to-br from-primary to-primary-dark bg-clip-text text-transparent select-none">
+              404
+            </h1>
+          </motion.div>
+
+          {/* 메시지 */}
+          <motion.div
+            initial={{ opacity: 0, y: 20 }}
+            animate={{ opacity: 1, y: 0 }}
+            transition={{ delay: 0.2, duration: 0.5 }}
+            className="mb-8"
+          >
+            <h2 className="text-2xl font-bold text-gray-800 mb-3">
+              페이지를 찾을 수 없습니다
+            </h2>
+            <p className="text-gray-500 leading-relaxed">
+              요청하신 관리자 페이지가 존재하지 않거나 이동되었을 수 있습니다.
+            </p>
+          </motion.div>
+
+          {/* 장식 요소 */}
+          <motion.div
+            initial={{ opacity: 0 }}
+            animate={{ opacity: 1 }}
+            transition={{ delay: 0.4, duration: 0.5 }}
+            className="flex justify-center gap-2 mb-10"
+          >
+            {[...Array(5)].map((_, i) => (
+              <motion.div
+                key={i}
+                className="w-2 h-2 rounded-full bg-primary"
+                animate={{
+                  y: [0, -8, 0],
+                  opacity: [0.3, 1, 0.3],
+                }}
+                transition={{
+                  duration: 1.2,
+                  repeat: Infinity,
+                  delay: i * 0.15,
+                  ease: 'easeInOut',
+                }}
+              />
+            ))}
+          </motion.div>
+
+          {/* 버튼들 */}
+          <motion.div
+            initial={{ opacity: 0, y: 20 }}
+            animate={{ opacity: 1, y: 0 }}
+            transition={{ delay: 0.5, duration: 0.5 }}
+            className="flex justify-center gap-4"
+          >
+            <button
+              onClick={() => window.history.back()}
+              className="flex items-center gap-2 px-6 py-3 border-2 border-primary text-primary rounded-xl font-medium hover:bg-primary hover:text-white transition-colors duration-200"
+            >
+              <ArrowLeft size={18} />
+              이전 페이지
+            </button>
+            <Link
+              to="/admin/dashboard"
+              className="flex items-center gap-2 px-6 py-3 bg-gradient-to-r from-primary to-primary-dark text-white rounded-xl font-medium hover:shadow-lg hover:shadow-primary/30 transition-all duration-200"
+            >
+              <Home size={18} />
+              대시보드로 가기
+            </Link>
+          </motion.div>
+        </div>
+      </div>
+    </AdminLayout>
+  );
+}
+
+export default AdminNotFound;