feat: add wiki-link autocomplete in editor (closes #63)

apps/web/src/components/knowledge/EntryEditor.tsx

@@ -1,6 +1,7 @@
 "use client";
 
-import React, { useState } from "react";
+import React, { useState, useRef } from "react";
+import { LinkAutocomplete } from "./LinkAutocomplete";
 
 interface EntryEditorProps {
   content: string;
@@ -8,13 +9,14 @@ interface EntryEditorProps {
 }
 
 /**
- * EntryEditor - Markdown editor with live preview
+ * EntryEditor - Markdown editor with live preview and link autocomplete
  */
 export function EntryEditor({ content, onChange }: EntryEditorProps) {
   const [showPreview, setShowPreview] = useState(false);
+  const textareaRef = useRef<HTMLTextAreaElement>(null);
 
   return (
-    <div className="entry-editor">
+    <div className="entry-editor relative">
       <div className="flex justify-between items-center mb-2">
         <label className="block text-sm font-medium text-gray-700 dark:text-gray-300">
           Content (Markdown)
@@ -33,16 +35,23 @@ export function EntryEditor({ content, onChange }: EntryEditorProps) {
           <div className="whitespace-pre-wrap">{content}</div>
         </div>
       ) : (
-        <textarea
-          value={content}
-          onChange={(e) => onChange(e.target.value)}
-          className="w-full min-h-[300px] p-4 border border-gray-300 dark:border-gray-700 rounded-md bg-white dark:bg-gray-900 text-gray-900 dark:text-gray-100 font-mono text-sm focus:ring-2 focus:ring-blue-500 focus:border-transparent"
-          placeholder="Write your content here... (Markdown supported)"
-        />
+        <div className="relative">
+          <textarea
+            ref={textareaRef}
+            value={content}
+            onChange={(e) => onChange(e.target.value)}
+            className="w-full min-h-[300px] p-4 border border-gray-300 dark:border-gray-700 rounded-md bg-white dark:bg-gray-900 text-gray-900 dark:text-gray-100 font-mono text-sm focus:ring-2 focus:ring-blue-500 focus:border-transparent"
+            placeholder="Write your content here... (Markdown supported)"
+          />
+          <LinkAutocomplete
+            textareaRef={textareaRef}
+            onInsert={(newContent) => onChange(newContent)}
+          />
+        </div>
       )}
 
       <p className="mt-2 text-xs text-gray-500 dark:text-gray-400">
-        Supports Markdown formatting. Use the Preview button to see how it will look.
+        Supports Markdown formatting. Type <code className="text-xs">[[</code> to insert links to other entries.
       </p>
     </div>
   );