/**
 * 侧栏文件行、文件夹行的「问 AI」：单独一个面板，不属于任何一个文件的预览。
 * 先问问题，再在同一面板里把回答流出来；不写进某一块代码的问答记录。
 */

import type { WebviewPanel } from 'vscode'
import type { AskProfiles } from '../qa/askProfiles'
import type { PathAskSubject, PathChild } from '../qa/pathAskPrompt'
import type { ExcludeSetting } from './fileEntries'
import type { FileNode } from './fileTree'
import * as path from 'node:path'
import { commands, Disposable, FileType, ViewColumn, window, workspace } from 'vscode'
import { ClaudeCancelledError } from '../../cc/spawnClaude'
import { makeNonce } from '../../webview/html'
import { askClaude, askFailure } from '../qa/claudeAsk'
import { readFileHead } from '../qa/pathAskContext'
import { pathAskPrompt } from '../qa/pathAskPrompt'
import { createExcludeMatcher, sortEntries } from './fileEntries'

export const ASK_PATH_COMMAND = 'superpowers.codeReader.askPath'

const VIEW_TYPE = 'superpowers.codeReader.pathAsk'

type PathTarget = Pick<FileNode, 'uri' | 'folder' | 'isDirectory'> & { relativePath: string }

interface ResetMessage { type: 'reset', path: string, kind: 'file' | 'folder' }
interface AskedMessage { type: 'asked', question: string }
interface StreamMessage { type: 'stream', text?: string, activity?: string }
interface EndMessage { type: 'end', status: 'done' | 'failed' | 'stopped', error?: string }
type ToPanel = ResetMessage | AskedMessage | StreamMessage | EndMessage

/** 打开或切到问路径的面板。点侧栏另一行时换到那一行，正在答的停掉。 */
export function registerPathAsk(profiles: AskProfiles): Disposable {
  const panel = new PathAskPanel(profiles)
  return Disposable.from(
    commands.registerCommand(ASK_PATH_COMMAND, (node?: FileNode) => {
      void panel.open(node)
    }),
    panel,
  )
}

class PathAskPanel implements Disposable {
  private panel: WebviewPanel | undefined
  private whenReady = Promise.resolve()
  private target: PathTarget | undefined
  /** 换了路径就加一，旧的回答不再往面板上画 */
  private generation = 0
  private controller: AbortController | undefined

  constructor(private readonly profiles: AskProfiles) {}

  async open(node?: FileNode): Promise<void> {
    if (!node || node.isRoot)
      return
    const gen = ++this.generation
    this.controller?.abort()
    this.controller = undefined
    const relativePath = path.posix.relative(node.folder.uri.path, node.uri.path)
    this.target = { uri: node.uri, folder: node.folder, isDirectory: node.isDirectory, relativePath }
    const title = `问 AI · ${relativePath}`
    if (!this.panel) {
      this.create(title)
    }
    else {
      this.panel.title = title
      this.panel.reveal(ViewColumn.Active, false)
    }
    await this.whenReady
    if (gen !== this.generation || !this.panel)
      return
    this.post({ type: 'reset', path: relativePath, kind: node.isDirectory ? 'folder' : 'file' })
  }

  dispose(): void {
    this.generation++
    this.controller?.abort()
    this.controller = undefined
    this.panel?.dispose()
    this.panel = undefined
  }

  private create(title: string): void {
    const panel = window.createWebviewPanel(VIEW_TYPE, title, { viewColumn: ViewColumn.Active, preserveFocus: false }, {
      enableScripts: true,
      retainContextWhenHidden: true,
    })
    this.panel = panel
    let markReady: () => void = () => {}
    this.whenReady = new Promise((resolve) => {
      markReady = resolve
    })
    const nonce = makeNonce()
    panel.webview.html = pathAskHtml(nonce)
    panel.webview.onDidReceiveMessage((msg: unknown) => {
      if (!isRecord(msg) || typeof msg.type !== 'string')
        return
      if (msg.type === 'ready')
        markReady()
      else if (msg.type === 'ask' && typeof msg.question === 'string')
        void this.submit(msg.question)
      else if (msg.type === 'stop')
        this.controller?.abort()
    })
    panel.onDidDispose(() => {
      if (this.panel !== panel)
        return
      this.panel = undefined
      this.generation++
      this.controller?.abort()
      this.controller = undefined
    })
  }

  /** 空问题不发。回答过程里的字和「正在读哪个文件」直接画在这个面板上。 */
  private async submit(question: string): Promise<void> {
    const text = question.trim()
    const target = this.target
    if (!text || !target || this.controller)
      return
    const gen = this.generation
    const controller = new AbortController()
    this.controller = controller
    this.post({ type: 'asked', question: text })
    try {
      const described = await describePath(target)
      if (gen !== this.generation)
        return
      const profile = await this.profiles.current()
      if (gen !== this.generation)
        return
      const prompt = pathAskPrompt(described, text)
      await askClaude({
        prompt,
        images: [],
        ...(profile && { profilePath: profile.path }),
        cwd: target.folder.uri.fsPath,
        signal: controller.signal,
        onEvent: (event) => {
          if (gen !== this.generation)
            return
          if (event.kind === 'text')
            this.post({ type: 'stream', text: event.text })
          else if (event.kind === 'activity')
            this.post({ type: 'stream', activity: event.label })
        },
      })
      if (gen !== this.generation)
        return
      this.post({ type: 'end', status: 'done' })
    }
    catch (err) {
      if (gen !== this.generation)
        return
      if (err instanceof ClaudeCancelledError)
        this.post({ type: 'end', status: 'stopped' })
      else
        this.post({ type: 'end', status: 'failed', error: askFailure(err) })
    }
    finally {
      if (this.controller === controller)
        this.controller = undefined
    }
  }

  private post(message: ToPanel): void {
    void this.panel?.webview.postMessage(message).then(undefined, () => {})
  }
}

/** 文件带开头，文件夹带这一层（和侧栏同一套排除、同一排序）。 */
async function describePath(target: PathTarget): Promise<PathAskSubject> {
  if (target.isDirectory)
    return { kind: 'folder', relativePath: target.relativePath, children: await folderChildren(target) }
  return { kind: 'file', relativePath: target.relativePath, head: await readFileHead(target.uri.fsPath) }
}

async function folderChildren(target: PathTarget): Promise<PathChild[] | { unavailable: string }> {
  let entries: [string, FileType][]
  try {
    entries = await workspace.fs.readDirectory(target.uri)
  }
  catch (err) {
    const message = err instanceof Error ? err.message : String(err)
    return { unavailable: `列不出来（${message}）。` }
  }
  const excluded = createExcludeMatcher(workspace.getConfiguration('files', target.folder).get<ExcludeSetting>('exclude'))
  const names = new Set(entries.map(([name]) => name))
  const dir = target.relativePath
  return sortEntries(entries.map(([name, type]) => ({ name, isDirectory: (type & FileType.Directory) !== 0 })))
    .filter(entry => !excluded(dir ? `${dir}/${entry.name}` : entry.name, names))
    .map(entry => ({ name: entry.name, kind: entry.isDirectory ? 'folder' : 'file' }))
}

function isRecord(value: unknown): value is Record<string, unknown> {
  return typeof value === 'object' && value !== null
}

