'use client';

import { SidebarNav } from '@/components/sidebar-nav';
import { HermesInstanceSwitcher } from '@/components/hermes-instance-switcher';
import { HermesInstanceProvider } from '@/lib/hermes-instance-context';

export default function HermesLayout({ children }: { children: React.ReactNode }) {
  return (
    <HermesInstanceProvider>
      <div className="flex min-h-screen bg-[var(--bl-bg-canvas)] text-[var(--bl-text-primary)]">
        <SidebarNav />
        <main className="flex-1 min-w-0 overflow-y-auto">
          <div className="p-4 lg:p-8">
            {/* Global instance switcher — every Mission Control pane reads
                from the same `useHermesInstance()` hook, so this filter
                propagates everywhere. */}
            <div className="mb-4 flex items-center justify-end">
              <HermesInstanceSwitcher />
            </div>
            {children}
          </div>
        </main>
      </div>
    </HermesInstanceProvider>
  );
}