clean up

Author: trangdoan982

apps/obsidian/src/utils/wikilinkDragHandler.ts

@@ -7,13 +7,10 @@ import {
   type DecorationSet,
   EditorView,
 } from "@codemirror/view";
-// @ts-expect-error - no types for @codemirror/state
-import type { Range } from "@codemirror/state";
 import { TFile } from "obsidian";
 import type DiscourseGraphPlugin from "~/index";
 
 const DRAG_ATTR = "data-dg-draggable";
-const DRAG_HANDLE_CLASS = "dg-wikilink-drag-handle";
 
 const buildObsidianUrl = (vaultName: string, filePath: string): string => {
   return `obsidian://open?vault=${encodeURIComponent(vaultName)}&file=${encodeURIComponent(filePath)}`;
@@ -127,11 +124,19 @@ class WikilinkDragHandleWidget extends WidgetType {
 
   toDOM(): HTMLElement {
     const handle = document.createElement("span");
-    handle.className = DRAG_HANDLE_CLASS;
+    handle.className =
+      "inline-block cursor-grab opacity-30 text-[10px] text-[var(--text-muted)] align-middle ml-0.5 transition-opacity duration-150 ease-in-out select-none";
     handle.draggable = true;
     handle.setAttribute("aria-label", "Drag to canvas");
     handle.textContent = "⠿";
 
+    handle.addEventListener("mouseenter", () => {
+      handle.style.opacity = "1";
+    });
+    handle.addEventListener("mouseleave", () => {
+      handle.style.opacity = "";
+    });
+
     handle.addEventListener("dragstart", (e) => {
       const file = resolveFileFromLinkText(this.linkPath, this.plugin);
       if (!file) {
@@ -153,7 +158,7 @@ const buildWidgetDecorations = (
   view: EditorView,
   plugin: DiscourseGraphPlugin,
 ): DecorationSet => {
-  const widgets: Range<Decoration>[] = [];
+  const widgets = [];
 
   for (const { from, to } of view.visibleRanges) {
     const text = view.state.doc.sliceString(from, to);
@@ -190,11 +195,7 @@ export const createWikilinkDragExtension = (
       }
 
       update(update: ViewUpdate): void {
-        if (
-          update.docChanged ||
-          update.viewportChanged ||
-          update.selectionSet
-        ) {
+        if (update.docChanged || update.viewportChanged) {
           this.decorations = buildWidgetDecorations(update.view, plugin);
         }
       }

apps/obsidian/styles.css

@@ -35,27 +35,6 @@
   background: var(--interactive-accent-hover);
 }
 
-/* Drag handle next to wikilinks in Live Preview */
-.dg-wikilink-drag-handle {
-  display: inline-block;
-  cursor: grab;
-  opacity: 0;
-  font-size: 10px;
-  vertical-align: middle;
-  margin-left: 2px;
-  color: var(--text-muted);
-  transition: opacity 0.15s ease;
-  user-select: none;
-}
-
-.cm-line:hover .dg-wikilink-drag-handle {
-  opacity: 0.6;
-}
-
-.dg-wikilink-drag-handle:hover {
-  opacity: 1 !important;
-}
-
 /* Neutralize host button styling inside our editor */
 .tldraw__editor button {
   background: transparent !important;