File size: 2,934 Bytes
5743e5f 8441328 12f28d5 f859b0d 5743e5f f5ebe5e bdb8bf3 f859b0d bdb8bf3 f859b0d e3322d7 09502ac ad5587c 09502ac ad5587c e3322d7 f859b0d 8441328 12f28d5 5743e5f bdb8bf3 5743e5f f5ebe5e 5743e5f ad5587c f859b0d e3322d7 8441328 bdb8bf3 4928b00 bdb8bf3 8441328 f859b0d 12f28d5 8441328 f859b0d 12f28d5 8441328 f5ebe5e 5743e5f f5ebe5e 5743e5f 8441328 5743e5f f5ebe5e 8441328 e3322d7 |
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 87 88 89 90 91 92 93 94 95 |
import ChatOverviewModal from '@/components/api-service/chat-overview-modal';
import { useSetModalState, useTranslate } from '@/hooks/common-hooks';
import { useFetchFlow } from '@/hooks/flow-hooks';
import { ArrowLeftOutlined } from '@ant-design/icons';
import { Button, Flex, Space } from 'antd';
import { useCallback } from 'react';
import { Link, useParams } from 'umi';
import FlowIdModal from '../flow-id-modal';
import {
useGetBeginNodeDataQuery,
useSaveGraph,
useSaveGraphBeforeOpeningDebugDrawer,
useWatchAgentChange,
} from '../hooks';
import { BeginQuery } from '../interface';
import styles from './index.less';
interface IProps {
showChatDrawer(): void;
chatDrawerVisible: boolean;
}
const FlowHeader = ({ showChatDrawer, chatDrawerVisible }: IProps) => {
const { saveGraph } = useSaveGraph();
const { handleRun } = useSaveGraphBeforeOpeningDebugDrawer(showChatDrawer);
const { data } = useFetchFlow();
const { t } = useTranslate('flow');
const {
visible: overviewVisible,
hideModal: hideOverviewModal,
// showModal: showOverviewModal,
} = useSetModalState();
const { visible, hideModal, showModal } = useSetModalState();
const { id } = useParams();
const time = useWatchAgentChange(chatDrawerVisible);
const getBeginNodeDataQuery = useGetBeginNodeDataQuery();
const handleRunAgent = useCallback(() => {
const query: BeginQuery[] = getBeginNodeDataQuery();
if (query.length > 0) {
showChatDrawer();
} else {
handleRun();
}
}, [getBeginNodeDataQuery, handleRun, showChatDrawer]);
return (
<>
<Flex
align="center"
justify={'space-between'}
gap={'large'}
className={styles.flowHeader}
>
<Space size={'large'}>
<Link to={`/flow`}>
<ArrowLeftOutlined />
</Link>
<div className="flex flex-col">
<span className="font-semibold text-[18px]">{data.title}</span>
<span className="font-normal text-sm">
{t('autosaved')} {time}
</span>
</div>
</Space>
<Space size={'large'}>
<Button onClick={handleRunAgent}>
<b>{t('run')}</b>
</Button>
<Button type="primary" onClick={() => saveGraph()}>
<b>{t('save')}</b>
</Button>
{/* <Button type="primary" onClick={showOverviewModal} disabled>
<b>{t('publish')}</b>
</Button> */}
<Button type="primary" onClick={showModal}>
<b>Agent ID</b>
</Button>
</Space>
</Flex>
{overviewVisible && (
<ChatOverviewModal
visible={overviewVisible}
hideModal={hideOverviewModal}
id={id!}
idKey="canvasId"
></ChatOverviewModal>
)}
{visible && <FlowIdModal hideModal={hideModal}></FlowIdModal>}
</>
);
};
export default FlowHeader;
|