Files
Magent/frontend/app/ui/AdminShell.tsx

43 lines
1.1 KiB
TypeScript

'use client'
import type { ReactNode } from 'react'
import AdminSidebar from './AdminSidebar'
type AdminShellProps = {
title: string
subtitle?: string
actions?: ReactNode
rail?: ReactNode
children: ReactNode
}
export default function AdminShell({ title, subtitle, actions, rail, children }: AdminShellProps) {
return (
<div className="admin-shell">
<aside className="admin-shell-nav">
<AdminSidebar />
</aside>
<main className="card admin-card">
<div className="admin-header">
<div>
<h1>{title}</h1>
{subtitle && <p className="lede">{subtitle}</p>}
</div>
{actions}
</div>
{children}
</main>
<aside className="admin-shell-rail">
{rail ?? (
<div className="admin-rail-card admin-rail-card--placeholder">
<span className="admin-rail-eyebrow">Insights</span>
<h2>Stats rail</h2>
<p>Use this column for counters, live status, and quick metrics for this page.</p>
<span className="small-pill">{title}</span>
</div>
)}
</aside>
</div>
)
}