'use client'

import { useState } from 'react'
import type { Citation } from '@/lib/sdk/advisor/contract'
import type { CiteHandler } from './Markdown'

/**
 * Couples answer [n] markers to evidence cards: clicking [n] highlights + scrolls to the referenced
 * evidence unit. Works across layout columns via the card's DOM id (ev-<evidence_id>).
 */
export function useCitationHighlight(citations: Citation[]): {
  highlightedId?: string
  cite?: CiteHandler
} {
  const [highlightedId, setHighlightedId] = useState<string | undefined>()
  if (citations.length === 0) return { highlightedId }
  return {
    highlightedId,
    cite: {
      count: citations.length,
      onSelect: (n: number) => {
        const c = citations[n - 1]
        if (!c) return
        setHighlightedId(c.evidence_id)
        if (typeof document !== 'undefined') {
          document.getElementById(`ev-${c.evidence_id}`)?.scrollIntoView({
            behavior: 'smooth',
            block: 'center',
          })
        }
      },
    },
  }
}