File size: 2,437 Bytes
68ed806 f43283a be99f83 f43283a 64b1da0 04225e2 454aa85 457b4e6 dcce454 e3b65ea dcce454 942993f e878c81 942993f b25a0c6 ddd1aa2 dcce454 be99f83 04225e2 f43283a 38eebf9 e3b65ea dcce454 e3b65ea 95ccaf9 8a7a5d9 e3b65ea b25a0c6 95ccaf9 f43283a b25a0c6 95ccaf9 b25a0c6 95ccaf9 b25a0c6 942993f b25a0c6 e3b65ea 36669dc e3b65ea 97cc326 e3b65ea dcce454 |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 |
import { useTranslate } from '@/hooks/common-hooks';
import { Flex } from 'antd';
import classNames from 'classnames';
import pick from 'lodash/pick';
import { Handle, NodeProps, Position } from 'reactflow';
import { Operator, operatorMap } from '../../constant';
import { NodeData } from '../../interface';
import OperatorIcon from '../../operator-icon';
import NodeDropdown from './dropdown';
import styles from './index.less';
import NodePopover from './popover';
const ZeroGapOperators = [
Operator.RewriteQuestion,
Operator.KeywordExtract,
Operator.ArXiv,
];
export function RagNode({
id,
data,
isConnectable = true,
selected,
}: NodeProps<NodeData>) {
const style = operatorMap[data.label as Operator];
const { t } = useTranslate('flow');
return (
<NodePopover nodeId={id}>
<section
className={classNames(styles.ragNode, {
[styles.selectedNode]: selected,
})}
style={{
...pick(style, ['backgroundColor', 'color']),
}}
>
<Handle
id="c"
type="source"
position={Position.Left}
isConnectable={isConnectable}
className={styles.handle}
></Handle>
<Handle type="source" position={Position.Top} id="d" isConnectable />
<Handle
type="source"
position={Position.Right}
isConnectable={isConnectable}
className={styles.handle}
id="b"
></Handle>
<Handle type="source" position={Position.Bottom} id="a" isConnectable />
<Flex
vertical
align="center"
justify={'space-around'}
// gap={ZeroGapOperators.some((x) => x === data.label) ? 0 : 6}
>
<Flex flex={1} justify="center" align="center">
<label htmlFor=""> </label>
</Flex>
<Flex flex={1}>
<OperatorIcon
name={data.label as Operator}
fontSize={style?.iconFontSize ?? 16}
width={style?.iconWidth}
></OperatorIcon>
</Flex>
<Flex flex={1}>
<NodeDropdown
id={id}
iconFontColor={style?.moreIconColor}
></NodeDropdown>
</Flex>
</Flex>
<section className={styles.bottomBox}>
<div className={styles.nodeName}>{data.name}</div>
</section>
</section>
</NodePopover>
);
}
|