AppShell

import { AppShell } from '@dashforge/ui';
import { useState } from 'react';

const navItems = [
  {
    id: 'dashboard',
    label: 'Dashboard',
    href: '/dashboard',
    icon: <DashboardIcon />,
  },
  {
    id: 'settings',
    label: 'Settings',
    href: '/settings',
    icon: <SettingsIcon />,
    children: [
      { id: 'account', label: 'Account', href: '/settings/account' },
      { id: 'security', label: 'Security', href: '/settings/security' },
    ],
  },
];

export function App() {
  const [navOpen, setNavOpen] = useState(true);

  return (
    <AppShell
      navOpen={navOpen}
      onNavOpenChange={setNavOpen}
      navItems={navItems}
      logo={<img src="/logo.svg" alt="Logo" />}
      topBarContent={<UserMenu />}
    >
      {/* page content */}
    </AppShell>
  );
}