관리자 페이지 헤더/뒤로가기/메뉴편집 단축 제거
- AdminLayout 상단 ADMIN/관리자/로그아웃 헤더 제거 - 뒤로가기 버튼 제거 (홈 헤더 로고로 이동 가능) - AdminFeaturePage의 메뉴 정보 편집 단축 링크 제거 - 로그아웃은 관리자 홈 하단에 작게 배치 Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
parent
0fb325b815
commit
6e1df46852
3 changed files with 34 additions and 65 deletions
|
|
@ -1,5 +1,5 @@
|
|||
import { Suspense } from 'react'
|
||||
import { useParams, Navigate, Link } from 'react-router-dom'
|
||||
import { useParams, Link } from 'react-router-dom'
|
||||
import { useQuery } from '@tanstack/react-query'
|
||||
import { getAdminComponent } from '../registry'
|
||||
import { api } from '../../api/client'
|
||||
|
|
@ -8,7 +8,7 @@ export default function AdminFeaturePage() {
|
|||
const { slug } = useParams()
|
||||
const Component = getAdminComponent(slug)
|
||||
|
||||
// 메뉴 정보 조회 (편집 링크 표시용)
|
||||
// 메뉴 정보 조회 (없는 기능 안내용)
|
||||
const { data: menus = [] } = useQuery({
|
||||
queryKey: ['admin', 'menus'],
|
||||
queryFn: () => api('/api/admin/menus').catch(() => []),
|
||||
|
|
@ -19,17 +19,9 @@ export default function AdminFeaturePage() {
|
|||
return (
|
||||
<div className="space-y-4">
|
||||
{menu && (
|
||||
<div className="flex items-center justify-between">
|
||||
<div>
|
||||
<h2 className="text-lg font-semibold">{menu.title}</h2>
|
||||
<p className="text-sm text-gray-500 mt-0.5">{menu.description}</p>
|
||||
</div>
|
||||
<Link
|
||||
to={`/admin/menus/${menu.id}`}
|
||||
className="text-sm rounded-lg border border-white/10 hover:border-white/20 hover:bg-white/5 px-3 py-1.5 transition"
|
||||
>
|
||||
⚙ 메뉴 정보 편집
|
||||
</Link>
|
||||
<div>
|
||||
<h2 className="text-lg font-semibold">{menu.title}</h2>
|
||||
<p className="text-sm text-gray-500 mt-0.5">{menu.description}</p>
|
||||
</div>
|
||||
)}
|
||||
<div className="rounded-2xl border border-dashed border-white/10 bg-white/[0.02] p-12 text-center">
|
||||
|
|
@ -38,30 +30,24 @@ export default function AdminFeaturePage() {
|
|||
<p className="text-xs text-gray-600 mt-2 font-mono">
|
||||
features/{slug}/{slug.split('-').map((s) => s[0].toUpperCase() + s.slice(1)).join('')}Admin.jsx
|
||||
</p>
|
||||
<Link
|
||||
to={`/admin/menus/${menu?.id || ''}`}
|
||||
className="inline-block mt-4 text-xs text-emerald-400 hover:text-emerald-300 transition"
|
||||
>
|
||||
메뉴 정보 편집 →
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="space-y-4">
|
||||
{menu && (
|
||||
<div className="flex items-center justify-end">
|
||||
<Link
|
||||
to={`/admin/menus/${menu.id}`}
|
||||
className="text-sm rounded-lg border border-white/10 hover:border-white/20 hover:bg-white/5 px-3 py-1.5 transition"
|
||||
>
|
||||
⚙ 메뉴 정보 편집
|
||||
</Link>
|
||||
</div>
|
||||
)}
|
||||
<Suspense fallback={
|
||||
<div className="flex items-center justify-center pt-20">
|
||||
<div className="w-6 h-6 border-2 border-emerald-500 border-t-transparent rounded-full animate-spin" />
|
||||
</div>
|
||||
}>
|
||||
<Component />
|
||||
</Suspense>
|
||||
</div>
|
||||
<Suspense fallback={
|
||||
<div className="flex items-center justify-center pt-20">
|
||||
<div className="w-6 h-6 border-2 border-emerald-500 border-t-transparent rounded-full animate-spin" />
|
||||
</div>
|
||||
}>
|
||||
<Component />
|
||||
</Suspense>
|
||||
)
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
import { Link, useNavigate } from 'react-router-dom'
|
||||
import { Link, useNavigate, useOutletContext } from 'react-router-dom'
|
||||
import { useQuery } from '@tanstack/react-query'
|
||||
import { api } from '../../api/client'
|
||||
|
||||
|
|
@ -60,6 +60,7 @@ function AddCard({ to, icon, label }) {
|
|||
}
|
||||
|
||||
export default function AdminHome() {
|
||||
const { handleLogout } = useOutletContext() || {}
|
||||
const { data: menus = [], isLoading: loading } = useQuery({
|
||||
queryKey: ['admin', 'menus'],
|
||||
queryFn: () => api('/api/admin/menus').catch(() => []),
|
||||
|
|
@ -120,6 +121,18 @@ export default function AdminHome() {
|
|||
</Link>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
{/* 로그아웃 */}
|
||||
{handleLogout && (
|
||||
<div className="pt-4 text-center">
|
||||
<button
|
||||
onClick={handleLogout}
|
||||
className="text-xs text-gray-600 hover:text-red-400 transition"
|
||||
>
|
||||
관리자 로그아웃
|
||||
</button>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,12 +1,10 @@
|
|||
import { useSearchParams, Outlet, Navigate, Link, useLocation } from 'react-router-dom'
|
||||
import { useSearchParams, Outlet, Navigate } from 'react-router-dom'
|
||||
import { useQuery, useQueryClient } from '@tanstack/react-query'
|
||||
import { api } from '../../api/client'
|
||||
|
||||
export default function AdminLayout() {
|
||||
const queryClient = useQueryClient()
|
||||
const [searchParams] = useSearchParams()
|
||||
const location = useLocation()
|
||||
const isRoot = location.pathname === '/admin' || location.pathname === '/admin/'
|
||||
|
||||
const keyFromUrl = searchParams.get('key')
|
||||
const key = keyFromUrl || localStorage.getItem('maple-admin-key')
|
||||
|
|
@ -45,33 +43,5 @@ export default function AdminLayout() {
|
|||
return <Navigate to="/" replace />
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="space-y-8">
|
||||
<div className="flex items-center justify-between">
|
||||
<div className="flex items-center gap-3">
|
||||
{!isRoot && (
|
||||
<Link
|
||||
to="/admin"
|
||||
className="flex items-center justify-center w-9 h-9 rounded-lg border border-white/10 hover:border-white/20 hover:bg-white/5 text-gray-400 hover:text-white transition"
|
||||
aria-label="뒤로"
|
||||
>
|
||||
←
|
||||
</Link>
|
||||
)}
|
||||
<div>
|
||||
<div className="text-xs font-medium text-emerald-400 uppercase tracking-wider mb-1">Admin</div>
|
||||
<h1 className="text-2xl font-bold tracking-tight">관리자</h1>
|
||||
</div>
|
||||
</div>
|
||||
<button
|
||||
onClick={handleLogout}
|
||||
className="text-sm text-gray-500 hover:text-gray-300 transition"
|
||||
>
|
||||
로그아웃
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<Outlet />
|
||||
</div>
|
||||
)
|
||||
return <Outlet context={{ handleLogout }} />
|
||||
}
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue