🐛 fix(vscode): 代码阅读 ⌘ 悬停每次现问定义，语言扩展启动后就能链上、点击总去跳

vscode/webview-ui/src/codeReader/useDefinitionLinks.ts

@@ -1,5 +1,5 @@
-import type { WebviewToExtension } from './types'
 import { useEffect, useState } from 'react'
+import { DefinitionLinks } from './definitionLinks'
 import { onMessage, postMessage } from './vscode'
 
 /** 跳到定义用的修饰键，按平台习惯：macOS 是 ⌘，其余是 Ctrl。 */
@@ -18,63 +18,30 @@ function offsetOf(el: HTMLElement | null): number | undefined {
   return el?.dataset.offset === undefined ? undefined : Number(el.dataset.offset)
 }
 
-/**
- * 和 VS Code 编辑器里一样：按住 ⌘ / Ctrl、鼠标停在查得到定义的名字上时，名字显示成链接（data-link），点一下跳到定义。
- * 有没有定义问扩展端，回答按文档版本缓存：同一版本里每个名字只问一次，换了版本清空，迟到的旧版本回答丢掉。
- */
-class DefinitionLinks {
-  private version: number | undefined
-  /** 这个版本里问过的下标：true / false 是回答，undefined 是问了还没回 */
-  private readonly answers = new Map<number, boolean | undefined>()
+/** 指针下的名字、修饰键按没按；把链接样式（data-link）挂到指着的那个名字上。 */
+class Pointer {
   private hovered: HTMLElement | null = null
   private held = false
   private linked: HTMLElement | null = null
 
-  constructor(private readonly post: (msg: WebviewToExtension) => void) {}
+  constructor(private readonly links: DefinitionLinks) {}
 
-  setVersion(version: number | undefined): void {
-    if (version === this.version)
-      return
-    this.version = version
-    this.answers.clear()
-    this.update()
-  }
-
-  point(target: EventTarget | null, held: boolean): void {
+  move(target: EventTarget | null, held: boolean): void {
     this.hovered = nameAt(target)
     this.held = held
-    this.update()
+    this.sync()
   }
 
   hold(held: boolean): void {
     this.held = held
-    this.update()
+    this.sync()
   }
 
-  answer(version: number, offset: number, found: boolean): void {
-    if (version !== this.version)
-      return
-    this.answers.set(offset, found)
-    this.update()
-  }
-
-  /** ⌘ / Ctrl + 点击名字：跳到定义，并拦下这次点击，不让它再触发块上的切换。已知没有定义的名字照常点。 */
-  click(event: MouseEvent): void {
-    const offset = modifierHeld(event) ? offsetOf(nameAt(event.target)) : undefined
-    if (offset === undefined || this.version === undefined || this.answers.get(offset) === false)
-      return
-    event.preventDefault()
-    event.stopPropagation()
-    this.post({ type: 'goToDefinition', version: this.version, offset })
-  }
-
-  private update(): void {
-    const offset = this.held ? offsetOf(this.hovered) : undefined
-    if (offset !== undefined && this.version !== undefined && !this.answers.has(offset)) {
-      this.answers.set(offset, undefined)
-      this.post({ type: 'probeDefinition', version: this.version, offset })
-    }
-    const link = offset !== undefined && this.answers.get(offset) === true ? this.hovered : null
+  /** 把按住修饰键时指着的名字告诉 links，再按它的回答挂上或摘掉链接样式 */
+  sync(): void {
+    const offset = offsetOf(this.hovered)
+    this.links.point(this.held ? offset : undefined)
+    const link = offset !== undefined && offset === this.links.linked ? this.hovered : null
     if (link === this.linked)
       return
     this.linked?.removeAttribute('data-link')
@@ -83,26 +50,39 @@ class DefinitionLinks {
   }
 }
 
-/** 预览里的名字能 ⌘ / Ctrl + 点击跳到定义；version 是当前显示的文档版本，名字的下标属于它。 */
+/**
+ * 和 VS Code 编辑器里一样：按住 ⌘ / Ctrl、鼠标停在查得到定义的名字上时，名字显示成链接，点一下跳到定义。
+ * version 是当前显示的文档版本，名字的下标属于它。
+ */
 export function useDefinitionLinks(version: number | undefined): void {
   const [links] = useState(() => new DefinitionLinks(postMessage))
+  const [pointer] = useState(() => new Pointer(links))
 
   useEffect(() => {
     links.setVersion(version)
-  }, [links, version])
+    pointer.sync()
+  }, [links, pointer, version])
 
   useEffect(() => {
-    const onMove = (event: MouseEvent): void => links.point(event.target, modifierHeld(event))
+    const onMove = (event: MouseEvent): void => pointer.move(event.target, modifierHeld(event))
     const onOut = (event: MouseEvent): void => {
       if (event.relatedTarget === null)
-        links.point(null, false)
+        pointer.move(null, false)
+    }
+    const onKey = (event: KeyboardEvent): void => pointer.hold(modifierHeld(event))
+    const onBlur = (): void => pointer.hold(false)
+    // ⌘ / Ctrl + 点击名字归跳转：拦下这次点击，不让它再触发块上的编辑切换、折叠
+    const onClick = (event: MouseEvent): void => {
+      if (!links.click(modifierHeld(event) ? offsetOf(nameAt(event.target)) : undefined))
+        return
+      event.preventDefault()
+      event.stopPropagation()
     }
-    const onKey = (event: KeyboardEvent): void => links.hold(modifierHeld(event))
-    const onBlur = (): void => links.hold(false)
-    const onClick = (event: MouseEvent): void => links.click(event)
     const off = onMessage((msg) => {
-      if (msg.type === 'definitionProbed')
-        links.answer(msg.version, msg.offset, msg.found)
+      if (msg.type !== 'definitionProbed')
+        return
+      links.answer(msg.id, msg.found)
+      pointer.sync()
     })
     document.addEventListener('mousemove', onMove)
     document.addEventListener('mouseout', onOut)
@@ -120,5 +100,5 @@ export function useDefinitionLinks(version: number | undefined): void {
       window.removeEventListener('keyup', onKey)
       window.removeEventListener('blur', onBlur)
     }
-  }, [links])
+  }, [links, pointer])
 }