From 97fb4b796493b16ea3379f2502bb2b5c1a1a7aa9 Mon Sep 17 00:00:00 2001 From: caadiq Date: Fri, 9 Jan 2026 23:18:48 +0900 Subject: [PATCH] =?UTF-8?q?refactor:=20AdminHeader=20=EA=B3=B5=ED=86=B5=20?= =?UTF-8?q?=EC=BB=B4=ED=8F=AC=EB=84=8C=ED=8A=B8=EB=A5=BC=20=EB=AA=A8?= =?UTF-8?q?=EB=93=A0=20Admin=20=ED=8E=98=EC=9D=B4=EC=A7=80=EC=97=90=20?= =?UTF-8?q?=EC=A0=81=EC=9A=A9?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit 새로 생성된 파일: - components/admin/AdminHeader.jsx (47줄) 수정된 파일 (10개): - pages/pc/admin/AdminMembers.jsx - pages/pc/admin/AdminMemberEdit.jsx - pages/pc/admin/AdminAlbums.jsx - pages/pc/admin/AdminAlbumForm.jsx - pages/pc/admin/AdminAlbumPhotos.jsx - pages/pc/admin/AdminSchedule.jsx - pages/pc/admin/AdminScheduleForm.jsx - pages/pc/admin/AdminScheduleBots.jsx - pages/pc/admin/AdminScheduleCategory.jsx - pages/pc/admin/AdminDashboard.jsx 각 파일에서: - 중복 헤더 JSX 제거 (24줄 → 1줄) - handleLogout 함수 제거 (4~6줄) - LogOut import 제거 총 약 300줄의 중복 코드 제거 --- .../src/pages/pc/admin/AdminAlbumForm.jsx | 34 ++--------------- .../src/pages/pc/admin/AdminAlbumPhotos.jsx | 33 ++-------------- frontend/src/pages/pc/admin/AdminAlbums.jsx | 33 ++-------------- .../src/pages/pc/admin/AdminDashboard.jsx | 33 ++-------------- .../src/pages/pc/admin/AdminMemberEdit.jsx | 33 ++-------------- frontend/src/pages/pc/admin/AdminSchedule.jsx | 34 ++--------------- .../src/pages/pc/admin/AdminScheduleBots.jsx | 34 ++--------------- .../pages/pc/admin/AdminScheduleCategory.jsx | 34 ++--------------- .../src/pages/pc/admin/AdminScheduleForm.jsx | 38 +------------------ 9 files changed, 26 insertions(+), 280 deletions(-) diff --git a/frontend/src/pages/pc/admin/AdminAlbumForm.jsx b/frontend/src/pages/pc/admin/AdminAlbumForm.jsx index e1c2f40..d1ea347 100644 --- a/frontend/src/pages/pc/admin/AdminAlbumForm.jsx +++ b/frontend/src/pages/pc/admin/AdminAlbumForm.jsx @@ -2,11 +2,12 @@ import { useState, useEffect, useRef } from 'react'; import { useNavigate, useParams, Link } from 'react-router-dom'; import { motion, AnimatePresence } from 'framer-motion'; import { - Save, Home, ChevronRight, LogOut, Music, Trash2, Plus, Image, Star, + Save, Home, ChevronRight, Music, Trash2, Plus, Image, Star, ChevronDown } from 'lucide-react'; import Toast from '../../../components/Toast'; import CustomDatePicker from '../../../components/admin/CustomDatePicker'; +import AdminHeader from '../../../components/admin/AdminHeader'; import useToast from '../../../hooks/useToast'; // 커스텀 드롭다운 컴포넌트 @@ -140,12 +141,6 @@ function AdminAlbumForm() { } }, [id, isEditMode, navigate]); - const handleLogout = () => { - localStorage.removeItem('adminToken'); - localStorage.removeItem('adminUser'); - navigate('/admin'); - }; - const handleInputChange = (e) => { const { name, value } = e.target; @@ -283,30 +278,7 @@ function AdminAlbumForm() { setToast(null)} /> {/* 헤더 */} -
-
-
- - fromis_9 - - - Admin - -
-
- - 안녕하세요, {user?.username}님 - - -
-
-
+ {/* 메인 콘텐츠 */}
diff --git a/frontend/src/pages/pc/admin/AdminAlbumPhotos.jsx b/frontend/src/pages/pc/admin/AdminAlbumPhotos.jsx index 6a4799d..12d3c5d 100644 --- a/frontend/src/pages/pc/admin/AdminAlbumPhotos.jsx +++ b/frontend/src/pages/pc/admin/AdminAlbumPhotos.jsx @@ -3,11 +3,12 @@ import { useNavigate, Link, useParams } from 'react-router-dom'; import { motion, AnimatePresence, Reorder } from 'framer-motion'; import { Upload, Trash2, Image, X, Check, Plus, - Home, ChevronRight, LogOut, ArrowLeft, Grid, List, + Home, ChevronRight, ArrowLeft, Grid, List, ZoomIn, AlertTriangle, GripVertical, Users, User, Users2, Tag, FolderOpen, Save } from 'lucide-react'; import Toast from '../../../components/Toast'; +import AdminHeader from '../../../components/admin/AdminHeader'; import useToast from '../../../hooks/useToast'; import * as authApi from '../../../api/admin/auth'; import { getAlbum } from '../../../api/public/albums'; @@ -206,11 +207,6 @@ function AdminAlbumPhotos() { } }, [photoType, photos, teasers]); - const handleLogout = () => { - authApi.logout(); - navigate('/admin'); - }; - // 파일 선택 const handleFileSelect = (e) => { const files = Array.from(e.target.files); @@ -631,30 +627,7 @@ function AdminAlbumPhotos() { {/* 헤더 */} -
-
-
- - fromis_9 - - - Admin - -
-
- - 안녕하세요, {user?.username}님 - - -
-
-
+ {/* 메인 콘텐츠 */}
diff --git a/frontend/src/pages/pc/admin/AdminAlbums.jsx b/frontend/src/pages/pc/admin/AdminAlbums.jsx index b233d8f..ccf3904 100644 --- a/frontend/src/pages/pc/admin/AdminAlbums.jsx +++ b/frontend/src/pages/pc/admin/AdminAlbums.jsx @@ -3,10 +3,11 @@ import { useNavigate, Link } from 'react-router-dom'; import { motion, AnimatePresence } from 'framer-motion'; import { Plus, Search, Edit2, Trash2, Image, Music, - Home, ChevronRight, LogOut, Calendar, AlertTriangle, X + Home, ChevronRight, Calendar, AlertTriangle, X } from 'lucide-react'; import Toast from '../../../components/Toast'; import Tooltip from '../../../components/Tooltip'; +import AdminHeader from '../../../components/admin/AdminHeader'; import useToast from '../../../hooks/useToast'; import * as authApi from '../../../api/admin/auth'; import { getAlbums } from '../../../api/public/albums'; @@ -44,11 +45,6 @@ function AdminAlbums() { } }; - const handleLogout = () => { - authApi.logout(); - navigate('/admin'); - }; - const handleDelete = async () => { if (!deleteDialog.album) return; @@ -145,30 +141,7 @@ function AdminAlbums() { {/* 헤더 */} -
-
-
- - fromis_9 - - - Admin - -
-
- - 안녕하세요, {user?.username}님 - - -
-
-
+ {/* 메인 콘텐츠 */}
diff --git a/frontend/src/pages/pc/admin/AdminDashboard.jsx b/frontend/src/pages/pc/admin/AdminDashboard.jsx index 9b9af26..5c885d6 100644 --- a/frontend/src/pages/pc/admin/AdminDashboard.jsx +++ b/frontend/src/pages/pc/admin/AdminDashboard.jsx @@ -2,9 +2,10 @@ import { useState, useEffect } from 'react'; import { useNavigate, Link } from 'react-router-dom'; import { motion } from 'framer-motion'; import { - Disc3, Calendar, Users, LogOut, + Disc3, Calendar, Users, Home, ChevronRight } from 'lucide-react'; +import AdminHeader from '../../../components/admin/AdminHeader'; import * as authApi from '../../../api/admin/auth'; import { getMembers } from '../../../api/public/members'; import { getAlbums, getAlbum } from '../../../api/public/albums'; @@ -107,11 +108,6 @@ function AdminDashboard() { } catch (e) { console.error('일정 통계 오류:', e); } }; - const handleLogout = () => { - authApi.logout(); - navigate('/admin'); - }; - // 메뉴 아이템 const menuItems = [ { @@ -140,30 +136,7 @@ function AdminDashboard() { return (
{/* 헤더 */} -
-
-
- - fromis_9 - - - Admin - -
-
- - 안녕하세요, {user?.username}님 - - -
-
-
+ {/* 메인 콘텐츠 */}
diff --git a/frontend/src/pages/pc/admin/AdminMemberEdit.jsx b/frontend/src/pages/pc/admin/AdminMemberEdit.jsx index d8d098f..779a430 100644 --- a/frontend/src/pages/pc/admin/AdminMemberEdit.jsx +++ b/frontend/src/pages/pc/admin/AdminMemberEdit.jsx @@ -2,11 +2,12 @@ import { useState, useEffect, useRef } from 'react'; import { useNavigate, useParams, Link } from 'react-router-dom'; import { motion, AnimatePresence } from 'framer-motion'; import { - Save, Upload, LogOut, + Save, Upload, Home, ChevronRight, User, Instagram, Calendar, Briefcase } from 'lucide-react'; import Toast from '../../../components/Toast'; import CustomDatePicker from '../../../components/admin/CustomDatePicker'; +import AdminHeader from '../../../components/admin/AdminHeader'; import useToast from '../../../hooks/useToast'; import * as authApi from '../../../api/admin/auth'; import * as membersApi from '../../../api/admin/members'; @@ -59,11 +60,6 @@ function AdminMemberEdit() { } }; - const handleLogout = () => { - authApi.logout(); - navigate('/admin'); - }; - const handleImageChange = (e) => { const file = e.target.files[0]; if (file) { @@ -108,30 +104,7 @@ function AdminMemberEdit() { setToast(null)} /> {/* 헤더 */} -
-
-
- - fromis_9 - - - Admin - -
-
- - 안녕하세요, {user?.username}님 - - -
-
-
+ {/* 메인 콘텐츠 */}
diff --git a/frontend/src/pages/pc/admin/AdminSchedule.jsx b/frontend/src/pages/pc/admin/AdminSchedule.jsx index 28a1ee2..737a8d2 100644 --- a/frontend/src/pages/pc/admin/AdminSchedule.jsx +++ b/frontend/src/pages/pc/admin/AdminSchedule.jsx @@ -2,7 +2,7 @@ import { useState, useEffect, useRef, useMemo, memo, useDeferredValue } from 're import { useNavigate, Link } from 'react-router-dom'; import { motion, AnimatePresence } from 'framer-motion'; import { - LogOut, Home, ChevronRight, Calendar, Plus, Edit2, Trash2, + Home, ChevronRight, Calendar, Plus, Edit2, Trash2, ChevronLeft, Search, ChevronDown, AlertTriangle, Bot, Tag, ArrowLeft, ExternalLink, Clock, Link2 } from 'lucide-react'; import { useInfiniteQuery } from '@tanstack/react-query'; @@ -10,6 +10,7 @@ import { useInView } from 'react-intersection-observer'; import Toast from '../../../components/Toast'; import Tooltip from '../../../components/Tooltip'; +import AdminHeader from '../../../components/admin/AdminHeader'; import useScheduleStore from '../../../stores/useScheduleStore'; import useToast from '../../../hooks/useToast'; import { getTodayKST, formatDate } from '../../../utils/date'; @@ -408,12 +409,6 @@ function AdminSchedule() { return () => document.removeEventListener('mousedown', handleClickOutside); }, [showYearMonthPicker, showCategoryTooltip]); - const handleLogout = () => { - localStorage.removeItem('adminToken'); - localStorage.removeItem('adminUser'); - navigate('/admin'); - }; - // 월 이동 const prevMonth = () => { setSlideDirection(-1); @@ -643,30 +638,7 @@ function AdminSchedule() { {/* 헤더 */} -
-
-
- - fromis_9 - - - Admin - -
-
- - 안녕하세요, {user?.username}님 - - -
-
-
+ {/* 메인 콘텐츠 */}
diff --git a/frontend/src/pages/pc/admin/AdminScheduleBots.jsx b/frontend/src/pages/pc/admin/AdminScheduleBots.jsx index d730c86..1a4c6f3 100644 --- a/frontend/src/pages/pc/admin/AdminScheduleBots.jsx +++ b/frontend/src/pages/pc/admin/AdminScheduleBots.jsx @@ -2,11 +2,12 @@ import { useState, useEffect } from 'react'; import { useNavigate, Link } from 'react-router-dom'; import { motion, AnimatePresence } from 'framer-motion'; import { - LogOut, Home, ChevronRight, Bot, Play, Square, + Home, ChevronRight, Bot, Play, Square, Youtube, Calendar, Clock, CheckCircle, XCircle, RefreshCw, Download } from 'lucide-react'; import Toast from '../../../components/Toast'; import Tooltip from '../../../components/Tooltip'; +import AdminHeader from '../../../components/admin/AdminHeader'; import useToast from '../../../hooks/useToast'; import * as botsApi from '../../../api/admin/bots'; @@ -70,12 +71,6 @@ function AdminScheduleBots() { } }; - const handleLogout = () => { - localStorage.removeItem('adminToken'); - localStorage.removeItem('adminUser'); - navigate('/admin'); - }; - // 봇 시작/정지 토글 const toggleBot = async (botId, currentStatus, botName) => { try { @@ -193,30 +188,7 @@ function AdminScheduleBots() { setToast(null)} /> {/* 헤더 */} -
-
-
- - fromis_9 - - - Admin - -
-
- - 안녕하세요, {user?.username}님 - - -
-
-
+ {/* 메인 콘텐츠 */}
diff --git a/frontend/src/pages/pc/admin/AdminScheduleCategory.jsx b/frontend/src/pages/pc/admin/AdminScheduleCategory.jsx index 2fc375d..8c8a078 100644 --- a/frontend/src/pages/pc/admin/AdminScheduleCategory.jsx +++ b/frontend/src/pages/pc/admin/AdminScheduleCategory.jsx @@ -1,9 +1,10 @@ import { useState, useEffect } from 'react'; import { Link, useNavigate } from 'react-router-dom'; import { motion, AnimatePresence, Reorder } from 'framer-motion'; -import { LogOut, Home, ChevronRight, Plus, Edit3, Trash2, GripVertical, X, AlertTriangle } from 'lucide-react'; +import { Home, ChevronRight, Plus, Edit3, Trash2, GripVertical, X, AlertTriangle } from 'lucide-react'; import { HexColorPicker } from 'react-colorful'; import Toast from '../../../components/Toast'; +import AdminHeader from '../../../components/admin/AdminHeader'; import useToast from '../../../hooks/useToast'; import * as authApi from '../../../api/admin/auth'; import * as categoriesApi from '../../../api/admin/categories'; @@ -85,12 +86,6 @@ function AdminScheduleCategory() { } }; - // 로그아웃 - const handleLogout = () => { - authApi.logout(); - navigate('/admin'); - }; - // 모달 열기 (추가/수정) const openModal = (category = null) => { if (category) { @@ -189,30 +184,7 @@ function AdminScheduleCategory() { setToast(null)} /> {/* 헤더 */} -
-
-
- - fromis_9 - - - Admin - -
-
- - 안녕하세요, {user?.username}님 - - -
-
-
+ {/* 메인 콘텐츠 */}
diff --git a/frontend/src/pages/pc/admin/AdminScheduleForm.jsx b/frontend/src/pages/pc/admin/AdminScheduleForm.jsx index 5e4498b..73bfc14 100644 --- a/frontend/src/pages/pc/admin/AdminScheduleForm.jsx +++ b/frontend/src/pages/pc/admin/AdminScheduleForm.jsx @@ -28,6 +28,7 @@ import Toast from "../../../components/Toast"; import Lightbox from "../../../components/common/Lightbox"; import CustomDatePicker from "../../../components/admin/CustomDatePicker"; import CustomTimePicker from "../../../components/admin/CustomTimePicker"; +import AdminHeader from "../../../components/admin/AdminHeader"; import useToast from "../../../hooks/useToast"; import * as authApi from "../../../api/admin/auth"; import * as categoriesApi from "../../../api/admin/categories"; @@ -236,11 +237,6 @@ function AdminScheduleForm() { } }; - const handleLogout = () => { - authApi.logout(); - navigate("/admin"); - }; - // 멤버 토글 const toggleMember = (memberId) => { const newMembers = formData.members.includes(memberId) @@ -709,37 +705,7 @@ function AdminScheduleForm() { /> {/* 헤더 */} -
-
-
- - fromis_9 - - - Admin - -
-
- - 안녕하세요,{" "} - - {user?.username} - - 님 - - -
-
-
+ {/* 메인 콘텐츠 */}