// DBIS Admin Layout
import { Outlet } from 'react-router-dom';
import { useState } from 'react';
import { 
  MdDashboard, 
  MdPeople, 
  MdAccountBalance, 
  MdNetworkCheck,
  MdSwapHoriz,
  MdPublic,
  MdSecurity,
  MdCode,
  MdLock,
  MdDescription
} from 'react-icons/md';
import SidebarNavigation from './SidebarNavigation';
import TopBar from './TopBar';
import { AdminPermission } from '@/constants/permissions';
import './DBISLayout.css';

const dbisNavItems = [
  { path: '/dbis/overview', label: 'Overview', icon: <MdDashboard />, permission: AdminPermission.VIEW_GLOBAL_OVERVIEW },
  { path: '/dbis/participants', label: 'Participants & Jurisdictions', icon: <MdPeople />, permission: AdminPermission.VIEW_PARTICIPANTS },
  { path: '/dbis/gru', label: 'Assets & GRU', icon: <MdAccountBalance />, permission: AdminPermission.VIEW_GRU_COMMAND },
  { path: '/dbis/gas-qps', label: 'GAS & QPS', icon: <MdNetworkCheck />, permission: AdminPermission.VIEW_GAS_QPS },
  { path: '/dbis/cbdc-fx', label: 'CBDC & FX', icon: <MdSwapHoriz />, permission: AdminPermission.VIEW_CBDC_FX },
  { path: '/dbis/metaverse-edge', label: 'Metaverse & Edge', icon: <MdPublic />, permission: AdminPermission.VIEW_METAVERSE_EDGE },
  { path: '/dbis/risk-compliance', label: 'Risk & Compliance', icon: <MdSecurity />, permission: AdminPermission.VIEW_RISK_COMPLIANCE },
  { path: '/dbis/developer', label: 'Developer & Integrations', icon: <MdCode /> },
  { path: '/dbis/security', label: 'Security & Identity', icon: <MdLock /> },
  { path: '/dbis/audit', label: 'Audit & Governance', icon: <MdDescription /> },
];

export default function DBISLayout() {
  const [sidebarCollapsed, setSidebarCollapsed] = useState(false);

  return (
    <div className="layout">
      <SidebarNavigation 
        items={dbisNavItems} 
        collapsed={sidebarCollapsed}
        onToggle={() => setSidebarCollapsed(!sidebarCollapsed)}
      />
      <div className="layout__main">
        <TopBar />
        <main id="main-content" className="layout__content" role="main">
          <Outlet />
        </main>
      </div>
    </div>
  );
}

