From f1b47b69f8ef83e862823f8410eaa722e9adb614 Mon Sep 17 00:00:00 2001
From: duanfuxiang <duanfuxiang@haizhi.com>
Date: Sun, 27 Apr 2025 13:44:10 +0800
Subject: [PATCH] hotfix: fix command plugin

---
 .../chat-input/LexicalContentEditable.tsx     |  4 +-
 .../plugins/command/CommandPlugin.tsx         | 52 ++++---------------
 2 files changed, 12 insertions(+), 44 deletions(-)

diff --git a/src/components/chat-view/chat-input/LexicalContentEditable.tsx b/src/components/chat-view/chat-input/LexicalContentEditable.tsx
index 4292a8c..3d2209b 100644
--- a/src/components/chat-view/chat-input/LexicalContentEditable.tsx
+++ b/src/components/chat-view/chat-input/LexicalContentEditable.tsx
@@ -17,6 +17,8 @@ import { useApp } from '../../../contexts/AppContext'
 import { MentionableImage } from '../../../types/mentionable'
 import { fuzzySearch } from '../../../utils/fuzzy-search'
 
+import CommandPlugin from './plugins/command/CommandPlugin'
+import CreateCommandPopoverPlugin from './plugins/command/CreateCommandPopoverPlugin'
 import DragDropPaste from './plugins/image/DragDropPastePlugin'
 import ImagePastePlugin from './plugins/image/ImagePastePlugin'
 import AutoLinkMentionPlugin from './plugins/mention/AutoLinkMentionPlugin'
@@ -27,8 +29,6 @@ import OnEnterPlugin from './plugins/on-enter/OnEnterPlugin'
 import OnMutationPlugin, {
 	NodeMutations,
 } from './plugins/on-mutation/OnMutationPlugin'
-import CreateCommandPopoverPlugin from './plugins/command/CreateCommandPopoverPlugin'
-import CommandPlugin from './plugins/command/CommandPlugin'
 
 export type LexicalContentEditableProps = {
 	editorRef: RefObject<LexicalEditor>
diff --git a/src/components/chat-view/chat-input/plugins/command/CommandPlugin.tsx b/src/components/chat-view/chat-input/plugins/command/CommandPlugin.tsx
index ceb7695..c7f7b88 100644
--- a/src/components/chat-view/chat-input/plugins/command/CommandPlugin.tsx
+++ b/src/components/chat-view/chat-input/plugins/command/CommandPlugin.tsx
@@ -2,36 +2,25 @@ import { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext
 import clsx from 'clsx'
 import {
 	$parseSerializedNode,
-	COMMAND_PRIORITY_NORMAL, SerializedLexicalNode, TextNode
+	COMMAND_PRIORITY_NORMAL,
+	TextNode
 } from 'lexical'
 import { Slash } from 'lucide-react'
 import { useCallback, useEffect, useMemo, useState } from 'react'
 import { createPortal } from 'react-dom'
 
-import { lexicalNodeToPlainText } from '../../../../../components/chat-view/chat-input/utils/editor-state-to-plain-text'
-import { useDatabase } from '../../../../../contexts/DatabaseContext'
-import { DBManager } from '../../../../../database/database-manager'
+import { QuickCommand, useCommands } from '../../../../../hooks/use-commands'
 import { MenuOption } from '../shared/LexicalMenu'
 import {
 	LexicalTypeaheadMenuPlugin,
 	useBasicTypeaheadTriggerMatch,
 } from '../typeahead-menu/LexicalTypeaheadMenuPlugin'
 
-
-export type Command = {
-	id: string
-	name: string
-	content: { nodes: SerializedLexicalNode[] }
-	createdAt: Date
-	updatedAt: Date
-}
-
-
 class CommandTypeaheadOption extends MenuOption {
 	name: string
-	command: Command
+	command: QuickCommand
 
-	constructor(name: string, command: Command) {
+	constructor(name: string, command: QuickCommand) {
 		super(name)
 		this.name = name
 		this.command = command
@@ -75,42 +64,21 @@ function CommandMenuItem({
 
 export default function CommandPlugin() {
 	const [editor] = useLexicalComposerContext()
-	const [commands, setCommands] = useState<Command[]>([])
 
-	const { getDatabaseManager } = useDatabase()
-	const getManager = useCallback(async (): Promise<DBManager> => {
-		return await getDatabaseManager()
-	}, [getDatabaseManager])
-
-	const fetchCommands = useCallback(async () => {
-		const dbManager = await getManager()
-		dbManager.getCommandManager().getAllCommands((rows) => {
-			setCommands(rows.map((row) => ({
-				id: row.id,
-				name: row.name,
-				content: row.content,
-				createdAt: row.createdAt,
-				updatedAt: row.updatedAt,
-			})))
-		})
-	}, [getManager])
-
-	useEffect(() => {
-		void fetchCommands()
-	}, [fetchCommands])
+	const { commandList } = useCommands()
 
 	const [queryString, setQueryString] = useState<string | null>(null)
-	const [searchResults, setSearchResults] = useState<Command[]>([])
+	const [searchResults, setSearchResults] = useState<QuickCommand[]>([])
 
 	useEffect(() => {
 		if (queryString == null) return
-		const filteredCommands = commands.filter(
+		const filteredCommands = commandList.filter(
 			command =>
 				command.name.toLowerCase().includes(queryString.toLowerCase()) ||
-				command.content.nodes.map(lexicalNodeToPlainText).join('').toLowerCase().includes(queryString.toLowerCase())
+				command.contentText.toLowerCase().includes(queryString.toLowerCase())
 		)
 		setSearchResults(filteredCommands)
-	}, [queryString, commands])
+	}, [queryString, commandList])
 
 	const options = useMemo(
 		() =>