diff --git a/web/src/constants/common.ts b/web/src/constants/common.ts
index 425715f3a..c32296687 100644
--- a/web/src/constants/common.ts
+++ b/web/src/constants/common.ts
@@ -138,3 +138,10 @@ export const ExceptiveType = ['xlsx', 'xls', 'pdf', 'docx', ...Images];
export const SupportedPreviewDocumentTypes = [...ExceptiveType];
//#endregion
+
+export enum Platform {
+ RAGFlow = 'RAGFlow',
+ Dify = 'Dify',
+ FastGPT = 'FastGPT',
+ Coze = 'Coze',
+}
diff --git a/web/src/pages/agent/hooks/use-export-json.ts b/web/src/pages/agent/hooks/use-export-json.ts
index 5b8618de8..9bffd47a9 100644
--- a/web/src/pages/agent/hooks/use-export-json.ts
+++ b/web/src/pages/agent/hooks/use-export-json.ts
@@ -1,9 +1,10 @@
-import { FileMimeType } from '@/constants/common';
+import { useToast } from '@/components/hooks/use-toast';
+import { FileMimeType, Platform } from '@/constants/common';
import { useSetModalState } from '@/hooks/common-hooks';
import { useFetchFlow } from '@/hooks/flow-hooks';
import { IGraph } from '@/interfaces/database/flow';
import { downloadJsonFile } from '@/utils/file-util';
-import { message, UploadFile } from 'antd';
+import { message } from 'antd';
import isEmpty from 'lodash/isEmpty';
import { useCallback } from 'react';
import { useTranslation } from 'react-i18next';
@@ -20,13 +21,21 @@ export const useHandleExportOrImportJsonFile = () => {
const setGraphInfo = useSetGraphInfo();
const { data } = useFetchFlow();
const { t } = useTranslation();
+ const { toast } = useToast();
const onFileUploadOk = useCallback(
- async (fileList: UploadFile[]) => {
+ async ({
+ fileList,
+ platform,
+ }: {
+ fileList: File[];
+ platform: Platform;
+ }) => {
+ console.log('🚀 ~ useHandleExportOrImportJsonFile ~ platform:', platform);
if (fileList.length > 0) {
- const file: File = fileList[0] as unknown as File;
+ const file = fileList[0];
if (file.type !== FileMimeType.Json) {
- message.error(t('flow.jsonUploadTypeErrorMessage'));
+ toast({ title: t('flow.jsonUploadTypeErrorMessage') });
return;
}
@@ -45,7 +54,7 @@ export const useHandleExportOrImportJsonFile = () => {
}
}
},
- [hideFileUploadModal, setGraphInfo, t],
+ [hideFileUploadModal, setGraphInfo, t, toast],
);
const handleExportJson = useCallback(() => {
diff --git a/web/src/pages/agent/index.tsx b/web/src/pages/agent/index.tsx
index 906427979..463e58f36 100644
--- a/web/src/pages/agent/index.tsx
+++ b/web/src/pages/agent/index.tsx
@@ -1,12 +1,35 @@
import { PageHeader } from '@/components/page-header';
import { Button } from '@/components/ui/button';
+import {
+ DropdownMenu,
+ DropdownMenuContent,
+ DropdownMenuItem,
+ DropdownMenuSeparator,
+ DropdownMenuTrigger,
+} from '@/components/ui/dropdown-menu';
import { SidebarProvider, SidebarTrigger } from '@/components/ui/sidebar';
import { useSetModalState } from '@/hooks/common-hooks';
import { useNavigatePage } from '@/hooks/logic-hooks/navigate-hooks';
-import { Trash2 } from 'lucide-react';
+import { CodeXml, EllipsisVertical, Forward, Import, Key } from 'lucide-react';
+import { ComponentPropsWithoutRef } from 'react';
+import { useTranslation } from 'react-i18next';
import { AgentSidebar } from './agent-sidebar';
import FlowCanvas from './canvas';
+import { useHandleExportOrImportJsonFile } from './hooks/use-export-json';
import { useFetchDataOnMount } from './hooks/use-fetch-data';
+import { useOpenDocument } from './hooks/use-open-document';
+import { UploadAgentDialog } from './upload-agent-dialog';
+
+function AgentDropdownMenuItem({
+ children,
+ ...props
+}: ComponentPropsWithoutRef
) {
+ return (
+
+ {children}
+
+ );
+}
export default function Agent() {
const { navigateToAgentList } = useNavigatePage();
@@ -15,6 +38,15 @@ export default function Agent() {
hideModal: hideChatDrawer,
showModal: showChatDrawer,
} = useSetModalState();
+ const { t } = useTranslation();
+ const openDocument = useOpenDocument();
+ const {
+ handleExportJson,
+ handleImportJson,
+ fileUploadVisible,
+ onFileUploadOk,
+ hideFileUploadModal,
+ } = useHandleExportOrImportJsonFile();
useFetchDataOnMount();
@@ -22,15 +54,38 @@ export default function Agent() {
-
+
+
+
+
+
+
+ API
+
+
+
+
+ Import
+
+
+
+
+ Export
+
+
+
+
+ {t('common.embedIntoSite')}
+
+
+
+
+
-
@@ -54,6 +109,12 @@ export default function Agent() {
+ {fileUploadVisible && (
+