/**
 * AppLayout - 应用布局壳
 *
 * 语义化 HTML 结构：header + aside + main 三栏布局
 * 由 MainLayout 管理侧边栏状态，AppLayout 负责渲染结构
 */
import React from "react"
import { Outlet } from "react-router-dom"
import Header from "./Header"

interface AppLayoutProps {
  sidebar: React.ReactNode
}

const AppLayout: React.FC<AppLayoutProps> = ({ sidebar }) => {
  return (
    <div className="xx-app-shell">
      <Header />
      <div className="xx-app-body">
        {sidebar}
        <main className="xx-app-content">
          <Outlet />
        </main>
      </div>
    </div>
  )
}

export default AppLayout