hotfix: fix command plugin
This commit is contained in:
parent
6b488e4fc9
commit
f1b47b69f8
@ -17,6 +17,8 @@ import { useApp } from '../../../contexts/AppContext'
|
|||||||
import { MentionableImage } from '../../../types/mentionable'
|
import { MentionableImage } from '../../../types/mentionable'
|
||||||
import { fuzzySearch } from '../../../utils/fuzzy-search'
|
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 DragDropPaste from './plugins/image/DragDropPastePlugin'
|
||||||
import ImagePastePlugin from './plugins/image/ImagePastePlugin'
|
import ImagePastePlugin from './plugins/image/ImagePastePlugin'
|
||||||
import AutoLinkMentionPlugin from './plugins/mention/AutoLinkMentionPlugin'
|
import AutoLinkMentionPlugin from './plugins/mention/AutoLinkMentionPlugin'
|
||||||
@ -27,8 +29,6 @@ import OnEnterPlugin from './plugins/on-enter/OnEnterPlugin'
|
|||||||
import OnMutationPlugin, {
|
import OnMutationPlugin, {
|
||||||
NodeMutations,
|
NodeMutations,
|
||||||
} from './plugins/on-mutation/OnMutationPlugin'
|
} from './plugins/on-mutation/OnMutationPlugin'
|
||||||
import CreateCommandPopoverPlugin from './plugins/command/CreateCommandPopoverPlugin'
|
|
||||||
import CommandPlugin from './plugins/command/CommandPlugin'
|
|
||||||
|
|
||||||
export type LexicalContentEditableProps = {
|
export type LexicalContentEditableProps = {
|
||||||
editorRef: RefObject<LexicalEditor>
|
editorRef: RefObject<LexicalEditor>
|
||||||
|
|||||||
@ -2,36 +2,25 @@ import { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext
|
|||||||
import clsx from 'clsx'
|
import clsx from 'clsx'
|
||||||
import {
|
import {
|
||||||
$parseSerializedNode,
|
$parseSerializedNode,
|
||||||
COMMAND_PRIORITY_NORMAL, SerializedLexicalNode, TextNode
|
COMMAND_PRIORITY_NORMAL,
|
||||||
|
TextNode
|
||||||
} from 'lexical'
|
} from 'lexical'
|
||||||
import { Slash } from 'lucide-react'
|
import { Slash } from 'lucide-react'
|
||||||
import { useCallback, useEffect, useMemo, useState } from 'react'
|
import { useCallback, useEffect, useMemo, useState } from 'react'
|
||||||
import { createPortal } from 'react-dom'
|
import { createPortal } from 'react-dom'
|
||||||
|
|
||||||
import { lexicalNodeToPlainText } from '../../../../../components/chat-view/chat-input/utils/editor-state-to-plain-text'
|
import { QuickCommand, useCommands } from '../../../../../hooks/use-commands'
|
||||||
import { useDatabase } from '../../../../../contexts/DatabaseContext'
|
|
||||||
import { DBManager } from '../../../../../database/database-manager'
|
|
||||||
import { MenuOption } from '../shared/LexicalMenu'
|
import { MenuOption } from '../shared/LexicalMenu'
|
||||||
import {
|
import {
|
||||||
LexicalTypeaheadMenuPlugin,
|
LexicalTypeaheadMenuPlugin,
|
||||||
useBasicTypeaheadTriggerMatch,
|
useBasicTypeaheadTriggerMatch,
|
||||||
} from '../typeahead-menu/LexicalTypeaheadMenuPlugin'
|
} from '../typeahead-menu/LexicalTypeaheadMenuPlugin'
|
||||||
|
|
||||||
|
|
||||||
export type Command = {
|
|
||||||
id: string
|
|
||||||
name: string
|
|
||||||
content: { nodes: SerializedLexicalNode[] }
|
|
||||||
createdAt: Date
|
|
||||||
updatedAt: Date
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
class CommandTypeaheadOption extends MenuOption {
|
class CommandTypeaheadOption extends MenuOption {
|
||||||
name: string
|
name: string
|
||||||
command: Command
|
command: QuickCommand
|
||||||
|
|
||||||
constructor(name: string, command: Command) {
|
constructor(name: string, command: QuickCommand) {
|
||||||
super(name)
|
super(name)
|
||||||
this.name = name
|
this.name = name
|
||||||
this.command = command
|
this.command = command
|
||||||
@ -75,42 +64,21 @@ function CommandMenuItem({
|
|||||||
|
|
||||||
export default function CommandPlugin() {
|
export default function CommandPlugin() {
|
||||||
const [editor] = useLexicalComposerContext()
|
const [editor] = useLexicalComposerContext()
|
||||||
const [commands, setCommands] = useState<Command[]>([])
|
|
||||||
|
|
||||||
const { getDatabaseManager } = useDatabase()
|
const { commandList } = useCommands()
|
||||||
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 [queryString, setQueryString] = useState<string | null>(null)
|
const [queryString, setQueryString] = useState<string | null>(null)
|
||||||
const [searchResults, setSearchResults] = useState<Command[]>([])
|
const [searchResults, setSearchResults] = useState<QuickCommand[]>([])
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
if (queryString == null) return
|
if (queryString == null) return
|
||||||
const filteredCommands = commands.filter(
|
const filteredCommands = commandList.filter(
|
||||||
command =>
|
command =>
|
||||||
command.name.toLowerCase().includes(queryString.toLowerCase()) ||
|
command.name.toLowerCase().includes(queryString.toLowerCase()) ||
|
||||||
command.content.nodes.map(lexicalNodeToPlainText).join('').toLowerCase().includes(queryString.toLowerCase())
|
command.contentText.toLowerCase().includes(queryString.toLowerCase())
|
||||||
)
|
)
|
||||||
setSearchResults(filteredCommands)
|
setSearchResults(filteredCommands)
|
||||||
}, [queryString, commands])
|
}, [queryString, commandList])
|
||||||
|
|
||||||
const options = useMemo(
|
const options = useMemo(
|
||||||
() =>
|
() =>
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user