'use client'
import Sidebar from './Sidebar'
import TopBar from './TopBar'
import { ReactNode, useEffect, useState } from 'react'

interface AppShellProps { children: ReactNode }

export default function AppShell({ children }: AppShellProps) {
  const [user, setUser] = useState<{ username: string; display_name: string; role: string } | null>(null)
  useEffect(() => {
    fetch('/api/auth/me').then((r) => r.json()).then((d) => { if (d.user) setUser(d.user) }).catch(() => {})
  }, [])
  return (
    <div className="min-h-screen bg-slate-50 dark:bg-slate-950">
      <Sidebar />
      <TopBar user={user} />
      <main className="ml-60 pt-14 min-h-screen"><div className="p-6">{children}</div></main>
    </div>
  )
}