"use client"

/**
 * v2-P2-7: 诊断模块监控埋点 Context。
 *
 * 通过 React Context 注入 DiagnosticMonitor 实现，
 * 使组件可通过 useDiagnosticMonitor() 获取监控实例，
 * 而不直接依赖具体埋点 SDK。
 *
 * 默认值为 noopDiagnosticMonitor（不发送任何事件），
 * 确保未注入 Provider 时业务流程不受影响。
 *
 * 注意：monitor prop 为可选，Server Component 不应传递含函数的对象。
 * 若需注入真实监控实现，请在 Client Component 内部使用。
 *
 * 用法：
 * ```tsx
 * // Server Component（不传 monitor）
 * <DiagnosticMonitorProvider>
 *   <DiagnosticServiceProvider>
 *     <ReportList />
 *   </DiagnosticServiceProvider>
 * </DiagnosticMonitorProvider>
 *
 * // Client Component（可注入真实实现）
 * <DiagnosticMonitorProvider monitor={postHogMonitor}>
 *   ...
 * </DiagnosticMonitorProvider>
 * ```
 */

import { createContext, useContext, type ReactNode } from "react"

import {
  noopDiagnosticMonitor,
  type DiagnosticMonitor,
} from "./diagnostic-monitor"

const DiagnosticMonitorContext = createContext<DiagnosticMonitor>(
  noopDiagnosticMonitor,
)

interface DiagnosticMonitorProviderProps {
  /**
   * 监控实现（可选）。
   * 未传时使用 noopDiagnosticMonitor。
   * Server Component 不要传此 prop（含函数无法跨边界传递）。
   */
  monitor?: DiagnosticMonitor
  children: ReactNode
}

export function DiagnosticMonitorProvider({
  monitor,
  children,
}: DiagnosticMonitorProviderProps): ReactNode {
  const value = monitor ?? noopDiagnosticMonitor
  return (
    <DiagnosticMonitorContext.Provider value={value}>
      {children}
    </DiagnosticMonitorContext.Provider>
  )
}

/**
 * 获取当前注入的 DiagnosticMonitor 实例。
 *
 * 若未注入 Provider，返回 no-op 实现，确保调用安全。
 */
export function useDiagnosticMonitor(): DiagnosticMonitor {
  return useContext(DiagnosticMonitorContext)
}
