import type { Component } from 'vue'
import KnowledgeBasePanel from './components/KnowledgeBasePanel.vue'
import LogViewer from './components/LogViewer.vue'
import NotePanel from './components/NotePanel.vue'
import SettingsPanel from './components/SettingsPanel.vue'

/** 右サイドに開けるパネル。'none' はどれも開いていない状態。 */
export type PanelId = 'notes' | 'kb' | 'settings' | 'logs'

export interface SidePanelDef {
  id: PanelId
  label: string
  icon: string
  /** メニューに添える一行説明 */
  description: string
  component: Component
}

/**
 * 右サイドパネルの一覧。ヘッダーのメニューの並びと、開いたときに描画されるコンポーネントを兼ねる。
 * パネルを増やすときはここに1行足すだけでよい。
 */
export const SIDE_PANELS: SidePanelDef[] = [
  { id: 'notes', label: 'ノート', icon: '📝', description: 'AIと共有するノートの編集', component: NotePanel },
  { id: 'kb', label: 'ナレッジベース', icon: '📚', description: 'knowledge_base/ の Markdown を閲覧', component: KnowledgeBasePanel },
  { id: 'settings', label: '設定', icon: '⚙️', description: 'APIキー・モデルプリセット', component: SettingsPanel },
  { id: 'logs', label: 'ログ', icon: '📜', description: 'LLM API 呼び出しの履歴', component: LogViewer },
]