import { List, MessageSquare, PanelRight } from 'lucide-react';
import type { AppRegistryMeta } from 'officerdev';
import { NavPanel } from './NavPanel';
import { DetailPanel } from './DetailPanel';
import { ChatPanel, ChatPanelHeader } from './ChatPanel';

// Three panels: a nav, a detail pane, and a chat.
//
// The nav and the detail pane are SIBLINGS that never speak to each other — the nav writes `?section=` and
// the detail pane reads it. That is `docs/navigation-audit.md`'s rule and it is why the sections are
// linkable and survive a reload. It replaced a pair of fixed panels (Hosts and Certificates side by side),
// which could show two of NPM's seven sections and had nowhere to put the other five.
//
// The chat panel has to be OURS even though the chat inside it is the platform's — `PluginScreen` pins the
// layout to `allowed = panels.map(p => p.key)`, so naming `officerdev/chat` in layout.ts renders the
// fallback instead. See ChatPanel.tsx.
//
// `availableOnPanel: false` — these belong to this plugin's screen, not to the generic panel picker.
export const appRegistryMetas: AppRegistryMeta[] = [
  { key: 'proxy-manager-nav', name: 'Sections', icon: List, component: NavPanel, availableOnPanel: false },
  { key: 'proxy-manager-detail', name: 'Detail', icon: PanelRight, component: DetailPanel, availableOnPanel: false },
  {
    key: 'proxy-manager-chat',
    name: 'Chat',
    icon: MessageSquare,
    component: ChatPanel,
    // The conversation picker, scoped to this plugin's own chat directory.
    header: ChatPanelHeader,
    availableOnPanel: false,
  },
];