File size: 2,498 Bytes
5743e5f 8441328 12f28d5 5743e5f f5ebe5e bdb8bf3 e3322d7 09502ac ad5587c 09502ac ad5587c e3322d7 f72cd8c 8441328 12f28d5 5743e5f bdb8bf3 5743e5f f5ebe5e 5743e5f ad5587c e3322d7 8441328 bdb8bf3 4928b00 bdb8bf3 8441328 f72cd8c 12f28d5 8441328 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 |
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 { Link, useParams } from 'umi';
import FlowIdModal from '../flow-id-modal';
import {
useSaveGraph,
useSaveGraphBeforeOpeningDebugDrawer,
useWatchAgentChange,
} from '../hooks';
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);
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={handleRun}>
<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;
|