pengjunjie/ragflow
1
0
Fork 1
mirror of https://github.com/infiniflow/ragflow.git synced 2026-01-04 03:25:30 +08:00
Code Issues Packages Projects Releases Wiki Activity

Feat: Display mode at the begin node #10427 (#12326)

Browse Source 
### What problem does this PR solve?

Feat: Display mode at the begin node #10427
### Type of change


- [x] New Feature (non-breaking change which adds functionality)
This commit is contained in:
balibabu
2025-12-30 19:53:24 +08:00
committed by GitHub
parent a7e466142d
commit 348265afc1
3 changed files with 94 additions and 52 deletions
Download Patch File Download Diff File Expand all files Collapse all files

68
web/src/pages/agent/canvas/node/begin-node.tsx
View File

@ -1,16 +1,18 @@
import { IBeginNode } from '@/interfaces/database/flow';
import { BaseNode } from '@/interfaces/database/flow';
import { cn } from '@/lib/utils';
import { NodeProps, Position } from '@xyflow/react';
import get from 'lodash/get';
import { memo } from 'react';
import { useTranslation } from 'react-i18next';
import {
AgentDialogueMode,
BeginQueryType,
BeginQueryTypeIconMap,
NodeHandleId,
Operator,
} from '../../constant';
import { BeginQuery } from '../../interface';
import { BeginFormSchemaType } from '../../form/begin-form/schema';
import { useBuildWebhookUrl } from '../../hooks/use-build-webhook-url';
import OperatorIcon from '../../operator-icon';
import { LabelCard } from './card';
import { CommonHandle } from './handle';
@ -18,10 +20,19 @@ import { RightHandleStyle } from './handle-icon';
import styles from './index.less';
import { NodeWrapper } from './node-wrapper';
// TODO: do not allow other nodes to connect to this node
function InnerBeginNode({ data, id, selected }: NodeProps<IBeginNode>) {
function InnerBeginNode({
data,
id,
selected,
}: NodeProps<BaseNode<BeginFormSchemaType>>) {
const { t } = useTranslation();
const inputs: Record<string, BeginQuery> = get(data, 'form.inputs', {});
const inputs = get(data, 'form.inputs', {});
const mode = data.form?.mode;
const isWebhookMode = mode === AgentDialogueMode.Webhook;
const url = useBuildWebhookUrl();
return (
<NodeWrapper selected={selected} id={id}>
@ -40,23 +51,38 @@ function InnerBeginNode({ data, id, selected }: NodeProps<IBeginNode>) {
{t(`flow.begin`)}
</div>
</section>
<section className={cn(styles.generateParameters, 'flex gap-2 flex-col')}>
{Object.entries(inputs).map(([key, val], idx) => {
const Icon = BeginQueryTypeIconMap[val.type as BeginQueryType];
return (
<LabelCard key={idx} className={cn('flex gap-1.5 items-center')}>
<Icon className="size-3.5" />
<label htmlFor="" className="text-accent-primary text-sm italic">
{key}
</label>
<LabelCard className="py-0.5 truncate flex-1">
{val.name}
<div className="text-accent-primary mt-2 p-1 bg-bg-accent w-fit rounded-sm text-xs">
{t(`flow.${isWebhookMode ? 'webhook.name' : mode}`)}
</div>
{isWebhookMode ? (
<LabelCard className="mt-2 flex gap-1 items-center">
<span className="font-bold">URL</span>
<span className="flex-1 truncate">{url}</span>
</LabelCard>
) : (
<section
className={cn(styles.generateParameters, 'flex gap-2 flex-col')}
>
{Object.entries(inputs).map(([key, val], idx) => {
const Icon = BeginQueryTypeIconMap[val.type as BeginQueryType];
return (
<LabelCard key={idx} className={cn('flex gap-1.5 items-center')}>
<Icon className="size-3.5" />
<label
htmlFor=""
className="text-accent-primary text-sm italic"
>
{key}
</label>
<LabelCard className="py-0.5 truncate flex-1">
{val.name}
</LabelCard>
<span className="flex-1">{val.optional ? 'Yes' : 'No'}</span>
</LabelCard>
<span className="flex-1">{val.optional ? 'Yes' : 'No'}</span>
</LabelCard>
);
})}
</section>
);
})}
</section>
)}
</NodeWrapper>
);
}