/** 面板里的一页：暗色遮罩铺满，中间一张卡片。问、流式回答、停止都在这张卡片上。 */
function pathAskHtml(nonce: string): string {
  return `<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta http-equiv="Content-Security-Policy" content="default-src 'none'; style-src 'unsafe-inline'; script-src 'nonce-${nonce}';">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>问 AI</title>
<style>
  html, body { height: 100%; margin: 0; }
  body {
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(0, 0, 0, 0.55);
    color: var(--vscode-foreground);
    font-family: var(--vscode-font-family);
    font-size: var(--vscode-font-size);
  }
  .card {
    display: flex;
    flex-direction: column;
    width: min(40rem, calc(100% - 2rem));
    max-height: calc(100% - 2rem);
    background: var(--vscode-editor-background);
    color: var(--vscode-editor-foreground);
    border: 1px solid var(--vscode-panel-border, var(--vscode-widget-border, transparent));
    border-radius: 8px;
    box-shadow: 0 16px 48px rgba(0, 0, 0, 0.35);
    overflow: hidden;
  }
  header { padding: 14px 16px 0; }
  .kind { opacity: 0.7; font-size: 12px; }
  h1 {
    margin: 2px 0 0;
    font-size: 13px;
    font-weight: 600;
    word-break: break-all;
  }
  .thread { overflow: auto; padding: 12px 16px; min-height: 0; }
  .question { margin: 0 0 8px; font-weight: 600; white-space: pre-wrap; word-break: break-word; }
  .answer {
    margin: 0;
    white-space: pre-wrap;
    word-break: break-word;
    font-family: var(--vscode-editor-font-family, var(--vscode-font-family));
  }
  .status { margin: 8px 0 0; opacity: 0.75; }
  .error { margin: 8px 0 0; color: var(--vscode-errorForeground); white-space: pre-wrap; }
  form { display: flex; flex-direction: column; gap: 8px; padding: 12px 16px 16px; }
  textarea {
    resize: vertical;
    min-height: 4.5rem;
    padding: 8px;
    border-radius: 4px;
    border: 1px solid var(--vscode-input-border, transparent);
    background: var(--vscode-input-background);
    color: var(--vscode-input-foreground);
    font: inherit;
  }
  .actions { display: flex; justify-content: flex-end; gap: 8px; }
  button {
    border: none;
    border-radius: 4px;
    padding: 4px 12px;
    cursor: pointer;
    font: inherit;
  }
  button.primary { background: var(--vscode-button-background); color: var(--vscode-button-foreground); }
  button.primary:hover { background: var(--vscode-button-hoverBackground); }
  button.secondary { background: var(--vscode-button-secondaryBackground); color: var(--vscode-button-secondaryForeground); }
  button:disabled { opacity: 0.45; cursor: default; }
</style>
</head>
<body>
  <div class="card" role="dialog" aria-labelledby="path">
    <header>
      <div class="kind" id="kind"></div>
      <h1 id="path"></h1>
    </header>
    <div class="thread" id="thread" hidden>
      <p class="question" id="q"></p>
      <pre class="answer" id="answer" hidden></pre>
      <p class="status" id="status" hidden></p>
      <p class="error" id="error" hidden></p>
    </div>
    <form id="form">
      <textarea id="question" rows="3" placeholder="想问什么，比如这个名字是什么意思"></textarea>
      <div class="actions">
        <button type="button" class="secondary" id="stop" hidden>停止</button>
        <button type="submit" class="primary" id="send" disabled>发送</button>
      </div>
    </form>
  </div>
  <script nonce="${nonce}">
    const vscode = acquireVsCodeApi()
    const pathEl = document.getElementById('path')
    const kindEl = document.getElementById('kind')
    const thread = document.getElementById('thread')
    const questionEl = document.getElementById('q')
    const answerEl = document.getElementById('answer')
    const statusEl = document.getElementById('status')
    const errorEl = document.getElementById('error')
    const form = document.getElementById('form')
    const input = document.getElementById('question')
    const sendBtn = document.getElementById('send')
    const stopBtn = document.getElementById('stop')
    let running = false
    let text = ''
    let activity = ''
    let frame

    const paint = () => {
      frame = undefined
      answerEl.textContent = text
      answerEl.hidden = text === ''
      if (!running)
        return
      statusEl.hidden = false
      statusEl.textContent = activity || (text === '' ? '正在想…' : '正在回答…')
    }

    const setRunning = (on) => {
      running = on
      input.disabled = on
      stopBtn.hidden = !on
      if (!on)
        statusEl.hidden = true
      sendBtn.disabled = on || input.value.trim() === ''
    }

    window.addEventListener('message', (event) => {
      const msg = event.data
      if (!msg || typeof msg.type !== 'string')
        return
      if (msg.type === 'reset') {
        clearTimeout(frame)
        text = ''
        activity = ''
        pathEl.textContent = typeof msg.path === 'string' ? msg.path : ''
        kindEl.textContent = msg.kind === 'folder' ? '文件夹' : '文件'
        questionEl.textContent = ''
        answerEl.textContent = ''
        answerEl.hidden = true
        errorEl.hidden = true
        errorEl.textContent = ''
        thread.hidden = true
        input.value = ''
        setRunning(false)
        input.focus()
        return
      }
      if (msg.type === 'asked') {
        thread.hidden = false
        questionEl.textContent = typeof msg.question === 'string' ? msg.question : ''
        text = ''
        activity = ''
        answerEl.textContent = ''
        answerEl.hidden = true
        errorEl.hidden = true
        errorEl.textContent = ''
        setRunning(true)
        paint()
        return
      }
      if (msg.type === 'stream') {
        if (typeof msg.text === 'string') {
          text = msg.text
          activity = ''
        }
        if (typeof msg.activity === 'string')
          activity = msg.activity
        frame ??= setTimeout(paint, 80)
        return
      }
      if (msg.type === 'end') {
        clearTimeout(frame)
        paint()
        setRunning(false)
        if (msg.status === 'failed') {
          errorEl.hidden = false
          errorEl.textContent = typeof msg.error === 'string' && msg.error ? msg.error : '没答成。'
        }
        else if (msg.status === 'stopped') {
          errorEl.hidden = false
          errorEl.textContent = '已停止。'
        }
      }
    })

    const send = () => {
      const question = input.value.trim()
      if (!question || running)
        return
      vscode.postMessage({ type: 'ask', question })
    }

    form.addEventListener('submit', (event) => {
      event.preventDefault()
      send()
    })
    input.addEventListener('input', () => {
      sendBtn.disabled = running || input.value.trim() === ''
    })
    input.addEventListener('keydown', (event) => {
      if (event.key === 'Enter' && !event.shiftKey && !event.isComposing) {
        event.preventDefault()
        send()
      }
    })
    stopBtn.addEventListener('click', () => vscode.postMessage({ type: 'stop' }))
    vscode.postMessage({ type: 'ready' })
  </script>
</body>
</html>`
}