fix: plugin run & setting quote variables (#2150)

* fix

* fix

* change variables & variablelabels show condition

* fix type

* fix
This commit is contained in:
heheer
2024-07-25 18:01:43 +08:00
committed by GitHub
parent 55cefccad1
commit 5906daff9f
12 changed files with 89 additions and 51 deletions

View File

@@ -80,7 +80,6 @@ const JSONEditor = ({
const lineContent = model.getLineContent(position.lineNumber);
if (context.triggerCharacter) {
console.log(context.triggerCharacter);
triggerChar.current = context.triggerCharacter;
}
const word = model.getWordUntilPosition(position);

View File

@@ -13,7 +13,7 @@ import { VariableNode } from './plugins/VariablePlugin/node';
import { EditorState, LexicalEditor } from 'lexical';
import OnBlurPlugin from './plugins/OnBlurPlugin';
import MyIcon from '../../Icon';
import { EditorVariablePickerType } from './type.d';
import { EditorVariableLabelPickerType, EditorVariablePickerType } from './type.d';
import { getNanoid } from '@fastgpt/global/common/string/tools';
import FocusPlugin from './plugins/FocusPlugin';
import { textToEditorState } from './utils';
@@ -21,6 +21,7 @@ import { MaxLengthPlugin } from './plugins/MaxLengthPlugin';
import { VariableLabelNode } from './plugins/VariableLabelPlugin/node';
import VariableLabelPlugin from './plugins/VariableLabelPlugin';
import { useDeepCompareEffect } from 'ahooks';
import VariablePickerPlugin from './plugins/VariablePickerPlugin';
export default function Editor({
h = 200,
@@ -29,6 +30,7 @@ export default function Editor({
showOpenModal = true,
onOpenModal,
variables,
variableLabels,
onChange,
onBlur,
value,
@@ -41,6 +43,7 @@ export default function Editor({
showOpenModal?: boolean;
onOpenModal?: () => void;
variables: EditorVariablePickerType[];
variableLabels: EditorVariableLabelPickerType[];
onChange?: (editorState: EditorState, editor: LexicalEditor) => void;
onBlur?: (editor: LexicalEditor) => void;
value?: string;
@@ -130,9 +133,10 @@ export default function Editor({
});
}}
/>
<VariableLabelPickerPlugin variables={variables} isFocus={focus} />
<VariableLabelPlugin variables={variableLabels} />
<VariableLabelPickerPlugin variables={variableLabels} isFocus={focus} />
<VariablePlugin variables={variables} />
<VariableLabelPlugin variables={variables} />
<VariablePickerPlugin variables={variableLabels.length > 0 ? [] : variables} />
<OnBlurPlugin onBlur={onBlur} />
</LexicalComposer>
{showResize && (

View File

@@ -5,13 +5,14 @@ import Editor from './Editor';
import MyModal from '../../MyModal';
import { useTranslation } from 'next-i18next';
import { EditorState, type LexicalEditor } from 'lexical';
import { EditorVariablePickerType } from './type.d';
import { EditorVariableLabelPickerType, EditorVariablePickerType } from './type.d';
import { useCallback, useTransition } from 'react';
const PromptEditor = ({
showOpenModal = true,
showResize = true,
variables = [],
variableLabels = [],
value,
onChange,
onBlur,
@@ -24,6 +25,7 @@ const PromptEditor = ({
showOpenModal?: boolean;
showResize?: boolean;
variables?: EditorVariablePickerType[];
variableLabels?: EditorVariableLabelPickerType[];
value?: string;
onChange?: (text: string) => void;
onBlur?: (text: string) => void;
@@ -55,6 +57,7 @@ const PromptEditor = ({
showOpenModal={showOpenModal}
onOpenModal={onOpen}
variables={variables}
variableLabels={variableLabels}
h={h}
maxLength={maxLength}
value={value}
@@ -71,6 +74,7 @@ const PromptEditor = ({
showResize
showOpenModal={false}
variables={variables}
variableLabels={variableLabels}
value={value}
onChange={onChangeInput}
onBlur={onBlurInput}

View File

@@ -6,31 +6,31 @@ import { useCallback, useState } from 'react';
import * as ReactDOM from 'react-dom';
import { Box, Flex } from '@chakra-ui/react';
import { useBasicTypeaheadTriggerMatch } from '../../utils';
import { EditorVariablePickerType } from '../../type';
import { EditorVariableLabelPickerType } from '../../type';
import { WorkflowIOValueTypeEnum } from '@fastgpt/global/core/workflow/constants';
import { useTranslation } from 'react-i18next';
import Avatar from '../../../../Avatar';
type EditorVariablePickerType1 = {
interface EditorVariableItemType {
key: string;
label: string;
required?: boolean;
icon?: string;
valueType?: WorkflowIOValueTypeEnum;
index: number;
};
}
interface TransformedParent {
id: string;
label: string;
avatar: string;
children: EditorVariablePickerType1[];
children: EditorVariableItemType[];
}
export default function VariableLabelPickerPlugin({
variables,
isFocus
}: {
variables: EditorVariablePickerType[];
variables: EditorVariableLabelPickerType[];
isFocus: boolean;
}) {
const { t } = useTranslation();
@@ -110,7 +110,7 @@ export default function VariableLabelPickerPlugin({
</Box>
)}
{variableFilter(variables, queryString || '').length > 0 ? (
transformData(variableFilter(variables, queryString || '')).map((item) => {
transformVariables(variableFilter(variables, queryString || '')).map((item) => {
return (
<Flex
key={item.id}
@@ -192,14 +192,14 @@ export default function VariableLabelPickerPlugin({
);
}
function transformData(data: EditorVariablePickerType[]): TransformedParent[] {
function transformVariables(variables: EditorVariableLabelPickerType[]): TransformedParent[] {
const transformedData: TransformedParent[] = [];
const parentMap: { [key: string]: TransformedParent } = {};
data.forEach((item, index) => {
const parentId = item.parent!.id;
const parentLabel = item.parent!.label;
const parentAvatar = item.parent!.avatar;
variables.forEach((item, index) => {
const parentId = item.parent.id;
const parentLabel = item.parent.label;
const parentAvatar = item.parent.avatar;
if (!parentMap[parentId]) {
parentMap[parentId] = {
@@ -218,8 +218,8 @@ function transformData(data: EditorVariablePickerType[]): TransformedParent[] {
});
const addedParents = new Set<string>();
data.forEach((item) => {
const parentId = item.parent!.id;
variables.forEach((item) => {
const parentId = item.parent.id;
if (!addedParents.has(parentId)) {
transformedData.push(parentMap[parentId]);
addedParents.add(parentId);
@@ -230,15 +230,15 @@ function transformData(data: EditorVariablePickerType[]): TransformedParent[] {
}
function variableFilter(
data: EditorVariablePickerType[],
variables: EditorVariableLabelPickerType[],
queryString: string
): EditorVariablePickerType[] {
): EditorVariableLabelPickerType[] {
const lowerCaseQuery = queryString.toLowerCase();
return data.filter((item) => {
return variables.filter((item) => {
const labelMatch = item.label.toLowerCase().includes(lowerCaseQuery);
const keyMatch = item.key.toLowerCase().includes(lowerCaseQuery);
const parentLabelMatch = item.parent!.label.toLowerCase().includes(lowerCaseQuery);
const parentLabelMatch = item.parent.label.toLowerCase().includes(lowerCaseQuery);
return labelMatch || keyMatch || parentLabelMatch;
});

View File

@@ -1,6 +1,6 @@
import { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext';
import { EditorVariablePickerType } from '../../type';
import { useCallback, useEffect, useMemo } from 'react';
import { EditorVariableLabelPickerType } from '../../type';
import { useCallback, useEffect } from 'react';
import { $createVariableLabelNode, VariableLabelNode } from './node';
import { TextNode } from 'lexical';
import { getHashtagRegexString } from './utils';
@@ -12,7 +12,7 @@ const REGEX = new RegExp(getHashtagRegexString(), 'i');
export default function VariableLabelPlugin({
variables
}: {
variables: EditorVariablePickerType[];
variables: EditorVariableLabelPickerType[];
}) {
const [editor] = useLexicalComposerContext();
useEffect(() => {

View File

@@ -6,7 +6,15 @@ export type EditorVariablePickerType = {
required?: boolean;
icon?: string;
valueType?: WorkflowIOValueTypeEnum;
parent?: {
};
export type EditorVariableLabelPickerType = {
key: string;
label: string;
required?: boolean;
icon?: string;
valueType?: WorkflowIOValueTypeEnum;
parent: {
id: string;
label: string;
avatar?: string;