[ { "path": ".eslintrc.json", "content": "{\n \"extends\": \"next/core-web-vitals\"\n}\n" }, { "path": ".github/ISSUE_TEMPLATE/✨-feature-request.md", "content": "---\nname: \"✨ Feature Request\"\nabout: Suggest a new feature idea.\ntitle: \"[feature]\"\nlabels: ''\nassignees: ''\n\n---\n\n**Is your feature request related to a problem? Please describe.**\nA clear and concise description of what the problem is. Ex. I'm always frustrated when [...]\n\n**Describe the solution you'd like**\nA clear and concise description of what you want to happen.\n\n**Describe alternatives you've considered**\nA clear and concise description of any alternative solutions or features you've considered.\n\n**Additional context**\nAdd any other context or screenshots about the feature request here.\n" }, { "path": ".github/ISSUE_TEMPLATE/🐛-bug-report.md", "content": "---\nname: \"\\U0001F41B Bug report\"\nabout: Report an unexpected problem or unintended behavior.\ntitle: \"[BUG] \"\nlabels: ''\nassignees: ''\n\n---\n\n\n\n**Describe the bug**\nA clear and concise description of what the bug is.\n\n**To Reproduce**\nSteps to reproduce the behavior:\n1. Go to '...'\n2. Click on '....'\n3. Scroll down to '....'\n4. See error\n\n**Expected behavior**\nA clear and concise description of what you expected to happen.\n\n**Screenshots**\nIf applicable, add screenshots to help explain your problem.\n\n**Desktop (please complete the following information):**\n - OS: [e.g. iOS]\n - Browser [e.g. chrome, safari]\n - Version [e.g. 22]\n\n**Smartphone (please complete the following information):**\n - Device: [e.g. iPhone6]\n - OS: [e.g. iOS8.1]\n - Browser [e.g. stock browser, safari]\n - Version [e.g. 22]\n\n**Additional context**\nAdd any other context about the problem here.\n" }, { "path": ".github/ISSUE_TEMPLATE/📜-documentation.md", "content": "---\nname: \"\\U0001F4DC Documentation\"\nabout: Correct spelling errors, improvements or additions to documentation files (README,\n CONTRIBUTING...).\ntitle: \"[Doc]\"\nlabels: ''\nassignees: ''\n\n---\n\n**Is your feature request related to a problem? Please describe.**\nA clear and concise description of what the problem is. Ex. I'm always frustrated when [...]\n\n**Describe the solution you'd like**\nA clear and concise description of what you want to happen.\n\n**Describe alternatives you've considered**\nA clear and concise description of any alternative solutions or features you've considered.\n\n**Additional context**\nAdd any other context or screenshots about the feature request here.\n" }, { "path": ".github/ISSUE_TEMPLATE/🔧-improvement.md", "content": "---\nname: \"\\U0001F527 Improvement\"\nabout: Suggest an idea which is not a feature.\ntitle: ''\nlabels: ''\nassignees: ''\n\n---\n\n\n\n### Expected Behavior\n\n### Actual Behavior\n\n### Proposal\n" }, { "path": ".github/ISSUE_TEMPLATE/🙋-question.md", "content": "---\nname: \"\\U0001F64B Question\"\nabout: Ask a question about DB-GPT-Web.\ntitle: ''\nlabels: ''\nassignees: ''\n\n---\n\n\n\n### Question\n" }, { "path": ".gitignore", "content": "# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.\n\n# dependencies\n/node_modules\n/.pnp\n.pnp.js\n\n# testing\n/coverage\n\n.idea\n# next.js\n/.next/\n/out/\n\n# production\n/build\n\n# misc\n.DS_Store\n*.pem\n\n# debug\nnpm-debug.log*\nyarn-debug.log*\nyarn-error.log*\nmock\n\n# local env files\n.env.prod\n.env\n\n# vercel\n.vercel\n\n# typescript\n*.tsbuildinfo\nnext-env.d.ts\n.next" }, { "path": ".npmrc", "content": "registry=http://registry.npmjs.org" }, { "path": ".vscode/extensions.json", "content": "{\n \"recommendations\": [\n \"bradlc.vscode-tailwindcss\",\n \"esbenp.prettier-vscode\",\n \"dbaeumer.vscode-eslint\",\n \"formulahendry.auto-close-tag\",\n \"formulahendry.auto-rename-tag\",\n \"vincaslt.highlight-matching-tag\",\n \"ionutvmi.path-autocomplete\"\n ]\n}\n" }, { "path": ".vscode/settings.json", "content": "{\n \"editor.formatOnSave\": true,\n \"editor.codeActionsOnSave\": {\n \"source.fixAll\": \"explicit\"\n },\n \"prettier.arrowParens\": \"always\",\n \"prettier.tabWidth\": 2,\n \"prettier.printWidth\": 150,\n \"prettier.singleQuote\": true,\n \"prettier.semi\": true,\n \"prettier.trailingComma\": \"all\",\n \"[typescript]\": {\n \"editor.defaultFormatter\": \"esbenp.prettier-vscode\"\n },\n \"[typescriptreact]\": {\n \"editor.defaultFormatter\": \"esbenp.prettier-vscode\"\n },\n \"[css]\": {\n \"editor.defaultFormatter\": \"esbenp.prettier-vscode\"\n },\n \"tailwindCSS.includeLanguages\": {\n \"plaintext\": \"typescriptreact\"\n },\n \"editor.quickSuggestions\": {\n \"strings\": true\n },\n \"cSpell.words\": [\"DBGPT\"]\n}\n" }, { "path": "README.md", "content": "\n

\n \"DB-GPT\"\n
\n DB-GPT-Web\n

\n\n_

DB-GPT Chat UI, LLM to Vision.

_\n\n

\n \n \n \n \n \"Release\n \n \n \"Open\n \n \n \"Discord\"\n \n

\n\n---\n\n## 👋 Introduction\n\n***DB-GPT-Web*** is an **Open source chat UI** for [**DB-GPT**](https://github.com/eosphoros-ai/DB-GPT).\nAlso, it is a **LLM to Vision** solution. \n\n[DB-GPT-Web](https://dbgpt.site) is an Open source Tailwind and Next.js based chat UI for AI and GPT projects. It beautify a lot of markdown labels, such as `table`, `thead`, `th`, `td`, `code`, `h1`, `h2`, `ul`, `li`, `a`, `img`. Also it define some custom labels to adapted to AI-specific scenarios. Such as `plugin running`, `knowledge name`, `Chart view`, and so on.\n\n## 💪🏻 Getting Started\n\n### Prerequisites\n\n- [Node.js](https://nodejs.org/) >= 16\n- [npm](https://npmjs.com/) >= 8\n- Supported OSes: Linux, macOS and Windows\n\n### Installation\n\n```sh\n# Install dependencies\nnpm install\n```\n\n### Usage\n```sh\ncp .env.example .env\n```\nedit the `API_BASE_URL` to the real address\n\n```sh\n# development model\nnpm run dev\n```\n\n## 🚀 Use In DB-GPT\n\n```sh\nnpm run compile\n\n# copy compile file to DB-GPT static file dictory\ncp -rf out/* ../dbgpt/app/static \n\n```\n\n## 📚 Documentation\n\nFor full documentation, visit [document](https://docs.dbgpt.site/).\n\n\n## Usage\n [react-markdown](https://github.com/remarkjs/react-markdown#readme) for markdown support.\n [ant-design](https://github.com/ant-design/ant-design) for ui components.\n [next.js](https://github.com/vercel/next.js) for server side rendering.\n [@antv/g2](https://github.com/antvis/g2#readme) for charts.\n\n## License\n\nDB-GPT-Web is licensed under the [MIT License](LICENSE).\n\n---\n\nEnjoy using DB-GPT-Web to build stunning UIs for your AI and GPT projects.\n\n🌟 If you find it helpful, don't forget to give it a star on GitHub! Stars are like little virtual hugs that keep us going! We appreciate every single one we receive.\n\nFor any queries or issues, feel free to open an [issue](https://github.com/eosphoros-ai/DB-GPT-Web/issues) on the repository.\n\nHappy coding! 😊" }, { "path": "app/chat-context.tsx", "content": "import { createContext, useEffect, useMemo, useState } from 'react';\nimport { apiInterceptors, getDialogueList, getUsableModels } from '@/client/api';\nimport { useRequest } from 'ahooks';\nimport { ChatHistoryResponse, DialogueListResponse, IChatDialogueSchema } from '@/types/chat';\nimport { useSearchParams } from 'next/navigation';\nimport { STORAGE_THEME_KEY } from '@/utils';\n\ntype ThemeMode = 'dark' | 'light';\n\ninterface IChatContext {\n mode: ThemeMode;\n isContract?: boolean;\n isMenuExpand?: boolean;\n scene: IChatDialogueSchema['chat_mode'] | (string & {});\n chatId: string;\n model: string;\n dbParam?: string;\n modelList: Array;\n agent: string;\n dialogueList?: DialogueListResponse;\n setAgent?: (val: string) => void;\n setMode: (mode: ThemeMode) => void;\n setModel: (val: string) => void;\n setIsContract: (val: boolean) => void;\n setIsMenuExpand: (val: boolean) => void;\n setDbParam: (val: string) => void;\n queryDialogueList: () => void;\n refreshDialogList: () => void;\n currentDialogue?: DialogueListResponse[0];\n history: ChatHistoryResponse;\n setHistory: (val: ChatHistoryResponse) => void;\n docId?: number;\n setDocId: (docId: number) => void;\n}\n\nfunction getDefaultTheme(): ThemeMode {\n const theme = localStorage.getItem(STORAGE_THEME_KEY) as ThemeMode;\n if (theme) return theme;\n return window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light';\n}\n\nconst ChatContext = createContext({\n mode: 'light',\n scene: '',\n chatId: '',\n modelList: [],\n model: '',\n dbParam: undefined,\n dialogueList: [],\n agent: '',\n setAgent: () => {},\n setModel: () => {},\n setIsContract: () => {},\n setIsMenuExpand: () => {},\n setDbParam: () => void 0,\n queryDialogueList: () => {},\n refreshDialogList: () => {},\n setMode: () => void 0,\n history: [],\n setHistory: () => {},\n docId: undefined,\n setDocId: () => {},\n});\n\nconst ChatContextProvider = ({ children }: { children: React.ReactElement }) => {\n const searchParams = useSearchParams();\n const chatId = searchParams?.get('id') ?? '';\n const scene = searchParams?.get('scene') ?? '';\n const db_param = searchParams?.get('db_param') ?? '';\n\n const [isContract, setIsContract] = useState(false);\n const [model, setModel] = useState('');\n const [isMenuExpand, setIsMenuExpand] = useState(scene !== 'chat_dashboard');\n const [dbParam, setDbParam] = useState(db_param);\n const [agent, setAgent] = useState('');\n const [history, setHistory] = useState([]);\n const [docId, setDocId] = useState();\n const [mode, setMode] = useState('light');\n\n const {\n run: queryDialogueList,\n data: dialogueList = [],\n refresh: refreshDialogList,\n } = useRequest(\n async () => {\n const [, res] = await apiInterceptors(getDialogueList());\n return res ?? [];\n },\n {\n manual: true,\n },\n );\n\n useEffect(() => {\n if (dialogueList.length && scene === 'chat_agent') {\n const agent = dialogueList.find((item) => item.conv_uid === chatId)?.select_param;\n agent && setAgent(agent);\n }\n }, [dialogueList, scene, chatId]);\n\n const { data: modelList = [] } = useRequest(async () => {\n const [, res] = await apiInterceptors(getUsableModels());\n return res ?? [];\n });\n\n useEffect(() => {\n setMode(getDefaultTheme());\n }, []);\n\n useEffect(() => {\n setModel(modelList[0]);\n }, [modelList, modelList?.length]);\n\n const currentDialogue = useMemo(() => dialogueList.find((item: any) => item.conv_uid === chatId), [chatId, dialogueList]);\n const contextValue = {\n isContract,\n isMenuExpand,\n scene,\n chatId,\n modelList,\n model,\n dbParam: dbParam || db_param,\n dialogueList,\n agent,\n setAgent,\n mode,\n setMode,\n setModel,\n setIsContract,\n setIsMenuExpand,\n setDbParam,\n queryDialogueList,\n refreshDialogList,\n currentDialogue,\n history,\n setHistory,\n docId,\n setDocId,\n };\n return {children};\n};\n\nexport { ChatContext, ChatContextProvider };\n" }, { "path": "app/i18n.ts", "content": "import i18n from 'i18next';\nimport { initReactI18next } from 'react-i18next';\n\nconst en = {\n Knowledge_Space: 'Knowledge',\n space: 'space',\n Vector: 'Vector',\n Owner: 'Owner',\n Count: 'Count',\n File_type_Invalid: 'The file type is invalid',\n Knowledge_Space_Config: 'Space Config',\n Choose_a_Datasource_type: 'Datasource type',\n Segmentation: 'Segmentation',\n No_parameter: `No segementation parameter required.`,\n Knowledge_Space_Name: 'Knowledge Space Name',\n Please_input_the_name: 'Please input the name',\n Please_input_the_owner: 'Please input the owner',\n Please_select_file: 'Please select one file',\n Description: 'Description',\n Please_input_the_description: 'Please input the description',\n Next: 'Next',\n the_name_can_only_contain: 'the name can only contain numbers, letters, Chinese characters, \"-\" and \"_\"',\n Text: 'Text',\n 'Fill your raw text': 'Fill your raw text',\n URL: 'URL',\n Fetch_the_content_of_a_URL: 'Fetch the content of a URL',\n Document: 'Document',\n Upload_a_document: 'Upload a document, document type can be PDF, CSV, Text, PowerPoint, Word, Markdown',\n Name: 'Name',\n Text_Source: 'Text Source(Optional)',\n Please_input_the_text_source: 'Please input the text source',\n Sync: 'Sync',\n Back: 'Back',\n Finish: 'Finish',\n Web_Page_URL: 'Web Page URL',\n Please_input_the_Web_Page_URL: 'Please input the Web Page URL',\n Select_or_Drop_file: 'Select or Drop file',\n Documents: 'Documents',\n Chat: 'Chat',\n Add_Datasource: 'Add Datasource',\n Arguments: 'Arguments',\n Type: 'Type',\n Size: 'Size',\n Last_Sync: 'Last Sync',\n Status: 'Status',\n Result: 'Result',\n Details: 'Details',\n Delete: 'Delete',\n Operation: 'Operation',\n Submit: 'Submit',\n Chunks: 'Chunks',\n Content: 'Content',\n Meta_Data: 'Meta Data',\n Please_select_a_file: 'Please select a file',\n Please_input_the_text: 'Please input the text',\n Embedding: 'Embedding',\n topk: 'topk',\n the_top_k_vectors: 'the top k vectors based on similarity score',\n recall_score: 'recall_score',\n Set_a_threshold_score: 'Set a threshold score for the retrieval of similar vectors',\n recall_type: 'recall_type',\n model: 'model',\n A_model_used: 'A model used to create vector representations of text or other data',\n Automatic: 'Automatic',\n Process: 'Process',\n Automatic_desc: 'Automatically set segmentation and preprocessing rules.',\n chunk_size: 'chunk_size',\n The_size_of_the_data_chunks: 'The size of the data chunks used in processing',\n chunk_overlap: 'chunk_overlap',\n The_amount_of_overlap: 'The amount of overlap between adjacent data chunks',\n Prompt: 'Prompt',\n scene: 'scene',\n A_contextual_parameter: 'A contextual parameter used to define the setting or environment in which the prompt is being used',\n template: 'template',\n structure_or_format:\n 'A pre-defined structure or format for the prompt, which can help ensure that the AI system generates responses that are consistent with the desired style or tone.',\n max_token: 'max_token',\n max_iteration: 'max_iteration',\n concurrency_limit: 'concurrency_limit',\n The_maximum_number_of_tokens: 'The maximum number of tokens or words allowed in a prompt',\n Theme: 'Theme',\n Port: 'Port',\n Username: 'Username',\n Password: 'Password',\n Remark: 'Remark',\n Edit: 'Edit',\n Database: 'Database',\n Data_Source: 'Data Center',\n Close_Sidebar: 'Fold',\n Show_Sidebar: 'UnFold',\n language: 'Language',\n choose_model: 'Please choose a model',\n data_center_desc: 'DB-GPT also offers a user-friendly data center management interface for efficient data maintenance.',\n create_database: 'Create Database',\n create_knowledge: 'Create Knowledge',\n path: 'Path',\n model_manage: 'Models',\n stop_model_success: 'Stop model success',\n create_model: 'Create Model',\n model_select_tips: 'Please select a model',\n language_select_tips: 'Please select a language',\n submit: 'Submit',\n close: 'Close',\n start_model_success: 'Start model success',\n download_model_tip: 'Please download model first.',\n Plugins: 'Plugins',\n try_again: 'Try again',\n no_data: 'No data',\n Open_Sidebar: 'Unfold',\n cancel: 'Cancel',\n Edit_Success: 'Edit Success',\n Add: 'Add',\n Add_Success: 'Add Success',\n Error_Message: 'Something Error',\n Please_Input: 'Please Input',\n Prompt_Info_Scene: 'Scene',\n Prompt_Info_Sub_Scene: 'Sub Scene',\n Prompt_Info_Name: 'Name',\n Prompt_Info_Content: 'Content',\n Public: 'Public',\n Private: 'Private',\n Lowest: 'Lowest',\n Missed: 'Missed',\n Lost: 'Lost',\n Incorrect: 'Incorrect',\n Verbose: 'Verbose',\n Best: 'Best',\n Rating: 'Rating',\n Q_A_Category: 'Q&A Category',\n Q_A_Rating: 'Q&A Rating',\n feed_back_desc:\n '0: No results\\n' +\n '1: Results exist, but they are irrelevant, the question is not understood\\n' +\n '2: Results exist, the question is understood, but it indicates that the question cannot be answered\\n' +\n '3: Results exist, the question is understood, and an answer is given, but the answer is incorrect\\n' +\n '4: Results exist, the question is understood, the answer is correct, but it is verbose and lacks a summary\\n' +\n '5: Results exist, the question is understood, the answer is correct, the reasoning is correct, and a summary is provided, concise and to the point\\n',\n input_count: 'Total input',\n input_unit: 'characters',\n Copy: 'Copy',\n Copy_success: 'Content copied successfully',\n Copy_nothing: 'Content copied is empty',\n Copry_error: 'Copy failed',\n Click_Select: 'Click&Select',\n Quick_Start: 'Quick Start',\n Select_Plugins: 'Select Plugins',\n Search: 'Search',\n Update_From_Github: 'Upload From Github',\n Reset: 'Reset',\n Upload: 'Upload',\n Market_Plugins: 'Market Plugin',\n My_Plugins: 'My Plugins',\n Del_Knowledge_Tips: 'Do you want delete the Space',\n Del_Document_Tips: 'Do you want delete the Document',\n Tips: 'Tips',\n Limit_Upload_File_Count_Tips: 'Only one file can be uploaded at a time',\n To_Plugin_Market: 'Go to the Plugin Market',\n Summary: 'Summary',\n stacked_column_chart: 'Stacked Column',\n column_chart: 'Column',\n percent_stacked_column_chart: 'Percent Stacked Column',\n grouped_column_chart: 'Grouped Column',\n time_column: 'Time Column',\n pie_chart: 'Pie',\n line_chart: 'Line',\n area_chart: 'Area',\n stacked_area_chart: 'Stacked Area',\n scatter_plot: 'Scatter',\n bubble_chart: 'Bubble',\n stacked_bar_chart: 'Stacked Bar',\n bar_chart: 'Bar',\n percent_stacked_bar_chart: 'Percent Stacked Bar',\n grouped_bar_chart: 'Grouped Bar',\n water_fall_chart: 'Waterfall',\n table: 'Table',\n multi_line_chart: 'Multi Line',\n multi_measure_column_chart: 'Multi Measure Column',\n multi_measure_line_chart: 'Multi Measure Line',\n Advices: 'Advices',\n Retry: 'Retry',\n Load_more: 'load more',\n new_chat: 'New Chat',\n choice_agent_tip: 'Please choose an agent',\n no_context_tip: 'Please enter your question',\n Terminal: 'Terminal',\n awel_flow: 'AWEL Flow',\n save: 'Save',\n add_node: 'Add Node',\n no_node: 'No Node',\n connect_warning: 'Nodes cannot be connected',\n flow_modal_title: 'Save Flow',\n flow_name: 'Flow Name',\n flow_description: 'Flow Description',\n flow_name_required: 'Please enter the flow name',\n flow_description_required: 'Please enter the flow description',\n save_flow_success: 'Save flow success',\n delete_flow_confirm: 'Are you sure you want to delete this flow?',\n related_nodes: 'Related Nodes',\n add_resource: 'Add Resource',\n team_modal: 'Work Modal',\n App: 'App',\n resource_name: 'Resource Name',\n resource_type: 'Resource Type',\n resource_value: 'Value',\n resource_dynamic: 'Dynamic',\n Please_input_the_work_modal: 'Please select the work modal',\n available_resources: ' Available Resources',\n edit_new_applications: 'Edit new applications',\n collect: 'Collect',\n collected: 'Collected',\n create: 'Create',\n Agents: 'Agents',\n edit_application: 'edit application',\n add_application: 'add application',\n app_name: 'App Name',\n LLM_strategy: 'LLM Strategy',\n LLM_strategy_value: 'LLM Strategy Value',\n resource: 'Resource',\n operators: 'Operators',\n Chinese: 'Chinese',\n English: 'English',\n} as const;\n\nexport type I18nKeys = keyof typeof en;\n\nexport interface Resources {\n translation: Record;\n}\n\nconst zh: Resources['translation'] = {\n Knowledge_Space: '知识库',\n space: '知识库',\n Vector: '向量',\n Owner: '创建人',\n Count: '文档数',\n File_type_Invalid: '文件类型错误',\n Knowledge_Space_Config: '知识库配置',\n Choose_a_Datasource_type: '知识库类型',\n Segmentation: '分片',\n No_parameter: '不需要配置分片参数',\n Knowledge_Space_Name: '知识库名称',\n Please_input_the_name: '请输入名称',\n Please_input_the_owner: '请输入创建人',\n Please_select_file: '请至少选择一个文件',\n Description: '描述',\n Please_input_the_description: '请输入描述',\n Next: '下一步',\n the_name_can_only_contain: '名称只能包含数字、字母、中文字符、-或_',\n Text: '文本',\n 'Fill your raw text': '填写您的原始文本',\n URL: '网址',\n Fetch_the_content_of_a_URL: '获取 URL 的内容',\n Document: '文档',\n Upload_a_document: '上传文档，文档类型可以是PDF、CSV、Text、PowerPoint、Word、Markdown',\n Name: '名称',\n Text_Source: '文本来源（可选）',\n Please_input_the_text_source: '请输入文本来源',\n Sync: '同步',\n Back: '上一步',\n Finish: '完成',\n Web_Page_URL: '网页网址',\n Please_input_the_Web_Page_URL: '请输入网页网址',\n Select_or_Drop_file: '选择或拖拽文件',\n Documents: '文档',\n Chat: '对话',\n Add_Datasource: '添加数据源',\n Arguments: '参数',\n Type: '类型',\n Size: '切片',\n Last_Sync: '上次同步时间',\n Status: '状态',\n Result: '结果',\n Details: '明细',\n Delete: '删除',\n Operation: '操作',\n Submit: '提交',\n close: '关闭',\n Chunks: '切片',\n Content: '内容',\n Meta_Data: '元数据',\n Please_select_a_file: '请上传一个文件',\n Please_input_the_text: '请输入文本',\n Embedding: '嵌入',\n topk: 'TopK',\n the_top_k_vectors: '基于相似度得分的前 k 个向量',\n recall_score: '召回分数',\n Set_a_threshold_score: '设置相似向量检索的阈值分数',\n recall_type: '召回类型',\n model: '模型',\n A_model_used: '用于创建文本或其他数据的矢量表示的模型',\n Automatic: '自动切片',\n Process: '切片处理',\n Automatic_desc: '自动设置分割和预处理规则。',\n chunk_size: '块大小',\n The_size_of_the_data_chunks: '处理中使用的数据块的大小',\n chunk_overlap: '块重叠',\n The_amount_of_overlap: '相邻数据块之间的重叠量',\n scene: '场景',\n A_contextual_parameter: '用于定义使用提示的设置或环境的上下文参数',\n template: '模板',\n structure_or_format: '预定义的提示结构或格式，有助于确保人工智能系统生成与所需风格或语气一致的响应。',\n max_token: '最大令牌',\n max_iteration: '最大迭代',\n concurrency_limit: '并发限制',\n The_maximum_number_of_tokens: '提示中允许的最大标记或单词数',\n Theme: '主题',\n Port: '端口',\n Username: '用户名',\n Password: '密码',\n Remark: '备注',\n Edit: '编辑',\n Database: '数据库',\n Data_Source: '数据中心',\n Close_Sidebar: '收起',\n Show_Sidebar: '展开',\n language: '语言',\n choose_model: '请选择一个模型',\n data_center_desc: 'DB-GPT支持数据库交互和基于文档的对话，它还提供了一个用户友好的数据中心管理界面。',\n create_database: '创建数据库',\n create_knowledge: '创建知识库',\n path: '路径',\n model_manage: '模型管理',\n stop_model_success: '模型停止成功',\n create_model: '创建模型',\n model_select_tips: '请选择一个模型',\n submit: '提交',\n start_model_success: '启动模型成功',\n download_model_tip: '请先下载模型！',\n Plugins: '插件列表',\n try_again: '刷新重试',\n no_data: '暂无数据',\n Prompt: '提示语',\n Open_Sidebar: '展开',\n cancel: '取消',\n Edit_Success: '编辑成功',\n Add: '新增',\n Add_Success: '新增成功',\n Error_Message: '出错了',\n Please_Input: '请输入',\n Prompt_Info_Scene: '场景',\n Prompt_Info_Sub_Scene: '次级场景',\n Prompt_Info_Name: '名称',\n Prompt_Info_Content: '内容',\n Public: '公共',\n Private: '私有',\n Lowest: '渣渣',\n Missed: '没理解',\n Lost: '答不了',\n Incorrect: '答错了',\n Verbose: '较啰嗦',\n Best: '真棒',\n Rating: '评分',\n Q_A_Category: '问答类别',\n Q_A_Rating: '问答评分',\n feed_back_desc:\n '0: 无结果\\n' +\n '1: 有结果，但是在文不对题，没有理解问题\\n' +\n '2: 有结果，理解了问题，但是提示回答不了这个问题\\n' +\n '3: 有结果，理解了问题，并做出回答，但是回答的结果错误\\n' +\n '4: 有结果，理解了问题，回答结果正确，但是比较啰嗦，缺乏总结\\n' +\n '5: 有结果，理解了问题，回答结果正确，推理正确，并给出了总结，言简意赅\\n',\n input_count: '共计输入',\n input_unit: '字',\n Copy: '复制',\n Copy_success: '内容复制成功',\n Copy_nothing: '内容复制为空',\n Copry_error: '复制失败',\n Click_Select: '点击选择',\n Quick_Start: '快速开始',\n Select_Plugins: '选择插件',\n Search: '搜索',\n Reset: '重置',\n Update_From_Github: '更新Github插件',\n Upload: '上传',\n Market_Plugins: '插件市场',\n My_Plugins: '我的插件',\n Del_Knowledge_Tips: '你确定删除该知识库吗',\n Del_Document_Tips: '你确定删除该文档吗',\n Tips: '提示',\n Limit_Upload_File_Count_Tips: '一次只能上传一个文件',\n To_Plugin_Market: '前往插件市场',\n Summary: '总结',\n stacked_column_chart: '堆叠柱状图',\n column_chart: '柱状图',\n percent_stacked_column_chart: '百分比堆叠柱状图',\n grouped_column_chart: '簇形柱状图',\n time_column: '簇形柱状图',\n pie_chart: '饼图',\n line_chart: '折线图',\n area_chart: '面积图',\n stacked_area_chart: '堆叠面积图',\n scatter_plot: '散点图',\n bubble_chart: '气泡图',\n stacked_bar_chart: '堆叠条形图',\n bar_chart: '条形图',\n percent_stacked_bar_chart: '百分比堆叠条形图',\n grouped_bar_chart: '簇形条形图',\n water_fall_chart: '瀑布图',\n table: '表格',\n multi_line_chart: '多折线图',\n multi_measure_column_chart: '多指标柱形图',\n multi_measure_line_chart: '多指标折线图',\n Advices: '自动推荐',\n Retry: '重试',\n Load_more: '加载更多',\n new_chat: '创建会话',\n choice_agent_tip: '请选择代理',\n no_context_tip: '请输入你的问题',\n Terminal: '终端',\n awel_flow: 'AWEL 工作流',\n save: '保存',\n add_node: '添加节点',\n no_node: '没有可编排节点',\n connect_warning: '节点无法连接',\n flow_modal_title: '保存工作流',\n flow_name: '工作流名称',\n flow_description: '工作流描述',\n flow_name_required: '请输入工作流名称',\n flow_description_required: '请输入工作流描述',\n save_flow_success: '保存工作流成功',\n delete_flow_confirm: '确定删除该工作流吗？',\n related_nodes: '关联节点',\n language_select_tips: '请选择语言',\n add_resource: '添加资源',\n team_modal: '工作模式',\n App: '应用程序',\n resource: '资源',\n resource_name: '资源名',\n resource_type: '资源类型',\n resource_value: '参数',\n resource_dynamic: '动态',\n Please_input_the_work_modal: '请选择工作模式',\n available_resources: '可用资源',\n edit_new_applications: '编辑新的应用',\n collect: '收藏',\n collected: '已收藏',\n create: '创建',\n Agents: '智能体',\n edit_application: '编辑应用',\n add_application: '添加应用',\n app_name: '应用名称',\n LLM_strategy: '模型策略',\n LLM_strategy_value: '模型策略参数',\n operators: '算子',\n Chinese: '中文',\n English: '英文',\n} as const;\n\ni18n.use(initReactI18next).init({\n resources: {\n en: {\n translation: en,\n },\n zh: {\n translation: zh,\n },\n },\n lng: 'en',\n interpolation: {\n escapeValue: false,\n },\n});\n\nexport default i18n;\n\ndeclare module 'i18next' {\n interface CustomTypeOptions {\n resources: Resources;\n }\n}\n" }, { "path": "client/api/index.ts", "content": "import axios, { AxiosRequestConfig, AxiosError, AxiosResponse } from 'axios';\n\nexport type ResponseType = {\n data: T;\n err_code: string | null;\n err_msg: string | null;\n success: boolean;\n};\n\nexport type ApiResponse = AxiosResponse, D>;\n\nexport type SuccessTuple = [null, T, ResponseType, ApiResponse];\n\nexport type FailedTuple = [Error | AxiosError, null, null, null];\n\nconst ins = axios.create({\n baseURL: process.env.API_BASE_URL ?? '',\n});\n\nconst LONG_TIME_API: string[] = [\n '/db/add',\n '/db/test/connect',\n '/db/summary',\n '/params/file/load',\n '/chat/prepare',\n '/model/start',\n '/model/stop',\n '/editor/sql/run',\n '/sql/editor/submit',\n '/editor/chart/run',\n '/chart/editor/submit',\n '/document/upload',\n '/document/sync',\n '/agent/install',\n '/agent/uninstall',\n '/personal/agent/upload',\n];\n\nins.interceptors.request.use((request) => {\n const isLongTimeApi = LONG_TIME_API.some((item) => request.url && request.url.indexOf(item) >= 0);\n if (!request.timeout) {\n request.timeout = isLongTimeApi ? 60000 : 10000;\n }\n return request;\n});\n\nexport const GET = (url: string, params?: Params, config?: AxiosRequestConfig) => {\n return ins.get>(url, { params, ...config });\n};\n\nexport const POST = (url: string, data?: Data, config?: AxiosRequestConfig) => {\n return ins.post>(url, data, config);\n};\n\nexport const PATCH = (url: string, data?: Data, config?: AxiosRequestConfig) => {\n return ins.patch>(url, data, config);\n};\n\nexport const PUT = (url: string, data?: Data, config?: AxiosRequestConfig) => {\n return ins.put>(url, data, config);\n};\n\nexport const DELETE = (url: string, params?: Params, config?: AxiosRequestConfig) => {\n return ins.delete>(url, { params, ...config });\n};\n\nexport * from './tools';\nexport * from './request';\n" }, { "path": "client/api/request.ts", "content": "import { AxiosRequestConfig } from 'axios';\nimport { DELETE, GET, POST, PUT } from '.';\nimport { DbListResponse, DbSupportTypeResponse, PostDbParams, ChatFeedBackSchema } from '@/types/db';\nimport { DialogueListResponse, IChatDialogueSchema, NewDialogueParam, SceneResponse, ChatHistoryResponse, FeedBack, IDB } from '@/types/chat';\nimport { IModelData, StartModelParams, BaseModelParams, SupportModel } from '@/types/model';\nimport {\n GetEditorSQLRoundRequest,\n GetEditorySqlParams,\n PostEditorChartRunParams,\n PostEditorChartRunResponse,\n PostEditorSQLRunParams,\n PostSQLEditorSubmitParams,\n} from '@/types/editor';\nimport {\n PostAgentHubUpdateParams,\n PostAgentQueryParams,\n PostAgentPluginResponse,\n PostAgentMyPluginResponse,\n GetDBGPTsListResponse,\n} from '@/types/agent';\nimport {\n AddKnowledgeParams,\n ArgumentsParams,\n ChunkListParams,\n DocumentParams,\n IArguments,\n IChunkList,\n IChunkStrategyResponse,\n IDocumentResponse,\n ISpace,\n ISyncBatchParameter,\n ISyncBatchResponse,\n} from '@/types/knowledge';\nimport { UpdatePromptParams, IPrompt, PromptParams } from '@/types/prompt';\nimport { IFlow, IFlowNode, IFlowResponse, IFlowUpdateParam } from '@/types/flow';\nimport { IAgent, IApp, IAppData, ITeamModal } from '@/types/app';\n\n/** App */\nexport const postScenes = () => {\n return POST>('/api/v1/chat/dialogue/scenes');\n};\nexport const newDialogue = (data: NewDialogueParam) => {\n return POST('/api/v1/chat/dialogue/new', data);\n};\n\n/** Database Page */\nexport const getDbList = () => {\n return GET('/api/v1/chat/db/list');\n};\nexport const getDbSupportType = () => {\n return GET('/api/v1/chat/db/support/type');\n};\nexport const postDbDelete = (dbName: string) => {\n return POST(`/api/v1/chat/db/delete?db_name=${dbName}`);\n};\nexport const postDbEdit = (data: PostDbParams) => {\n return POST('/api/v1/chat/db/edit', data);\n};\nexport const postDbAdd = (data: PostDbParams) => {\n return POST('/api/v1/chat/db/add', data);\n};\nexport const postDbTestConnect = (data: PostDbParams) => {\n return POST('/api/v1/chat/db/test/connect', data);\n};\n\n/** Chat Page */\nexport const getDialogueList = () => {\n return GET('/api/v1/chat/dialogue/list');\n};\nexport const getUsableModels = () => {\n return GET>('/api/v1/model/types');\n};\nexport const postChatModeParamsList = (chatMode: string) => {\n return POST(`/api/v1/chat/mode/params/list?chat_mode=${chatMode}`);\n};\nexport const postChatModeParamsInfoList = (chatMode: string) => {\n return POST>(`/api/v1/chat/mode/params/info?chat_mode=${chatMode}`);\n};\nexport const getChatHistory = (convId: string) => {\n return GET(`/api/v1/chat/dialogue/messages/history?con_uid=${convId}`);\n};\nexport const postChatModeParamsFileLoad = ({\n convUid,\n chatMode,\n data,\n config,\n model,\n}: {\n convUid: string;\n chatMode: string;\n data: FormData;\n model: string;\n config?: Omit;\n}) => {\n return POST(\n `/api/v1/chat/mode/params/file/load?conv_uid=${convUid}&chat_mode=${chatMode}&model_name=${model}`,\n data,\n {\n headers: {\n 'Content-Type': 'multipart/form-data',\n },\n ...config,\n },\n );\n};\n\n/** Menu */\nexport const delDialogue = (conv_uid: string) => {\n return POST(`/api/v1/chat/dialogue/delete?con_uid=${conv_uid}`);\n};\n\n/** Editor */\nexport const getEditorSqlRounds = (id: string) => {\n return GET(`/api/v1/editor/sql/rounds?con_uid=${id}`);\n};\nexport const postEditorSqlRun = (data: PostEditorSQLRunParams) => {\n return POST(`/api/v1/editor/sql/run`, data);\n};\nexport const postEditorChartRun = (data: PostEditorChartRunParams) => {\n return POST(`/api/v1/editor/chart/run`, data);\n};\nexport const postSqlEditorSubmit = (data: PostSQLEditorSubmitParams) => {\n return POST(`/api/v1/sql/editor/submit`, data);\n};\nexport const getEditorSql = (id: string, round: string | number) => {\n return POST>('/api/v1/editor/sql', { con_uid: id, round });\n};\n\n/** knowledge */\nexport const getArguments = (knowledgeName: string) => {\n return POST(`/knowledge/${knowledgeName}/arguments`, {});\n};\nexport const saveArguments = (knowledgeName: string, data: ArgumentsParams) => {\n return POST(`/knowledge/${knowledgeName}/argument/save`, data);\n};\n\nexport const getSpaceList = () => {\n return POST>('/knowledge/space/list', {});\n};\nexport const getDocumentList = (spaceName: string, data: Record>) => {\n return POST>, IDocumentResponse>(`/knowledge/${spaceName}/document/list`, data);\n};\n\nexport const addDocument = (knowledgeName: string, data: DocumentParams) => {\n return POST(`/knowledge/${knowledgeName}/document/add`, data);\n};\n\nexport const addSpace = (data: AddKnowledgeParams) => {\n return POST>(`/knowledge/space/add`, data);\n};\n\nexport const getChunkStrategies = () => {\n return GET>('/knowledge/document/chunkstrategies');\n};\n\nexport const syncDocument = (spaceName: string, data: Record>) => {\n return POST>, string | null>(`/knowledge/${spaceName}/document/sync`, data);\n};\n\nexport const syncBatchDocument = (spaceName: string, data: Array) => {\n return POST, ISyncBatchResponse>(`/knowledge/${spaceName}/document/sync_batch`, data);\n};\n\nexport const uploadDocument = (knowLedgeName: string, data: FormData) => {\n return POST(`/knowledge/${knowLedgeName}/document/upload`, data);\n};\n\nexport const getChunkList = (spaceName: string, data: ChunkListParams) => {\n return POST(`/knowledge/${spaceName}/chunk/list`, data);\n};\n\nexport const delDocument = (spaceName: string, data: Record) => {\n return POST, null>(`/knowledge/${spaceName}/document/delete`, data);\n};\n\nexport const delSpace = (data: Record) => {\n return POST, null>(`/knowledge/space/delete`, data);\n};\n\n/** models */\nexport const getModelList = () => {\n return GET>('/api/v1/worker/model/list');\n};\n\nexport const stopModel = (data: BaseModelParams) => {\n return POST('/api/v1/worker/model/stop', data);\n};\n\nexport const startModel = (data: StartModelParams) => {\n return POST('/api/v1/worker/model/start', data);\n};\n\nexport const getSupportModels = () => {\n return GET>('/api/v1/worker/model/params');\n};\n\n/** Agent */\nexport const postAgentQuery = (data: PostAgentQueryParams) => {\n return POST('/api/v1/agent/query', data);\n};\nexport const postAgentHubUpdate = (data?: PostAgentHubUpdateParams) => {\n return POST('/api/v1/agent/hub/update', data ?? { channel: '', url: '', branch: '', authorization: '' });\n};\nexport const postAgentMy = (user?: string) => {\n return POST('/api/v1/agent/my', undefined, { params: { user } });\n};\nexport const postAgentInstall = (pluginName: string, user?: string) => {\n return POST('/api/v1/agent/install', undefined, { params: { plugin_name: pluginName, user }, timeout: 60000 });\n};\nexport const postAgentUninstall = (pluginName: string, user?: string) => {\n return POST('/api/v1/agent/uninstall', undefined, { params: { plugin_name: pluginName, user }, timeout: 60000 });\n};\nexport const postAgentUpload = (user = '', data: FormData, config?: Omit) => {\n return POST('/api/v1/personal/agent/upload', data, {\n params: { user },\n headers: {\n 'Content-Type': 'multipart/form-data',\n },\n ...config,\n });\n};\nexport const getDbgptsList = () => {\n return GET('/api/v1/dbgpts/list');\n};\n\n/** chat feedback **/\nexport const getChatFeedBackSelect = () => {\n return GET(`/api/v1/feedback/select`, undefined);\n};\nexport const getChatFeedBackItme = (conv_uid: string, conv_index: number) => {\n return GET>(`/api/v1/feedback/find?conv_uid=${conv_uid}&conv_index=${conv_index}`, undefined);\n};\nexport const postChatFeedBackForm = ({ data, config }: { data: ChatFeedBackSchema; config?: Omit }) => {\n return POST(`/api/v1/feedback/commit`, data, {\n headers: {\n 'Content-Type': 'application/json',\n },\n ...config,\n });\n};\n\n/** prompt */\nexport const getPromptList = (data: PromptParams) => {\n return POST>('/prompt/list', data);\n};\n\nexport const updatePrompt = (data: UpdatePromptParams) => {\n return POST('/prompt/update', data);\n};\n\nexport const addPrompt = (data: UpdatePromptParams) => {\n return POST('/prompt/add', data);\n};\n\n/** AWEL Flow */\nexport const addFlow = (data: IFlowUpdateParam) => {\n return POST('/api/v1/serve/awel/flows', data);\n};\n\nexport const getFlows = () => {\n return GET('/api/v1/serve/awel/flows');\n};\n\nexport const getFlowById = (id: string) => {\n return GET(`/api/v1/serve/awel/flows/${id}`);\n};\n\nexport const updateFlowById = (id: string, data: IFlowUpdateParam) => {\n return PUT(`/api/v1/serve/awel/flows/${id}`, data);\n};\n\nexport const deleteFlowById = (id: string) => {\n return DELETE(`/api/v1/serve/awel/flows/${id}`);\n};\n\nexport const getFlowNodes = () => {\n return GET>(`/api/v1/serve/awel/nodes`);\n};\n\n/** app */\nexport const addApp = (data: IApp) => {\n return POST('/api/v1/app/create', data);\n};\n\nexport const getAppList = (data: Record) => {\n return POST, IAppData>('/api/v1/app/list', data);\n};\n\nexport const collectApp = (data: Record) => {\n return POST, []>('/api/v1/app/collect', data);\n};\n\nexport const unCollectApp = (data: Record) => {\n return POST, []>('/api/v1/app/uncollect', data);\n};\n\nexport const delApp = (data: Record) => {\n return POST, []>('/api/v1/app/remove', data);\n};\n\nexport const getAgents = () => {\n return GET('/api/v1/agents/list', {});\n};\n\nexport const getTeamMode = () => {\n return GET('/api/v1/team-mode/list');\n};\n\nexport const getResourceType = () => {\n return GET('/api/v1/resource-type/list');\n};\n\nexport const getResource = (data: Record) => {\n return GET, []>(`/api/v1/app/resources/list?type=${data.type}`);\n};\n\nexport const updateApp = (data: IApp) => {\n return POST('/api/v1/app/edit', data);\n};\n\nexport const getAppStrategy = () => {\n return GET(`/api/v1/llm-strategy/list`);\n};\n\nexport const getAppStrategyValues = (type: string) => {\n return GET(`/api/v1/llm-strategy/value/list?type=${type}`);\n};\n" }, { "path": "client/api/tools/index.ts", "content": "export * from './interceptors';\n" }, { "path": "client/api/tools/interceptors.ts", "content": "import { AxiosError } from 'axios';\nimport { ApiResponse, FailedTuple, SuccessTuple, ResponseType } from '../';\nimport { notification } from 'antd';\n\n/**\n * Response processing\n *\n * @param promise request\n * @param ignoreCodes ignore error codes\n * @returns\n */\nexport const apiInterceptors = (promise: Promise>, ignoreCodes?: '*' | (number | string)[]) => {\n return promise\n .then>((response) => {\n const { data } = response;\n if (!data) {\n throw new Error('Network Error!');\n }\n if (!data.success) {\n if (ignoreCodes === '*' || (data.err_code && ignoreCodes && ignoreCodes.includes(data.err_code))) {\n return [null, data.data, data, response];\n } else {\n notification.error({\n message: `Request error`,\n description: data?.err_msg ?? 'The interface is abnormal. Please try again later',\n });\n }\n }\n return [null, data.data, data, response];\n })\n .catch>((err: Error | AxiosError) => {\n let errMessage = err.message;\n if (err instanceof AxiosError) {\n try {\n const { err_msg } = JSON.parse(err.request.response) as ResponseType;\n err_msg && (errMessage = err_msg);\n } catch (e) {}\n }\n notification.error({\n message: `Request error`,\n description: errMessage,\n });\n return [err, null, null, null];\n });\n};\n" }, { "path": "components/agent/market-plugins.tsx", "content": "import { apiInterceptors, postAgentHubUpdate, postAgentInstall, postAgentQuery, postAgentUninstall } from '@/client/api';\nimport { IAgentPlugin, PostAgentQueryParams } from '@/types/agent';\nimport { useRequest } from 'ahooks';\nimport { Button, Card, Form, Input, Spin, Tag, Tooltip, message } from 'antd';\nimport { useCallback, useMemo, useState } from 'react';\nimport MyEmpty from '../common/MyEmpty';\nimport { ClearOutlined, DownloadOutlined, GithubOutlined, LoadingOutlined, SearchOutlined, SyncOutlined } from '@ant-design/icons';\nimport { useTranslation } from 'react-i18next';\n\nfunction MarketPlugins() {\n const { t } = useTranslation();\n\n const [uploading, setUploading] = useState(false);\n const [isError, setIsError] = useState(false);\n const [actionIndex, setActionIndex] = useState();\n\n const [form] = Form.useForm();\n\n const pagination = useMemo<{ pageNo: number; pageSize: number }>(\n () => ({\n pageNo: 1,\n pageSize: 20,\n }),\n [],\n );\n\n const {\n data: agents = [],\n loading,\n refresh,\n } = useRequest(async () => {\n const queryParams: PostAgentQueryParams = {\n page_index: pagination.pageNo,\n page_size: pagination.pageSize,\n filter: form.getFieldsValue(),\n };\n const [err, res] = await apiInterceptors(postAgentQuery(queryParams));\n setIsError(!!err);\n return res?.datas ?? [];\n });\n\n const updateFromGithub = async () => {\n try {\n setUploading(true);\n const [err] = await apiInterceptors(postAgentHubUpdate());\n if (err) return;\n message.success('success');\n refresh();\n } finally {\n setUploading(false);\n }\n };\n\n const pluginAction = useCallback(\n async (name: string, index: number, isInstall: boolean) => {\n if (actionIndex) return;\n setActionIndex(index);\n const [err] = await apiInterceptors((isInstall ? postAgentInstall : postAgentUninstall)(name));\n if (!err) {\n message.success('success');\n refresh();\n }\n setActionIndex(undefined);\n },\n [actionIndex, refresh],\n );\n\n const renderAction = useCallback(\n (agent: IAgentPlugin, index: number) => {\n if (index === actionIndex) {\n return ;\n }\n return agent.installed ? (\n \n {\n pluginAction(agent.name, index, false);\n }}\n >\n \n \n \n ) : (\n \n {\n pluginAction(agent.name, index, true);\n }}\n >\n \n \n \n );\n },\n [actionIndex, pluginAction],\n );\n\n return (\n \n
\n \n \n \n \n \n \n \n
\n {!agents.length && !loading && }\n
\n {agents.map((agent, index) => (\n \n {\n window.open(agent.storage_url, '_blank');\n }}\n >\n \n
\n ,\n ]}\n >\n \n

{agent.name}

\n \n {agent.author && {agent.author}}\n {agent.version && v{agent.version}}\n {agent.type && Type {agent.type}}\n {agent.storage_channel && {agent.storage_channel}}\n \n

{agent.description}

\n \n \n ))}\n \n \n );\n}\n\nexport default MarketPlugins;\n" }, { "path": "components/agent/my-plugins.tsx", "content": "import { apiInterceptors, postAgentMy, postAgentUninstall, postAgentUpload } from '@/client/api';\nimport { IMyPlugin } from '@/types/agent';\nimport { useRequest } from 'ahooks';\nimport { Button, Card, Spin, Tag, Tooltip, Upload, UploadProps, message } from 'antd';\nimport { useCallback, useState } from 'react';\nimport MyEmpty from '../common/MyEmpty';\nimport { ClearOutlined, LoadingOutlined, UploadOutlined } from '@ant-design/icons';\nimport { useTranslation } from 'react-i18next';\n\nfunction MyPlugins() {\n const { t } = useTranslation();\n const [messageApi, contextHolder] = message.useMessage();\n\n const [uploading, setUploading] = useState(false);\n const [isError, setIsError] = useState(false);\n const [actionIndex, setActionIndex] = useState();\n\n const {\n data = [],\n loading,\n refresh,\n } = useRequest(async () => {\n const [err, res] = await apiInterceptors(postAgentMy());\n setIsError(!!err);\n return res ?? [];\n });\n\n const uninstall = async (name: string, index: number) => {\n if (actionIndex) return;\n setActionIndex(index);\n const [err] = await apiInterceptors(postAgentUninstall(name));\n message[err ? 'error' : 'success'](err ? 'failed' : 'success');\n !err && refresh();\n setActionIndex(undefined);\n };\n\n const renderAction = useCallback(\n (item: IMyPlugin, index: number) => {\n if (index === actionIndex) {\n return ;\n }\n return (\n \n {\n uninstall(item.name, index);\n }}\n >\n \n \n \n );\n },\n [actionIndex],\n );\n\n const onChange: UploadProps['onChange'] = async (info) => {\n if (!info) {\n message.error('Please select the *.zip,*.rar file');\n return;\n }\n try {\n const file = info.file;\n setUploading(true);\n const formData = new FormData();\n formData.append('doc_file', file as any);\n messageApi.open({ content: `Uploading ${file.name}`, type: 'loading', duration: 0 });\n const [err] = await apiInterceptors(postAgentUpload(undefined, formData, { timeout: 60000 }));\n if (err) return;\n message.success('success');\n refresh();\n } catch (e: any) {\n message.error(e?.message || 'Upload Error');\n } finally {\n setUploading(false);\n messageApi.destroy();\n }\n };\n\n return (\n \n {contextHolder}\n
\n false}\n name=\"file\"\n accept=\".zip,.rar\"\n multiple={false}\n onChange={onChange}\n showUploadList={{\n showDownloadIcon: false,\n showPreviewIcon: false,\n showRemoveIcon: false,\n }}\n itemRender={() => <>}\n >\n \n \n
\n {!data.length && !loading && }\n
\n {data.map((item, index) => (\n \n \n

{item.name}

\n \n {item.version && v{item.version}}\n {item.type && Type {item.type}}\n \n

{item.description}

\n \n \n ))}\n
\n \n );\n}\n\nexport default MyPlugins;\n" }, { "path": "components/app/agent-panel.tsx", "content": "import { apiInterceptors, getAppStrategy, getAppStrategyValues, getResource } from '@/client/api';\nimport { Button, Input, Select } from 'antd';\nimport React, { useEffect, useMemo, useState } from 'react';\nimport ResourceCard from './resource-card';\nimport { useTranslation } from 'react-i18next';\n\ninterface IProps {\n resourceTypes: any;\n updateDetailsByAgentKey: (key: string, data: any) => void;\n detail: any;\n editResources?: any;\n}\n\nexport default function AgentPanel(props: IProps) {\n const { resourceTypes, updateDetailsByAgentKey, detail, editResources } = props;\n const { t } = useTranslation();\n\n const [resources, setResources] = useState([...(editResources ?? [])]);\n const [agent, setAgent] = useState({ ...detail, resources: [] });\n const [strategyOptions, setStrategyOptions] = useState([]);\n const [strategyValueOptions, setStrategyValueOptions] = useState([]);\n\n const updateResourcesByIndex = (data: any, index: number) => {\n setResources((resources: any) => {\n const tempResources = [...resources];\n if (!data) {\n return tempResources.filter((_: any, indey) => index !== indey);\n }\n\n return tempResources.map((item: any, indey) => {\n if (index === indey) {\n return data;\n } else {\n return item;\n }\n });\n });\n };\n\n const getStrategy = async () => {\n const [_, data] = await apiInterceptors(getAppStrategy());\n if (data) {\n setStrategyOptions(data?.map((item) => ({ label: item, value: item })));\n }\n };\n\n const getStrategyValues = async (type: string) => {\n const [_, data] = await apiInterceptors(getAppStrategyValues(type));\n if (data) {\n setStrategyValueOptions(data.map((item) => ({ label: item, value: item })) ?? []);\n }\n };\n\n const formatStrategyValue = (value: string) => {\n return !value ? [] : value.split(',');\n };\n\n useEffect(() => {\n getStrategy();\n getStrategyValues(detail.llm_strategy);\n }, []);\n\n useEffect(() => {\n updateAgent(resources, 'resources');\n }, [resources]);\n\n const updateAgent = (data: any, type: string) => {\n const tempAgent = { ...agent };\n tempAgent[type] = data;\n\n setAgent(tempAgent);\n\n updateDetailsByAgentKey(detail.key, tempAgent);\n };\n\n const handelAdd = () => {\n setResources([...resources, { name: '', type: '', introduce: '', value: '', is_dynamic: '' }]);\n };\n\n const resourceTypeOptions = useMemo(() => {\n return resourceTypes?.map((item: string) => {\n return {\n label: item,\n value: item,\n };\n });\n }, [resourceTypes]);\n\n return (\n
\n
\n
{t('Prompt')}:
\n {\n updateAgent(e.target.value, 'prompt_template');\n }}\n />\n
{t('LLM_strategy')}:
\n {\n updateAgent(value, 'llm_strategy');\n getStrategyValues(value);\n }}\n />\n {strategyValueOptions && strategyValueOptions.length > 0 && (\n <>\n
{t('LLM_strategy_value')}:
\n {\n if (!value || value?.length === 0) {\n updateAgent(null, 'llm_strategy_value');\n return null;\n }\n\n const curValue = value.reduce((pre: string, cur: string, index: number) => {\n if (index === 0) {\n return cur;\n } else {\n return `${pre},${cur}`;\n }\n }, '');\n\n updateAgent(curValue, 'llm_strategy_value');\n }}\n />\n \n )}\n
\n
{t('available_resources')}
\n {resources.map((resource: any, index: number) => {\n return (\n \n );\n })}\n \n
\n );\n}\n" }, { "path": "components/app/app-card.tsx", "content": "import React, { useContext, useEffect, useState } from 'react';\nimport { Modal } from 'antd';\nimport { apiInterceptors, collectApp, delApp, newDialogue, unCollectApp } from '@/client/api';\nimport { IApp } from '@/types/app';\nimport { DeleteFilled, MessageFilled, StarFilled, WarningOutlined } from '@ant-design/icons';\nimport { useTranslation } from 'react-i18next';\nimport { useRouter } from 'next/router';\nimport { ChatContext } from '@/app/chat-context';\nimport GPTCard from '../common/gpt-card';\n\ninterface IProps {\n updateApps: (data?: { is_collected: boolean }) => void;\n app: IApp;\n handleEdit: (app: any) => void;\n isCollected: boolean;\n}\n\nconst { confirm } = Modal;\n\nexport default function AppCard(props: IProps) {\n const { updateApps, app, handleEdit, isCollected } = props;\n const { model } = useContext(ChatContext);\n const router = useRouter();\n\n const [isCollect, setIsCollect] = useState(app.is_collected);\n const { setAgent: setAgentToChat } = useContext(ChatContext);\n\n const { t } = useTranslation();\n\n const languageMap = {\n en: t('English'),\n zh: t('Chinese'),\n };\n\n const showDeleteConfirm = () => {\n confirm({\n title: t('Tips'),\n icon: ,\n content: `do you want delete the application?`,\n okText: 'Yes',\n okType: 'danger',\n cancelText: 'No',\n async onOk() {\n await apiInterceptors(delApp({ app_code: app.app_code }));\n updateApps(isCollected ? { is_collected: isCollected } : undefined);\n },\n });\n };\n\n useEffect(() => {\n setIsCollect(app.is_collected);\n }, [app]);\n\n const collect = async () => {\n const [error] = await apiInterceptors(isCollect === 'true' ? unCollectApp({ app_code: app.app_code }) : collectApp({ app_code: app.app_code }));\n if (error) return;\n updateApps(isCollected ? { is_collected: isCollected } : undefined);\n setIsCollect(isCollect === 'true' ? 'false' : 'true');\n };\n\n const handleChat = async () => {\n setAgentToChat?.(app.app_code);\n const [, res] = await apiInterceptors(newDialogue({ chat_mode: 'chat_agent' }));\n if (res) {\n router.push(`/chat/?scene=chat_agent&id=${res.conv_uid}${model ? `&model=${model}` : ''}`);\n }\n };\n\n return (\n {\n handleEdit(app);\n }}\n operations={[\n {\n label: t('Chat'),\n children: ,\n onClick: handleChat,\n },\n {\n label: t('collect'),\n children: ,\n onClick: collect,\n },\n {\n label: t('Delete'),\n children: ,\n onClick: () => {\n showDeleteConfirm();\n },\n },\n ]}\n />\n );\n}\n" }, { "path": "components/app/app-modal.tsx", "content": "import { AgentParams, IAgent as IAgentParams, IApp, IDetail } from '@/types/app';\nimport { Dropdown, Form, Input, Modal, Select, Space, Spin, Tabs } from 'antd';\nimport React, { useEffect, useRef, useState } from 'react';\nimport { useTranslation } from 'react-i18next';\nimport AddIcon from '../icons/add-icon';\nimport AgentPanel from './agent-panel';\nimport { addApp, apiInterceptors, getAgents, getResourceType, getTeamMode, updateApp } from '@/client/api';\nimport type { TabsProps } from 'antd';\nimport DagLayout from './dag-layout';\nimport { IFlow } from '@/types/flow';\n\ntype TargetKey = string;\n\ntype FieldType = {\n app_name: string;\n app_describe: string;\n language: string;\n team_mode: string;\n};\n\ntype IAgent = {\n label: string;\n children?: React.ReactNode;\n onClick?: () => void;\n key: number | string;\n};\n\ninterface IProps {\n handleCancel: () => void;\n open: boolean;\n updateApps: () => void;\n type: string;\n app?: any;\n}\n\ntype TeamModals = 'awel_layout' | 'singe_agent' | 'auto_plan';\n\nexport default function AppModal(props: IProps) {\n const { handleCancel, open, updateApps, type, app } = props;\n\n const { t } = useTranslation();\n const [spinning, setSpinning] = useState(false);\n const [activeKey, setActiveKey] = useState();\n const [teamModal, setTeamModal] = useState<{ label: string; value: string }[]>();\n const [agents, setAgents] = useState([]);\n const [dropItems, setDropItems] = useState([]);\n const [details, setDetails] = useState([...(app?.details || [])]);\n const [flow, setFlow] = useState();\n const [resourceTypes, setResourceTypes] = useState();\n const [curTeamModal, setCurTeamModal] = useState(app.team_modal || 'auto_plan');\n\n const [form] = Form.useForm();\n\n const languageOptions = [\n { value: 'zh', label: t('Chinese') },\n { value: 'en', label: t('English') },\n ];\n\n const onChange = (newActiveKey: string) => {\n setActiveKey(newActiveKey);\n };\n\n const createApp = async (app: IApp) => {\n await apiInterceptors(type === 'add' ? addApp(app) : updateApp(app));\n await updateApps();\n };\n\n const initApp = async () => {\n const appDetails = app.details;\n const [_, resourceType] = await apiInterceptors(getResourceType());\n\n if (appDetails?.length > 0) {\n setAgents(\n appDetails?.map((item: AgentParams) => {\n return {\n label: item?.agent_name,\n children: (\n \n ),\n key: item?.agent_name,\n };\n }),\n );\n }\n };\n\n const fetchTeamModal = async () => {\n const [_, data] = await apiInterceptors(getTeamMode());\n if (!data) return null;\n\n const teamModalOptions = data.map((item) => {\n return { value: item, label: item };\n });\n setTeamModal(teamModalOptions);\n };\n\n const fetchAgent = async () => {\n const [_, data] = await apiInterceptors(getAgents());\n if (!data) {\n return null;\n }\n\n setDropItems(\n data\n .map((agent) => {\n return {\n label: agent.name,\n key: agent.name,\n onClick: () => {\n add(agent);\n },\n agent,\n };\n })\n .filter((item) => {\n if (!app.details || app.details?.length === 0) {\n return item;\n }\n return app?.details?.every((detail: AgentParams) => detail.agent_name !== item.label);\n }),\n );\n };\n\n const handleFlowsChange = (data: IFlow) => {\n setFlow(data);\n };\n\n const fetchResourceType = async () => {\n const [_, data] = await apiInterceptors(getResourceType());\n if (data) {\n setResourceTypes(data);\n }\n };\n\n useEffect(() => {\n fetchTeamModal();\n fetchAgent();\n fetchResourceType();\n }, []);\n\n useEffect(() => {\n type === 'edit' && initApp();\n }, [resourceTypes]);\n\n useEffect(() => {\n setCurTeamModal(app.team_mode || 'auto_plan');\n }, [app]);\n\n const updateDetailsByAgentKey = (key: string, data: IDetail) => {\n setDetails((details: IDetail[]) => {\n return details.map((detail: IDetail) => {\n return key === (detail.agent_name || detail.key) ? data : detail;\n });\n });\n };\n\n const add = async (tabBar: IAgentParams) => {\n const newActiveKey = tabBar.name;\n const [_, data] = await apiInterceptors(getResourceType());\n\n setActiveKey(newActiveKey);\n\n setDetails((details: IDetail[]) => {\n return [...details, { key: newActiveKey, name: '', llm_strategy: 'priority' }];\n });\n\n setAgents((items: any) => {\n return [\n ...items,\n {\n label: newActiveKey,\n children: (\n \n ),\n key: newActiveKey,\n },\n ];\n });\n\n setDropItems((items) => {\n return items.filter((item) => item.key !== tabBar.name);\n });\n };\n\n const remove = (targetKey: TargetKey) => {\n let newActiveKey = activeKey;\n let lastIndex = -1;\n\n if (!agents) {\n return null;\n }\n\n agents.forEach((item, i) => {\n if (item.key === targetKey) {\n lastIndex = i - 1;\n }\n });\n\n const newPanes = agents.filter((item) => item.key !== targetKey);\n if (newPanes.length && newActiveKey === targetKey) {\n if (lastIndex >= 0) {\n newActiveKey = newPanes[lastIndex].key;\n } else {\n newActiveKey = newPanes[0].key;\n }\n }\n setDetails((details: IDetail[]) => {\n return details?.filter((detail: any) => {\n return (detail.agent_name || detail.key) !== targetKey;\n });\n });\n\n setAgents(newPanes);\n setActiveKey(newActiveKey);\n setDropItems((items: any) => {\n return [\n ...items,\n {\n label: targetKey,\n key: targetKey,\n onClick: () => {\n add({ name: targetKey, describe: '', system_message: '' });\n },\n },\n ];\n });\n };\n\n const onEdit = (targetKey: any, action: 'add' | 'remove') => {\n if (action === 'add') {\n // add();\n } else {\n remove(targetKey);\n }\n };\n\n const handleSubmit = async () => {\n const isValidate = await form.validateFields();\n\n if (!isValidate) {\n return;\n }\n setSpinning(true);\n\n const data = {\n ...form.getFieldsValue(),\n };\n if (type === 'edit') {\n data.app_code = app.app_code;\n }\n\n if (data.team_mode !== 'awel_layout') {\n data.details = details;\n } else {\n const tempFlow = { ...flow };\n delete tempFlow.flow_data;\n data.team_context = tempFlow;\n }\n\n try {\n await createApp(data);\n } catch (error) {\n return;\n }\n\n setSpinning(false);\n handleCancel();\n };\n\n const handleTeamModalChange = (value: TeamModals) => {\n setCurTeamModal(value);\n };\n\n const renderAddIcon = () => {\n return (\n \n e.preventDefault()}>\n \n \n \n \n \n );\n };\n\n return (\n
\n \n \n \n label={t('app_name')} name=\"app_name\" rules={[{ required: true, message: t('Please_input_the_name') }]}>\n \n \n \n label={t('Description')}\n name=\"app_describe\"\n rules={[{ required: true, message: t('Please_input_the_description') }]}\n >\n \n \n
\n labelCol={{ span: 7 }} label={t('language')} name=\"language\" className=\"w-1/2\" rules={[{ required: true }]}>\n \n \n {t('edit_new_applications')}\n \n
{curFlow?.description}
\n
\n {curFlow && (\n
\n \n
\n )}\n
\n );\n}\n" }, { "path": "components/app/resource-card.tsx", "content": "import { apiInterceptors, getResource } from '@/client/api';\nimport { DeleteFilled } from '@ant-design/icons';\nimport { Button, Card, ConfigProvider, Input, Select, Switch } from 'antd';\nimport React, { useEffect, useState } from 'react';\nimport { useTranslation } from 'react-i18next';\n\ninterface IProps {\n resourceTypeOptions: any[];\n updateResourcesByIndex: (data: any, index: number) => void;\n index: number;\n resource: any;\n}\n\nexport default function ResourceCard(props: IProps) {\n const { resourceTypeOptions, updateResourcesByIndex, index, resource: editResource } = props;\n\n const { t } = useTranslation();\n\n const [resourceType, setResourceType] = useState(editResource.type || resourceTypeOptions?.[0].label);\n const [resourceValueOptions, setResourceValueOptions] = useState([]);\n const [resource, setResource] = useState({\n name: editResource.name,\n type: editResource.type,\n value: editResource.value,\n is_dynamic: editResource.is_dynamic || false,\n });\n\n const fetchResource = async () => {\n const [_, data] = await apiInterceptors(getResource({ type: resourceType }));\n\n if (data) {\n setResourceValueOptions(\n data?.map((item) => {\n return { label: item, value: item };\n }),\n );\n } else {\n setResourceValueOptions([]);\n }\n };\n\n const handleChange = (value: string) => {\n setResourceType(value);\n };\n\n const updateResource = (value: any, type: string) => {\n const tempResource = resource;\n\n tempResource[type] = value;\n setResource(tempResource);\n updateResourcesByIndex(tempResource, index);\n };\n\n const handleDeleteResource = () => {\n updateResourcesByIndex(null, index);\n };\n\n useEffect(() => {\n fetchResource();\n updateResource(resource.type || resourceType, 'type');\n }, [resourceType]);\n\n useEffect(() => {\n updateResource(resourceValueOptions[0]?.label || editResource.value, 'value');\n setResource({ ...resource, value: resourceValueOptions[0]?.label || editResource.value });\n }, [resourceValueOptions]);\n\n return (\n {\n handleDeleteResource();\n }}\n />\n }\n >\n
\n
\n
\n * {t('resource_name')}:\n
\n ) => {\n updateResource(e.target.value, 'name');\n }}\n />\n
\n
{t('resource_dynamic')}
\n\n {\n updateResource(value, 'is_dynamic');\n }}\n />\n
\n
\n
\n
{t('resource_type')}:
\n {\n updateResource(value, 'type');\n handleChange(value);\n }}\n />\n
{t('resource_value')}:
\n {resourceValueOptions?.length > 0 ? (\n {\n updateResource(value, 'value');\n }}\n />\n ) : (\n ) => {\n updateResource(e.target.value, 'value');\n }}\n />\n )}\n
\n
\n \n );\n}\n" }, { "path": "components/chart/autoChart/advisor/pipeline.ts", "content": "import { Advisor, CkbConfig } from '@antv/ava';\nimport type { Advice, AdviseParams, AdvisorConfig, ChartKnowledgeBase } from '@antv/ava';\nimport type { CustomAdvisorConfig, RuleConfig, Specification } from '../types';\n\nexport type CustomRecommendConfig = {\n customCKB?: Partial;\n customRule?: Partial;\n};\n\nexport const customizeAdvisor = (props: CustomAdvisorConfig): Advisor => {\n const { charts, scopeOfCharts: CKBCfg, ruleConfig: ruleCfg } = props;\n\n const customCKB: ChartKnowledgeBase = {};\n charts?.forEach((chart) => {\n /** 若用户自定义的图表 id 与内置图表 id 相同，内置图表将被覆盖 */\n if (!chart.chartKnowledge.toSpec) {\n chart.chartKnowledge.toSpec = (data: any, dataProps: any) => {\n return { dataProps } as Specification;\n };\n } else {\n const oriFunc = chart.chartKnowledge.toSpec;\n chart.chartKnowledge.toSpec = (data: any, dataProps: any) => {\n return {\n ...oriFunc(data, dataProps),\n dataProps: dataProps,\n } as Specification;\n };\n }\n customCKB[chart.chartType] = chart.chartKnowledge;\n });\n\n // 步骤一：如果有 exclude 项，先从给到的 CKB 中剔除部分选定的图表类型\n if (CKBCfg?.exclude) {\n CKBCfg.exclude.forEach((chartType: string) => {\n if (Object.keys(customCKB).includes(chartType)) {\n delete customCKB[chartType];\n }\n });\n }\n // 步骤二：如果有 include 项，则从当前（剔除后的）CKB中，只保留 include 中的图表类型。\n if (CKBCfg?.include) {\n const include = CKBCfg.include;\n Object.keys(customCKB).forEach((chartType: string) => {\n if (!include.includes(chartType)) {\n delete customCKB[chartType];\n }\n });\n }\n\n const CKBConfig: CkbConfig = {\n ...CKBCfg,\n custom: customCKB,\n };\n const ruleConfig: RuleConfig = {\n ...ruleCfg,\n };\n\n const myAdvisor = new Advisor({\n ckbCfg: CKBConfig,\n ruleCfg: ruleConfig,\n });\n\n return myAdvisor;\n};\n\n/** 主推荐流程 */\nexport const getVisAdvices = (props: any): Advice[] => {\n const { data, dataMetaMap, myChartAdvisor } = props;\n /**\n * 若输入中有信息能够获取列的类型（ Interval, Nominal, Time ）,则将这个 信息传给 Advisor\n * 主要是读取 levelOfMeasureMents 这个字段，即 dataMetaMap[item].levelOfMeasurements\n */\n const customDataProps = dataMetaMap\n ? Object.keys(dataMetaMap).map((item) => {\n return { name: item, ...dataMetaMap[item] };\n })\n : null;\n const allAdvices = myChartAdvisor?.adviseWithLog({\n data,\n dataProps: customDataProps as AdviseParams['dataProps'],\n });\n return allAdvices?.advices ?? [];\n};\n" }, { "path": "components/chart/autoChart/advisor/rule.ts", "content": "export const customRuleCfg = {};\n" }, { "path": "components/chart/autoChart/advisor/utils.ts", "content": "import { isNull } from 'lodash';\nimport type { Advice } from '@antv/ava';\n\nexport function defaultAdvicesFilter(props: { advices: Advice[] }) {\n const { advices } = props;\n return advices;\n}\nexport const compare = (f1: any, f2: any) => {\n if (isNull(f1.distinct) || isNull(f2.distinct)) {\n if (f1.distinct! < f2!.distinct!) {\n return 1;\n }\n if (f1.distinct! > f2.distinct!) {\n return -1;\n }\n return 0;\n }\n return 0;\n};\n\nexport function hasSubset(array1: any[], array2: any[]): boolean {\n return array2.every((e) => array1.includes(e));\n}\n\nexport function intersects(array1: any[], array2: any[]): boolean {\n return array2.some((e) => array1.includes(e));\n}\n\nexport function LOM2EncodingType(lom: string) {\n switch (lom) {\n case 'Nominal':\n return 'nominal';\n case 'Ordinal':\n return 'ordinal';\n case 'Interval':\n return 'quantitative';\n case 'Time':\n return 'temporal';\n case 'Continuous':\n return 'quantitative';\n case 'Discrete':\n return 'nominal';\n default:\n return 'nominal';\n }\n}\n" }, { "path": "components/chart/autoChart/charts/index.ts", "content": "import multi_line_chart from './multi-line-chart';\nimport multi_measure_column_chart from './multi-measure-column-chart';\nimport multi_measure_line_chart from './multi-measure-line-chart';\nimport type { CustomChart } from '../types';\n\nexport const customCharts: CustomChart[] = [multi_line_chart, multi_measure_column_chart, multi_measure_line_chart];\n\nexport type CustomChartsType = 'multi_line_chart' | 'multi_measure_column_chart' | 'multi_measure_line_chart';\n" }, { "path": "components/chart/autoChart/charts/multi-line-chart.ts", "content": "import { hasSubset, intersects } from '../advisor/utils';\nimport { processDateEncode } from './util';\nimport type { ChartKnowledge, CustomChart, GetChartConfigProps, Specification } from '../types';\n\nconst getChartSpec = (data: GetChartConfigProps['data'], dataProps: GetChartConfigProps['dataProps']) => {\n const field4X = dataProps.find((field) =>\n // @ts-ignore\n intersects(field.levelOfMeasurements, ['Time', 'Ordinal']),\n );\n // @ts-ignore\n const field4Y = dataProps.filter((field) => hasSubset(field.levelOfMeasurements, ['Interval']));\n const field4Nominal = dataProps.find((field) =>\n // @ts-ignore\n hasSubset(field.levelOfMeasurements, ['Nominal']),\n );\n if (!field4X || !field4Y) return null;\n\n const spec: Specification = {\n type: 'view',\n autoFit: true,\n data,\n children: [],\n };\n\n field4Y.forEach((field) => {\n const singleLine: Specification = {\n type: 'line',\n encode: {\n x: processDateEncode(field4X.name as string, dataProps),\n y: field.name,\n },\n };\n if (field4Nominal) {\n singleLine.encode.color = field4Nominal.name;\n }\n spec.children.push(singleLine);\n });\n return spec;\n};\n\nconst ckb: ChartKnowledge = {\n id: 'multi_line_chart',\n name: 'multi_line_chart',\n alias: ['multi_line_chart'],\n family: ['LineCharts'],\n def: 'multi_line_chart uses lines with segments to show changes in data in a ordinal dimension',\n purpose: ['Comparison', 'Trend'],\n coord: ['Cartesian2D'],\n category: ['Statistic'],\n shape: ['Lines'],\n dataPres: [\n { minQty: 1, maxQty: 1, fieldConditions: ['Time', 'Ordinal'] },\n { minQty: 1, maxQty: '*', fieldConditions: ['Interval'] },\n { minQty: 0, maxQty: 1, fieldConditions: ['Nominal'] },\n ],\n channel: ['Color', 'Direction', 'Position'],\n recRate: 'Recommended',\n toSpec: getChartSpec,\n};\n\n/* 订制一个图表需要的所有参数 */\nexport const multi_line_chart: CustomChart = {\n /* 图表唯一 Id */\n chartType: 'multi_line_chart',\n /* 图表知识 */\n chartKnowledge: ckb as ChartKnowledge,\n /** 图表中文名 */\n chineseName: '折线图',\n};\n\nexport default multi_line_chart;\n" }, { "path": "components/chart/autoChart/charts/multi-measure-column-chart.ts", "content": "import { hasSubset } from '../advisor/utils';\n\nimport type { ChartKnowledge, CustomChart, GetChartConfigProps, Specification } from '../types';\n\nconst getChartSpec = (data: GetChartConfigProps['data'], dataProps: GetChartConfigProps['dataProps']) => {\n try {\n // @ts-ignore\n const field4Y = dataProps?.filter((field) => hasSubset(field.levelOfMeasurements, ['Interval']));\n const field4Nominal = dataProps?.find((field) =>\n // @ts-ignore\n hasSubset(field.levelOfMeasurements, ['Nominal']),\n );\n if (!field4Nominal || !field4Y) return null;\n\n const spec: Specification = {\n type: 'view',\n data,\n children: [],\n };\n\n field4Y?.forEach((field) => {\n const singleLine: Specification = {\n type: 'interval',\n encode: {\n x: field4Nominal.name,\n y: field.name,\n color: () => field.name,\n series: () => field.name,\n },\n };\n spec.children.push(singleLine);\n });\n return spec;\n } catch (err) {\n console.log(err);\n return null;\n }\n};\n\nconst ckb: ChartKnowledge = {\n id: 'multi_measure_column_chart',\n name: 'multi_measure_column_chart',\n alias: ['multi_measure_column_chart'],\n family: ['ColumnCharts'],\n def: 'multi_measure_column_chart uses lines with segments to show changes in data in a ordinal dimension',\n purpose: ['Comparison', 'Distribution'],\n coord: ['Cartesian2D'],\n category: ['Statistic'],\n shape: ['Lines'],\n dataPres: [\n { minQty: 1, maxQty: '*', fieldConditions: ['Interval'] },\n { minQty: 1, maxQty: 1, fieldConditions: ['Nominal'] },\n ],\n channel: ['Color', 'Direction', 'Position'],\n recRate: 'Recommended',\n toSpec: getChartSpec,\n};\n\n/* 订制一个图表需要的所有参数 */\nexport const multi_measure_column_chart: CustomChart = {\n /* 图表唯一 Id */\n chartType: 'multi_measure_column_chart',\n /* 图表知识 */\n chartKnowledge: ckb as ChartKnowledge,\n /** 图表中文名 */\n chineseName: '折线图',\n};\n\nexport default multi_measure_column_chart;\n" }, { "path": "components/chart/autoChart/charts/multi-measure-line-chart.ts", "content": "import { hasSubset, intersects } from '../advisor/utils';\nimport { processDateEncode } from './util';\nimport type { ChartKnowledge, CustomChart, GetChartConfigProps, Specification } from '../types';\n\nconst getChartSpec = (data: GetChartConfigProps['data'], dataProps: GetChartConfigProps['dataProps']) => {\n try {\n // @ts-ignore\n const field4Y = dataProps?.filter((field) => hasSubset(field.levelOfMeasurements, ['Interval']));\n const field4Nominal = dataProps?.find((field) =>\n // @ts-ignore\n hasSubset(field.levelOfMeasurements, ['Nominal']),\n );\n if (!field4Nominal || !field4Y) return null;\n\n const spec: Specification = {\n type: 'view',\n data,\n children: [],\n };\n\n field4Y?.forEach((field) => {\n const singleLine: Specification = {\n type: 'line',\n encode: {\n x: processDateEncode(field4Nominal.name as string, dataProps),\n y: field.name,\n color: () => field.name,\n series: () => field.name,\n },\n };\n spec.children.push(singleLine);\n });\n return spec;\n } catch (err) {\n console.log(err);\n return null;\n }\n};\n\nconst ckb: ChartKnowledge = {\n id: 'multi_measure_line_chart',\n name: 'multi_measure_line_chart',\n alias: ['multi_measure_line_chart'],\n family: ['LineCharts'],\n def: 'multi_measure_line_chart uses lines with segments to show changes in data in a ordinal dimension',\n purpose: ['Comparison', 'Distribution'],\n coord: ['Cartesian2D'],\n category: ['Statistic'],\n shape: ['Lines'],\n dataPres: [\n { minQty: 1, maxQty: '*', fieldConditions: ['Interval'] },\n { minQty: 1, maxQty: 1, fieldConditions: ['Nominal'] },\n ],\n channel: ['Color', 'Direction', 'Position'],\n recRate: 'Recommended',\n toSpec: getChartSpec,\n};\n\n/* 订制一个图表需要的所有参数 */\nexport const multi_measure_line_chart: CustomChart = {\n /* 图表唯一 Id */\n chartType: 'multi_measure_line_chart',\n /* 图表知识 */\n chartKnowledge: ckb as ChartKnowledge,\n /** 图表中文名 */\n chineseName: '折线图',\n};\n\nexport default multi_measure_line_chart;\n" }, { "path": "components/chart/autoChart/charts/util.ts", "content": "type BasicDataPropertyForAdvice = any;\n\n/**\n * Process date column to new Date().\n * @param field\n * @param dataProps\n * @returns\n */\nexport function processDateEncode(field: string, dataProps: BasicDataPropertyForAdvice[]) {\n const dp = dataProps.find((dataProp) => dataProp.name === field);\n\n if (dp?.recommendation === 'date') {\n return (d: any) => new Date(d[field]);\n }\n return field;\n}\n" }, { "path": "components/chart/autoChart/helpers/index.ts", "content": "import { ChartId } from '@antv/ava';\nimport { CustomChartsType } from '../charts';\n\nexport type BackEndChartType =\n | 'response_line_chart'\n | 'response_bar_chart'\n | 'response_pie_chart'\n | 'response_scatter_chart'\n | 'response_area_chart'\n | 'response_heatmap_chart'\n | 'response_table';\n\ntype ChartType = ChartId | CustomChartsType;\n\nexport const getChartType = (backendChartType: BackEndChartType): ChartType[] => {\n if (backendChartType === 'response_line_chart') {\n return ['multi_line_chart', 'multi_measure_line_chart'];\n }\n if (backendChartType === 'response_bar_chart') {\n return ['multi_measure_column_chart'];\n }\n if (backendChartType === 'response_pie_chart') {\n return ['pie_chart'];\n }\n if (backendChartType === 'response_scatter_chart') {\n return ['scatter_plot'];\n }\n if (backendChartType === 'response_area_chart') {\n return ['area_chart'];\n }\n if (backendChartType === 'response_heatmap_chart') {\n return ['heatmap'];\n }\n return [];\n};\n" }, { "path": "components/chart/autoChart/index.tsx", "content": "import { Empty, Row, Col, Select, Tooltip } from 'antd';\nimport { Advice, Advisor } from '@antv/ava';\nimport { Chart } from '@berryv/g2-react';\nimport i18n, { I18nKeys } from '@/app/i18n';\nimport { customizeAdvisor, getVisAdvices } from './advisor/pipeline';\nimport { useContext, useEffect, useMemo, useState } from 'react';\nimport { defaultAdvicesFilter } from './advisor/utils';\nimport { AutoChartProps, ChartType, CustomAdvisorConfig, CustomChart, Specification } from './types';\nimport { customCharts } from './charts';\nimport { ChatContext } from '@/app/chat-context';\n\nconst { Option } = Select;\n\nexport const AutoChart = (props: AutoChartProps) => {\n const { data, chartType, scopeOfCharts, ruleConfig } = props;\n\n const { mode } = useContext(ChatContext);\n\n const [advisor, setAdvisor] = useState();\n const [advices, setAdvices] = useState([]);\n const [renderChartType, setRenderChartType] = useState();\n\n useEffect(() => {\n const input_charts: CustomChart[] = customCharts;\n const advisorConfig: CustomAdvisorConfig = {\n charts: input_charts,\n scopeOfCharts: undefined,\n ruleConfig,\n };\n setAdvisor(customizeAdvisor(advisorConfig));\n }, [ruleConfig, scopeOfCharts]);\n\n useEffect(() => {\n if (data && advisor) {\n const avaAdvices = getVisAdvices({\n data,\n myChartAdvisor: advisor,\n });\n const filteredAdvices = defaultAdvicesFilter({\n advices: avaAdvices,\n });\n\n filteredAdvices.sort((a, b) => {\n return chartType.indexOf(b.type) - chartType?.indexOf(a.type);\n });\n\n setAdvices(filteredAdvices);\n\n setRenderChartType(filteredAdvices[0]?.type as ChartType);\n }\n }, [data, advisor, chartType]);\n\n const visComponent = useMemo(() => {\n /* Advices exist, render the chart. */\n if (advices?.length > 0) {\n const chartTypeInput = renderChartType ?? advices[0].type;\n const spec: Specification = advices?.find((item: Advice) => item.type === chartTypeInput)?.spec ?? undefined;\n if (spec) {\n return (\n \n );\n }\n }\n }, [advices, renderChartType]);\n\n if (renderChartType) {\n return (\n
\n \n {i18n.t('Advices')}\n \n setRenderChartType(value)}\n size={'small'}\n >\n {advices?.map((item) => {\n const name = i18n.t(item.type as I18nKeys);\n\n return (\n \n );\n })}\n \n \n \n
{visComponent}
\n
\n );\n }\n\n return ;\n};\n\nexport * from './helpers';\n" }, { "path": "components/chart/autoChart/types.ts", "content": "import { Advice, AdvisorConfig, ChartId, Datum, FieldInfo, PureChartKnowledge } from '@antv/ava';\n\nexport type ChartType = ChartId | string;\n\nexport type Specification = Advice['spec'] | any;\nexport type RuleConfig = AdvisorConfig['ruleCfg'];\n\nexport type AutoChartProps = {\n data: Datum[];\n /** Chart type which are suggestted. */\n chartType: ChartType[];\n /** Charts exclude or include. */\n scopeOfCharts?: {\n exclude?: string[];\n include?: string[];\n };\n /** Customize rules. */\n ruleConfig?: RuleConfig;\n};\n\nexport type ChartKnowledge = PureChartKnowledge & { toSpec?: any };\n\nexport type CustomChart = {\n /** Chart type ID, unique. */\n chartType: ChartType;\n /** Chart knowledge. */\n chartKnowledge: ChartKnowledge;\n /** Chart name. */\n chineseName?: string;\n};\n\nexport type GetChartConfigProps = {\n data: Datum[];\n spec: Specification;\n dataProps: FieldInfo[];\n chartType?: ChartType;\n};\n\nexport type CustomAdvisorConfig = {\n charts?: CustomChart[];\n scopeOfCharts?: {\n exclude?: string[];\n include?: string[];\n };\n ruleConfig?: RuleConfig;\n};\n" }, { "path": "components/chart/bar-chart.tsx", "content": "import { ChatContext } from '@/app/chat-context';\nimport { ChartData } from '@/types/chat';\nimport { Chart } from '@berryv/g2-react';\nimport { useContext } from 'react';\n\nexport default function BarChart({ chart }: { key: string; chart: ChartData }) {\n const { mode } = useContext(ChatContext);\n\n return (\n
\n
\n
{chart.chart_name}
\n
{chart.chart_desc}
\n
\n \n
\n
\n
\n );\n}\n" }, { "path": "components/chart/index.tsx", "content": "import { Card, CardContent, Typography } from '@mui/joy';\nimport BarChart from './bar-chart';\nimport LineChart from './line-chart';\nimport TableChart from './table-chart';\nimport { ChartData } from '@/types/chat';\nimport { useMemo } from 'react';\n\ntype Props = {\n chartsData: Array;\n};\n\nfunction Chart({ chartsData }: Props) {\n const chartRows = useMemo(() => {\n if (chartsData) {\n let res = [];\n // 若是有类型为 IndicatorValue 的，提出去，独占一行\n const chartCalc = chartsData?.filter((item) => item.chart_type === 'IndicatorValue');\n if (chartCalc.length > 0) {\n res.push({\n charts: chartCalc,\n type: 'IndicatorValue',\n });\n }\n let otherCharts = chartsData?.filter((item) => item.chart_type !== 'IndicatorValue');\n let otherLength = otherCharts.length;\n let curIndex = 0;\n // charts 数量 3～8个，暂定每行排序\n let chartLengthMap = [[0], [1], [2], [1, 2], [1, 3], [2, 1, 2], [2, 1, 3], [3, 1, 3], [3, 2, 3]];\n chartLengthMap[otherLength].forEach((item) => {\n if (item > 0) {\n const rowsItem = otherCharts.slice(curIndex, curIndex + item);\n curIndex = curIndex + item;\n res.push({\n charts: rowsItem,\n });\n }\n });\n return res;\n }\n return undefined;\n }, [chartsData]);\n\n return (\n
\n {chartRows?.map((chartRow, index) => (\n
\n {chartRow.charts.map((chart) => {\n if (chart.chart_type === 'IndicatorValue') {\n return (\n
\n {chart.values.map((item) => (\n
\n \n \n \n {item.name}\n \n {item.value}\n \n \n
\n ))}\n
\n );\n } else if (chart.chart_type === 'LineChart') {\n return ;\n } else if (chart.chart_type === 'BarChart') {\n return ;\n } else if (chart.chart_type === 'Table') {\n return ;\n }\n })}\n
\n ))}\n
\n );\n}\n\nexport * from './autoChart';\nexport default Chart;\n" }, { "path": "components/chart/line-chart.tsx", "content": "import { ChartData } from '@/types/chat';\nimport { Chart } from '@berryv/g2-react';\nimport { useContext } from 'react';\nimport { ChatContext } from '@/app/chat-context';\n\nexport default function LineChart({ chart }: { chart: ChartData }) {\n const { mode } = useContext(ChatContext);\n\n return (\n
\n
\n
{chart.chart_name}
\n
{chart.chart_desc}
\n
\n \n
\n
\n
\n );\n}\n" }, { "path": "components/chart/table-chart.tsx", "content": "import { ChartData } from '@/types/chat';\nimport { Table } from '@mui/joy';\nimport { groupBy } from 'lodash';\n\nexport default function TableChart({ chart }: { key: string; chart: ChartData }) {\n const data = groupBy(chart.values, 'type');\n\n return (\n
\n
\n
{chart.chart_name}
\n
{chart.chart_desc}
\n
\n \n \n \n {Object.keys(data).map((key) => (\n \n ))}\n \n \n \n {Object.values(data)?.[0]?.map((value, i) => (\n \n {Object.keys(data)?.map((k) => (\n \n ))}\n \n ))}\n \n
{key}
{data?.[k]?.[i].value || ''}
\n
\n
\n
\n );\n}\n" }, { "path": "components/chat/agent-content.tsx", "content": "import { ChatContext } from '@/app/chat-context';\nimport { IChatDialogueMessageSchema } from '@/types/chat';\nimport classNames from 'classnames';\nimport { memo, useContext } from 'react';\nimport ReactMarkdown from 'react-markdown';\nimport markdownComponents from './chat-content/config';\nimport rehypeRaw from 'rehype-raw';\n\ninterface Props {\n content: IChatDialogueMessageSchema;\n}\n\nfunction formatMarkdownVal(val: string) {\n return val.replace(/]+)>/gi, '').replace(/]+)>/gi, '');\n}\n\nfunction AgentContent({ content }: Props) {\n const { scene } = useContext(ChatContext);\n\n const isView = content.role === 'view';\n\n return (\n \n {isView ? (\n \n {formatMarkdownVal(content.context)}\n \n ) : (\n
{content.context}
\n )}\n \n );\n}\n\nexport default memo(AgentContent);\n" }, { "path": "components/chat/chat-container.tsx", "content": "import React, { useCallback, useContext, useEffect, useState } from 'react';\nimport { useAsyncEffect } from 'ahooks';\nimport useChat from '@/hooks/use-chat';\nimport Completion from './completion';\nimport { ChartData, ChatHistoryResponse } from '@/types/chat';\nimport { apiInterceptors, getChatHistory } from '@/client/api';\nimport { ChatContext } from '@/app/chat-context';\nimport Header from './header';\nimport Chart from '../chart';\nimport classNames from 'classnames';\nimport MuiLoading from '../common/loading';\nimport { Empty } from 'antd';\nimport { useSearchParams } from 'next/navigation';\nimport { getInitMessage } from '@/utils';\n\nconst ChatContainer = () => {\n const searchParams = useSearchParams();\n const { scene, chatId, model, agent, setModel, history, setHistory } = useContext(ChatContext);\n const chat = useChat({});\n const initMessage = (searchParams && searchParams.get('initMessage')) ?? '';\n\n const [loading, setLoading] = useState(false);\n const [chartsData, setChartsData] = useState>();\n\n const getHistory = async () => {\n setLoading(true);\n const [, res] = await apiInterceptors(getChatHistory(chatId));\n setHistory(res ?? []);\n setLoading(false);\n };\n\n const getChartsData = (list: ChatHistoryResponse) => {\n const contextTemp = list[list.length - 1]?.context;\n if (contextTemp) {\n try {\n const contextObj = JSON.parse(contextTemp);\n setChartsData(contextObj?.template_name === 'report' ? contextObj?.charts : undefined);\n } catch (e) {\n setChartsData(undefined);\n }\n }\n };\n\n useAsyncEffect(async () => {\n const initMessage = getInitMessage();\n if (initMessage && initMessage.id === chatId) return;\n await getHistory();\n }, [initMessage, chatId]);\n\n useEffect(() => {\n if (!history.length) return;\n /** use last view model_name as default model name */\n const lastView = history.filter((i) => i.role === 'view')?.slice(-1)?.[0];\n lastView?.model_name && setModel(lastView.model_name);\n\n getChartsData(history);\n }, [history.length]);\n\n useEffect(() => {\n return () => {\n setHistory([]);\n };\n }, []);\n\n const handleChat = useCallback(\n (content: string, data?: Record) => {\n return new Promise((resolve) => {\n const tempHistory: ChatHistoryResponse = [\n ...history,\n { role: 'human', context: content, model_name: model, order: 0, time_stamp: 0 },\n { role: 'view', context: '', model_name: model, order: 0, time_stamp: 0 },\n ];\n const index = tempHistory.length - 1;\n setHistory([...tempHistory]);\n chat({\n data: { ...data, chat_mode: scene || 'chat_normal', model_name: model, user_input: content },\n chatId,\n onMessage: (message) => {\n if (data?.incremental) {\n tempHistory[index].context += message;\n } else {\n tempHistory[index].context = message;\n }\n setHistory([...tempHistory]);\n },\n onDone: () => {\n getChartsData(tempHistory);\n resolve();\n },\n onClose: () => {\n getChartsData(tempHistory);\n resolve();\n },\n onError: (message) => {\n tempHistory[index].context = message;\n setHistory([...tempHistory]);\n resolve();\n },\n });\n });\n },\n [history, chat, chatId, model, agent, scene],\n );\n\n return (\n <>\n \n {\n setModel(newModel);\n }}\n />\n
\n {!!chartsData?.length && (\n
\n \n
\n )}\n {!chartsData?.length && scene === 'chat_dashboard' && (\n \n )}\n {/** chat panel */}\n \n \n
\n \n \n );\n};\n\nexport default ChatContainer;\n" }, { "path": "components/chat/chat-content/agent-messages.tsx", "content": "import ReactMarkdown from 'react-markdown';\nimport markdownComponents from './config';\nimport { renderModelIcon } from '../header/model-selector';\nimport { SwapRightOutlined } from '@ant-design/icons';\n\ninterface Props {\n data: {\n sender: string;\n receiver: string;\n model: string | null;\n markdown: string;\n }[];\n}\n\nfunction AgentMessages({ data }: Props) {\n if (!data || !data.length) return null;\n\n return (\n <>\n {data.map((item, index) => (\n
\n
\n {item.model ? renderModelIcon(item.model) :
}\n
\n {item.sender}\n \n {item.receiver}\n
\n
\n
\n {item.markdown}\n
\n
\n ))}\n \n );\n}\n\nexport default AgentMessages;\n" }, { "path": "components/chat/chat-content/agent-plans.tsx", "content": "import { CaretRightOutlined, CheckOutlined, ClockCircleOutlined } from '@ant-design/icons';\nimport { Collapse } from 'antd';\nimport ReactMarkdown from 'react-markdown';\nimport markdownComponents from './config';\n\ninterface Props {\n data: {\n name: string;\n num: number;\n status: 'complete' | 'todo';\n agent: string;\n markdown: string;\n }[];\n}\n\nfunction AgentPlans({ data }: Props) {\n if (!data || !data.length) return null;\n\n return (\n }\n items={data.map((item, index) => {\n return {\n key: index,\n label: (\n
\n \n {item.name} - {item.agent}\n \n {item.status === 'complete' ? (\n \n ) : (\n \n )}\n
\n ),\n children: {item.markdown},\n };\n })}\n />\n );\n}\n\nexport default AgentPlans;\n" }, { "path": "components/chat/chat-content/chart-view.tsx", "content": "import { Datum } from '@antv/ava';\nimport { Table, Tabs, TabsProps } from 'antd';\nimport React from 'react';\nimport { format } from 'sql-formatter';\nimport { AutoChart, BackEndChartType, getChartType } from '@/components/chart/autoChart';\nimport { CodePreview } from './code-preview';\n\nfunction ChartView({ data, type, sql }: { data: Datum[]; type: BackEndChartType; sql: string }) {\n const columns = data?.[0]\n ? Object.keys(data?.[0])?.map((item) => {\n return {\n title: item,\n dataIndex: item,\n key: item,\n };\n })\n : [];\n const ChartItem = {\n key: 'chart',\n label: 'Chart',\n children: ,\n };\n const SqlItem = {\n key: 'sql',\n label: 'SQL',\n children: ,\n };\n const DataItem = {\n key: 'data',\n label: 'Data',\n children:
,\n };\n const TabItems: TabsProps['items'] = type === 'response_table' ? [DataItem, SqlItem] : [ChartItem, SqlItem, DataItem];\n\n return ;\n}\n\nexport default ChartView;\n" }, { "path": "components/chat/chat-content/code-preview.tsx", "content": "import { Button, message } from 'antd';\nimport { CopyOutlined } from '@ant-design/icons';\nimport { oneDark, coldarkDark } from 'react-syntax-highlighter/dist/esm/styles/prism';\nimport { Prism as SyntaxHighlighter } from 'react-syntax-highlighter';\nimport copy from 'copy-to-clipboard';\nimport { CSSProperties, useContext } from 'react';\nimport { ChatContext } from '@/app/chat-context';\n\ninterface Props {\n code: string;\n language: string;\n customStyle?: CSSProperties;\n light?: { [key: string]: CSSProperties };\n dark?: { [key: string]: CSSProperties };\n}\n\nexport function CodePreview({ code, light, dark, language, customStyle }: Props) {\n const { mode } = useContext(ChatContext);\n\n return (\n
\n }\n onClick={() => {\n const success = copy(code);\n message[success ? 'success' : 'error'](success ? 'Copy success' : 'Copy failed');\n }}\n />\n \n {code}\n \n
\n );\n}\n" }, { "path": "components/chat/chat-content/config.tsx", "content": "import { LinkOutlined, ReadOutlined, SyncOutlined } from '@ant-design/icons';\nimport ReactMarkdown from 'react-markdown';\nimport { Table, Image, Tag, Tabs, TabsProps, Popover } from 'antd';\nimport { format } from 'sql-formatter';\nimport { Reference } from '@/types/chat';\nimport { AutoChart, BackEndChartType, getChartType } from '@/components/chart';\nimport { CodePreview } from './code-preview';\nimport { Datum } from '@antv/ava';\nimport rehypeRaw from 'rehype-raw';\nimport { IChunk } from '@/types/knowledge';\nimport AgentPlans from './agent-plans';\nimport AgentMessages from './agent-messages';\nimport VisConvertError from './vis-convert-error';\nimport VisChart from './vis-chart';\nimport VisDashboard from './vis-dashboard';\nimport VisPlugin from './vis-plugin';\nimport VisCode from './vis-code';\n\ntype MarkdownComponent = Parameters['0']['components'];\n\nconst customeTags: (keyof JSX.IntrinsicElements)[] = ['custom-view', 'chart-view', 'references', 'summary'];\n\nfunction matchCustomeTagValues(context: string) {\n const matchValues = customeTags.reduce((acc, tagName) => {\n const tagReg = new RegExp(`<${tagName}[^>]*\\/?>`, 'gi');\n context = context.replace(tagReg, (matchVal) => {\n acc.push(matchVal);\n return '';\n });\n return acc;\n }, []);\n return { context, matchValues };\n}\n\nconst basicComponents: MarkdownComponent = {\n code({ inline, node, className, children, style, ...props }) {\n const content = String(children);\n /**\n * @description\n * In some cases, tags are nested within code syntax,\n * so it is necessary to extract the tags present in the code block and render them separately.\n */\n const { context, matchValues } = matchCustomeTagValues(content);\n const lang = className?.replace('language-', '') || 'javascript';\n\n if (lang === 'agent-plans') {\n try {\n const data = JSON.parse(content) as Parameters[0]['data'];\n return ;\n } catch (e) {\n return ;\n }\n }\n\n if (lang === 'agent-messages') {\n try {\n const data = JSON.parse(content) as Parameters[0]['data'];\n return ;\n } catch (e) {\n return ;\n }\n }\n\n if (lang === 'vis-convert-error') {\n try {\n const data = JSON.parse(content) as Parameters[0]['data'];\n return ;\n } catch (e) {\n return ;\n }\n }\n\n if (lang === 'vis-dashboard') {\n try {\n const data = JSON.parse(content) as Parameters[0]['data'];\n return ;\n } catch (e) {\n return ;\n }\n }\n\n if (lang === 'vis-chart') {\n try {\n const data = JSON.parse(content) as Parameters[0]['data'];\n return ;\n } catch (e) {\n return ;\n }\n }\n\n if (lang === 'vis-plugin') {\n try {\n const data = JSON.parse(content) as Parameters[0]['data'];\n return ;\n } catch (e) {\n return ;\n }\n }\n\n if (lang === 'vis-code') {\n try {\n const data = JSON.parse(content) as Parameters[0]['data'];\n return ;\n } catch (e) {\n return ;\n }\n }\n\n return (\n <>\n {!inline ? (\n \n ) : (\n \n {children}\n \n )}\n \n {matchValues.join('\\n')}\n \n \n );\n },\n ul({ children }) {\n return
    {children}
;\n },\n ol({ children }) {\n return
    {children}
;\n },\n li({ children, ordered }) {\n return
  • {children}
    • ;\n },\n table({ children }) {\n return (\n
    {children}
    \n );\n },\n thead({ children }) {\n return {children};\n },\n th({ children }) {\n return {children};\n },\n td({ children }) {\n return {children};\n },\n h1({ children }) {\n return

    {children}

    ;\n },\n h2({ children }) {\n return

    {children}

    ;\n },\n h3({ children }) {\n return

    {children}

    ;\n },\n h4({ children }) {\n return

    {children}

    ;\n },\n a({ children, href }) {\n return (\n \n );\n },\n img({ src, alt }) {\n return (\n
    \n } color=\"processing\">\n Image Loading...\n \n }\n fallback=\"/images/fallback.png\"\n />\n
    \n );\n },\n blockquote({ children }) {\n return (\n
    \n {children}\n
    \n );\n },\n};\n\nconst extraComponents: MarkdownComponent = {\n 'chart-view': function ({ content, children }) {\n let data: {\n data: Datum[];\n type: BackEndChartType;\n sql: string;\n };\n try {\n data = JSON.parse(content as string);\n } catch (e) {\n console.log(e, content);\n data = {\n type: 'response_table',\n sql: '',\n data: [],\n };\n }\n\n const columns = data?.data?.[0]\n ? Object.keys(data?.data?.[0])?.map((item) => {\n return {\n title: item,\n dataIndex: item,\n key: item,\n };\n })\n : [];\n\n const ChartItem = {\n key: 'chart',\n label: 'Chart',\n children: ,\n };\n const SqlItem = {\n key: 'sql',\n label: 'SQL',\n children: ,\n };\n const DataItem = {\n key: 'data',\n label: 'Data',\n children: ,\n };\n const TabItems: TabsProps['items'] = data?.type === 'response_table' ? [DataItem, SqlItem] : [ChartItem, SqlItem, DataItem];\n\n return (\n
    \n \n {children}\n
    \n );\n },\n references: function ({ title, references, children }) {\n let referenceData;\n // Low version compatibility, read data from children\n if (children) {\n try {\n referenceData = JSON.parse(children as string);\n title = referenceData.title;\n references = referenceData.references;\n } catch (error) {\n console.log('parse references failed', error);\n return

    Render Reference Error!

    ;\n }\n } else {\n // new version, read from tag props.\n try {\n references = JSON.parse(references as string);\n } catch (error) {\n console.log('parse references failed', error);\n return

    Render Reference Error!

    ;\n }\n }\n if (!references || references?.length < 1) {\n return null;\n }\n return (\n
    \n

    \n \n {title}\n

    \n {references.map((reference: Reference, index: number) => (\n
    \n [{index + 1}]\n {reference.name}\n {reference?.chunks?.map((chunk: IChunk | number, index) => (\n \n {typeof chunk === 'object' ? (\n \n

    Content:

    \n

    {chunk?.content || 'No Content'}

    \n

    MetaData:

    \n

    {chunk?.meta_info || 'No MetaData'}

    \n

    Score:

    \n

    {chunk?.recall_score || ''}

    \n
    \n }\n title=\"Chunk Information\"\n >\n \n {chunk?.id}\n \n \n ) : (\n \n {chunk}\n \n )}\n {index < reference?.chunks.length - 1 && ,}\n \n ))}\n
    \n ))}\n \n );\n },\n summary: function ({ children }) {\n return (\n
    \n

    \n \n Document Summary\n

    \n
    {children}
    \n
    \n );\n },\n};\n\nconst markdownComponents = {\n ...basicComponents,\n ...extraComponents,\n};\n\nexport default markdownComponents;\n" }, { "path": "components/chat/chat-content/index.tsx", "content": "import { PropsWithChildren, ReactNode, memo, useContext, useMemo } from 'react';\nimport { CheckOutlined, ClockCircleOutlined, CloseOutlined, CodeOutlined, LoadingOutlined, RobotOutlined, UserOutlined } from '@ant-design/icons';\nimport ReactMarkdown from 'react-markdown';\nimport { IChatDialogueMessageSchema } from '@/types/chat';\nimport rehypeRaw from 'rehype-raw';\nimport classNames from 'classnames';\nimport { Tag } from 'antd';\nimport { renderModelIcon } from '../header/model-selector';\nimport { ChatContext } from '@/app/chat-context';\nimport markdownComponents from './config';\n\ninterface Props {\n content: Omit & {\n context:\n | string\n | {\n template_name: string;\n template_introduce: string;\n };\n };\n isChartChat?: boolean;\n onLinkClick?: () => void;\n}\n\ntype MarkdownComponent = Parameters['0']['components'];\n\ntype DBGPTView = {\n name: string;\n status: 'todo' | 'runing' | 'failed' | 'completed' | (string & {});\n result?: string;\n err_msg?: string;\n};\n\nconst pluginViewStatusMapper: Record = {\n todo: {\n bgClass: 'bg-gray-500',\n icon: ,\n },\n runing: {\n bgClass: 'bg-blue-500',\n icon: ,\n },\n failed: {\n bgClass: 'bg-red-500',\n icon: ,\n },\n completed: {\n bgClass: 'bg-green-500',\n icon: ,\n },\n};\n\nfunction formatMarkdownVal(val: string) {\n return val\n .replaceAll('\\\\n', '\\n')\n .replace(/]+)>/gi, '
    ')\n .replace(/]+)>/gi, '');\n}\n\nfunction ChatContent({ children, content, isChartChat, onLinkClick }: PropsWithChildren) {\n const { scene } = useContext(ChatContext);\n\n const { context, model_name, role } = content;\n const isRobot = role === 'view';\n\n const { relations, value, cachePluginContext } = useMemo<{ relations: string[]; value: string; cachePluginContext: DBGPTView[] }>(() => {\n if (typeof context !== 'string') {\n return {\n relations: [],\n value: '',\n cachePluginContext: [],\n };\n }\n const [value, relation] = context.split('\\trelations:');\n const relations = relation ? relation.split(',') : [];\n const cachePluginContext: DBGPTView[] = [];\n\n let cacheIndex = 0;\n const result = value.replace(/]*>[^<]*<\\/dbgpt-view>/gi, (matchVal) => {\n try {\n const pluginVal = matchVal.replaceAll('\\n', '\\\\n').replace(/<[^>]*>|<\\/[^>]*>/gm, '');\n const pluginContext = JSON.parse(pluginVal) as DBGPTView;\n const replacement = `${cacheIndex}`;\n\n cachePluginContext.push({\n ...pluginContext,\n result: formatMarkdownVal(pluginContext.result ?? ''),\n });\n cacheIndex++;\n\n return replacement;\n } catch (e) {\n console.log((e as any).message, e);\n return matchVal;\n }\n });\n return {\n relations,\n cachePluginContext,\n value: result,\n };\n }, [context]);\n\n const extraMarkdownComponents = useMemo(\n () => ({\n 'custom-view'({ children }) {\n const index = +children.toString();\n if (!cachePluginContext[index]) {\n return children;\n }\n const { name, status, err_msg, result } = cachePluginContext[index];\n const { bgClass, icon } = pluginViewStatusMapper[status] ?? {};\n return (\n
    \n
    \n {name}\n {icon}\n
    \n {result ? (\n
    \n \n {result ?? ''}\n \n
    \n ) : (\n
    {err_msg}
    \n )}\n
    \n );\n },\n }),\n [context, cachePluginContext],\n );\n\n if (!isRobot && !context) return
    ;\n\n return (\n \n
    \n {isRobot ? renderModelIcon(model_name) || : }\n
    \n
    \n {/* User Input */}\n {!isRobot && typeof context === 'string' && context}\n {/* Render Report */}\n {isRobot && isChartChat && typeof context === 'object' && (\n
    \n {`[${context.template_name}]: `}\n \n \n {context.template_introduce || 'More Details'}\n \n
    \n )}\n {/* Markdown */}\n {isRobot && typeof context === 'string' && (\n \n {formatMarkdownVal(value)}\n \n )}\n {!!relations?.length && (\n
    \n {relations?.map((value, index) => (\n \n {value}\n \n ))}\n
    \n )}\n
    \n {children}\n \n );\n}\n\nexport default memo(ChatContent);\n" }, { "path": "components/chat/chat-content/vis-chart.tsx", "content": "import { BackEndChartType } from '@/components/chart';\nimport ChartView from './chart-view';\nimport { Datum } from '@antv/ava';\n\ninterface Props {\n data: {\n data: Datum[];\n describe: string;\n title: string;\n type: BackEndChartType;\n sql: string;\n };\n}\n\nfunction VisChart({ data }: Props) {\n return ;\n}\n\nexport default VisChart;\n" }, { "path": "components/chat/chat-content/vis-code.tsx", "content": "import ReactMarkdown from 'react-markdown';\nimport remarkGfm from 'remark-gfm';\nimport markdownComponents from './config';\nimport { CodePreview } from './code-preview';\nimport classNames from 'classnames';\nimport { useState } from 'react';\nimport { CheckOutlined, CloseOutlined } from '@ant-design/icons';\nimport { useTranslation } from 'react-i18next';\nimport { oneLight, oneDark } from 'react-syntax-highlighter/dist/esm/styles/prism';\n\ninterface Props {\n data: {\n code: string[];\n exit_success: true;\n language: string;\n log: string;\n };\n}\n\nfunction VisCode({ data }: Props) {\n const { t } = useTranslation();\n\n const [show, setShow] = useState(0);\n\n return (\n
    \n
    \n
    \n {data.code.map((item, index) => (\n {\n setShow(index);\n }}\n >\n CODE {index + 1}: {item[0]}\n
    \n ))}\n
    \n {data.code.length && (\n \n )}\n
    \n
    \n
    \n
    \n {t('Terminal')} {data.exit_success ? : }\n
    \n
    \n
    \n \n {data.log}\n \n
    \n
    \n \n );\n}\n\nexport default VisCode;\n" }, { "path": "components/chat/chat-content/vis-convert-error.tsx", "content": "import { format } from 'sql-formatter';\nimport { CodePreview } from './code-preview';\n\ninterface Props {\n data: {\n display_type: string;\n sql: string;\n thought: string;\n };\n}\n\nfunction VisConvertError({ data }: Props) {\n return (\n
    \n
    {data.display_type}
    \n
    \n
    {data.thought}
    \n \n
    \n
    \n );\n}\n\nexport default VisConvertError;\n" }, { "path": "components/chat/chat-content/vis-dashboard.tsx", "content": "import { AutoChart, BackEndChartType, getChartType } from '@/components/chart';\nimport { Datum } from '@antv/ava';\nimport { useMemo } from 'react';\n\ninterface Props {\n data: {\n data: {\n data: Datum[];\n describe: string;\n title: string;\n type: BackEndChartType;\n sql: string;\n }[];\n title: string | null;\n display_strategy: string;\n chart_count: number;\n };\n}\n\nconst chartLayout = [[2], [1, 2], [1, 3], [2, 1, 2], [2, 1, 3], [3, 1, 3], [3, 2, 3]];\n\nfunction VisDashboard({ data }: Props) {\n const charts = useMemo(() => {\n if (data.chart_count > 1) {\n const layout = chartLayout[data.chart_count - 2];\n let prevIndex = 0;\n return layout.map((item) => {\n const items = data.data.slice(prevIndex, prevIndex + item);\n prevIndex = item;\n return items;\n });\n }\n return [data.data];\n }, [data.data, data.chart_count]);\n\n return (\n
    \n {charts.map((row, index) => (\n
    \n {row.map((chart, subIndex) => (\n \n
    \n {chart.title &&
    {chart.title}
    }\n {chart.describe &&
    {chart.describe}
    }\n
    \n \n
    \n ))}\n
    \n ))}\n \n );\n}\n\nexport default VisDashboard;\n" }, { "path": "components/chat/chat-content/vis-plugin.tsx", "content": "import { CheckOutlined, ClockCircleOutlined, CloseOutlined, LoadingOutlined } from '@ant-design/icons';\nimport classNames from 'classnames';\nimport { ReactNode } from 'react';\nimport ReactMarkdown from 'react-markdown';\nimport markdownComponents from './config';\nimport rehypeRaw from 'rehype-raw';\n\ninterface IVisPlugin {\n name: string;\n args: {\n query: string;\n };\n status: 'todo' | 'runing' | 'failed' | 'complete' | (string & {});\n logo: string | null;\n result: string;\n err_msg: string | null;\n}\n\ninterface Props {\n data: IVisPlugin;\n}\n\nconst pluginViewStatusMapper: Record = {\n todo: {\n bgClass: 'bg-gray-500',\n icon: ,\n },\n runing: {\n bgClass: 'bg-blue-500',\n icon: ,\n },\n failed: {\n bgClass: 'bg-red-500',\n icon: ,\n },\n complete: {\n bgClass: 'bg-green-500',\n icon: ,\n },\n};\n\nfunction VisPlugin({ data }: Props) {\n const { bgClass, icon } = pluginViewStatusMapper[data.status] ?? {};\n\n return (\n
    \n
    \n {data.name}\n {icon}\n
    \n {data.result ? (\n
    \n \n {data.result ?? ''}\n \n
    \n ) : (\n
    {data.err_msg}
    \n )}\n
    \n );\n}\n\nexport default VisPlugin;\n" }, { "path": "components/chat/chat-feedback.tsx", "content": "import React, { useState, useRef, useCallback, useEffect, useContext } from 'react';\nimport { MoreHoriz, CloseRounded } from '@mui/icons-material';\nimport {\n MenuButton,\n Button,\n Menu,\n MenuItem,\n Dropdown,\n Box,\n Grid,\n IconButton,\n Slider,\n Select,\n Option,\n Textarea,\n Typography,\n styled,\n Sheet,\n} from '@mui/joy';\nimport { message, Tooltip } from 'antd';\nimport { apiInterceptors, getChatFeedBackItme, postChatFeedBackForm } from '@/client/api';\nimport { ChatContext } from '@/app/chat-context';\nimport { ChatFeedBackSchema } from '@/types/db';\nimport { useTranslation } from 'react-i18next';\nimport { FeedBack } from '@/types/chat';\n\ntype Props = {\n conv_index: number;\n question: any;\n knowledge_space: string;\n select_param?: FeedBack;\n};\n\nconst ChatFeedback = ({ conv_index, question, knowledge_space, select_param }: Props) => {\n const { t } = useTranslation();\n const { chatId } = useContext(ChatContext);\n const [ques_type, setQuesType] = useState('');\n const [score, setScore] = useState(4);\n const [text, setText] = useState('');\n const action = useRef(null);\n const [messageApi, contextHolder] = message.useMessage();\n\n const handleOpenChange = useCallback(\n (event: any, isOpen: boolean) => {\n if (isOpen) {\n apiInterceptors(getChatFeedBackItme(chatId, conv_index))\n .then((res) => {\n const finddata = res[1] ?? {};\n setQuesType(finddata.ques_type ?? '');\n setScore(parseInt(finddata.score ?? '4'));\n setText(finddata.messages ?? '');\n })\n .catch((err) => {\n console.log(err);\n });\n } else {\n setQuesType('');\n setScore(4);\n setText('');\n }\n },\n [chatId, conv_index],\n );\n\n const marks = [\n { value: 0, label: '0' },\n { value: 1, label: '1' },\n { value: 2, label: '2' },\n { value: 3, label: '3' },\n { value: 4, label: '4' },\n { value: 5, label: '5' },\n ];\n function valueText(value: number) {\n return {\n 0: t('Lowest'),\n 1: t('Missed'),\n 2: t('Lost'),\n 3: t('Incorrect'),\n 4: t('Verbose'),\n 5: t('Best'),\n }[value];\n }\n const Item = styled(Sheet)(({ theme }) => ({\n backgroundColor: theme.palette.mode === 'dark' ? '#FBFCFD' : '#0E0E10',\n ...theme.typography['body-sm'],\n padding: theme.spacing(1),\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n borderRadius: 4,\n width: '100%',\n height: '100%',\n }));\n const handleSubmit = (event: any) => {\n event.preventDefault();\n const formData: ChatFeedBackSchema = {\n conv_uid: chatId,\n conv_index: conv_index,\n question: question,\n knowledge_space: knowledge_space,\n score: score,\n ques_type: ques_type,\n messages: text,\n };\n console.log(formData);\n apiInterceptors(\n postChatFeedBackForm({\n data: formData,\n }),\n )\n .then((res) => {\n messageApi.open({ type: 'success', content: 'save success' });\n })\n .catch((err) => {\n messageApi.open({ type: 'error', content: 'save error' });\n });\n };\n return (\n \n {contextHolder}\n \n \n \n \n \n \n \n \n
    \n \n \n {t('Q_A_Category')}\n \n \n setQuesType(newValue ?? '')}\n {...(ques_type && {\n // display the button and remove select indicator\n // when user has selected a value\n endDecorator: (\n {\n // don't open the popup when clicking on this button\n event.stopPropagation();\n }}\n onClick={() => {\n setQuesType('');\n action.current?.focusVisible();\n }}\n >\n \n \n ),\n indicator: null,\n })}\n sx={{ width: '100%' }}\n >\n {select_param &&\n Object.keys(select_param)?.map((paramItem) => (\n \n ))}\n \n \n \n \n \n
    {t('feed_back_desc')}
    \n \n }\n variant=\"solid\"\n placement=\"left\"\n >\n {t('Q_A_Rating')}\n \n     \n     \n \n setScore(event.target?.value)}\n value={score}\n />\n \n \n setText(event.target.value)}\n minRows={2}\n maxRows={4}\n endDecorator={\n \n {t('input_count') + text.length + t('input_unit')}\n \n }\n sx={{ width: '100%', fontSize: 14 }}\n />\n \n \n \n \n     \n \n \n     \n     \n );\n};\nexport default ChatFeedback;\n" }, { "path": "components/chat/completion.tsx", "content": "import { useState, useRef, useEffect, useMemo, useContext } from 'react';\nimport { useSearchParams } from 'next/navigation';\nimport MonacoEditor from './monaco-editor';\nimport ChatContent from './chat-content';\nimport ChatFeedback from './chat-feedback';\nimport { ChatContext } from '@/app/chat-context';\nimport { FeedBack, IChatDialogueMessageSchema } from '@/types/chat';\nimport classNames from 'classnames';\nimport { Empty, Modal, message, Tooltip } from 'antd';\nimport { renderModelIcon } from './header/model-selector';\nimport { cloneDeep } from 'lodash';\nimport copy from 'copy-to-clipboard';\nimport { useTranslation } from 'react-i18next';\nimport CompletionInput from '../common/completion-input';\nimport { useAsyncEffect } from 'ahooks';\nimport { STORAGE_INIT_MESSAGE_KET } from '@/utils';\nimport { Button, IconButton } from '@mui/joy';\nimport { CopyOutlined, RedoOutlined } from '@ant-design/icons';\nimport { getInitMessage } from '@/utils';\nimport { apiInterceptors, getChatFeedBackSelect } from '@/client/api';\nimport useSummary from '@/hooks/use-summary';\nimport AgentContent from './agent-content';\n\ntype Props = {\n messages: IChatDialogueMessageSchema[];\n onSubmit: (message: string, otherQueryBody?: Record) => Promise;\n};\n\nconst Completion = ({ messages, onSubmit }: Props) => {\n const { dbParam, currentDialogue, scene, model, refreshDialogList, chatId, agent, docId } = useContext(ChatContext);\n const { t } = useTranslation();\n const searchParams = useSearchParams();\n\n const flowSelectParam = (searchParams && searchParams.get('select_param')) ?? '';\n const spaceNameOriginal = (searchParams && searchParams.get('spaceNameOriginal')) ?? '';\n\n const [isLoading, setIsLoading] = useState(false);\n const [jsonModalOpen, setJsonModalOpen] = useState(false);\n const [showMessages, setShowMessages] = useState(messages);\n const [jsonValue, setJsonValue] = useState('');\n const [select_param, setSelectParam] = useState();\n\n const scrollableRef = useRef(null);\n\n // const incremental = useMemo(() => scene === 'chat_flow', [scene]);\n const isChartChat = useMemo(() => scene === 'chat_dashboard', [scene]);\n\n const summary = useSummary();\n\n const selectParam = useMemo(() => {\n switch (scene) {\n case 'chat_agent':\n return agent;\n case 'chat_excel':\n return currentDialogue?.select_param;\n case 'chat_flow':\n return flowSelectParam;\n default:\n return spaceNameOriginal || dbParam;\n }\n }, [scene, agent, currentDialogue, dbParam, spaceNameOriginal, flowSelectParam]);\n\n const handleChat = async (content: string) => {\n if (isLoading || !content.trim()) return;\n if (scene === 'chat_agent' && !agent) {\n message.warning(t('choice_agent_tip'));\n return;\n }\n try {\n setIsLoading(true);\n await onSubmit(content, {\n select_param: selectParam ?? '',\n // incremental,\n });\n } finally {\n setIsLoading(false);\n }\n };\n\n const handleJson2Obj = (jsonStr: string) => {\n try {\n return JSON.parse(jsonStr);\n } catch (e) {\n return jsonStr;\n }\n };\n\n const [messageApi, contextHolder] = message.useMessage();\n\n const onCopyContext = async (context: any) => {\n const pureStr = context?.replace(/\\trelations:.*/g, '');\n const result = copy(pureStr);\n if (result) {\n if (pureStr) {\n messageApi.open({ type: 'success', content: t('Copy_success') });\n } else {\n messageApi.open({ type: 'warning', content: t('Copy_nothing') });\n }\n } else {\n messageApi.open({ type: 'error', content: t('Copry_error') });\n }\n };\n\n const handleRetry = async () => {\n if (isLoading || !docId) {\n return;\n }\n setIsLoading(true);\n await summary(docId);\n setIsLoading(false);\n };\n\n useAsyncEffect(async () => {\n const initMessage = getInitMessage();\n if (initMessage && initMessage.id === chatId) {\n await handleChat(initMessage.message);\n refreshDialogList();\n localStorage.removeItem(STORAGE_INIT_MESSAGE_KET);\n }\n }, [chatId]);\n\n useEffect(() => {\n let tempMessage: IChatDialogueMessageSchema[] = messages;\n if (isChartChat) {\n tempMessage = cloneDeep(messages).map((item) => {\n if (item?.role === 'view' && typeof item?.context === 'string') {\n item.context = handleJson2Obj(item?.context);\n }\n return item;\n });\n }\n setShowMessages(tempMessage.filter((item) => ['view', 'human'].includes(item.role)));\n }, [isChartChat, messages]);\n\n useEffect(() => {\n apiInterceptors(getChatFeedBackSelect())\n .then((res) => {\n setSelectParam(res[1] ?? {});\n })\n .catch((err) => {\n console.log(err);\n });\n }, []);\n\n useEffect(() => {\n setTimeout(() => {\n scrollableRef.current?.scrollTo(0, scrollableRef.current.scrollHeight);\n }, 50);\n }, [messages]);\n\n return (\n <>\n {contextHolder}\n
    \n
    \n {showMessages.length ? (\n showMessages.map((content, index) => {\n if (scene === 'chat_agent') {\n return ;\n }\n return (\n {\n setJsonModalOpen(true);\n setJsonValue(JSON.stringify(content?.context, null, 2));\n }}\n >\n {content.role === 'view' && (\n
    \n {scene === 'chat_knowledge' && content.retry ? (\n \n ) : null}\n
    \n e?.role === 'human' && e?.order === content.order)[0]?.context}\n knowledge_space={spaceNameOriginal || dbParam || ''}\n />\n \n onCopyContext(content?.context)}\n slots={{ root: IconButton }}\n slotProps={{ root: { variant: 'plain', color: 'primary' } }}\n sx={{ borderRadius: 40 }}\n >\n \n \n \n
    \n
    \n )}\n \n );\n })\n ) : (\n \n )}\n
    \n
    \n \n
    \n {model &&
    {renderModelIcon(model)}
    }\n \n
    \n \n {\n setJsonModalOpen(false);\n }}\n onCancel={() => {\n setJsonModalOpen(false);\n }}\n >\n \n \n \n );\n};\n\nexport default Completion;\n" }, { "path": "components/chat/db-editor.tsx", "content": "import React from 'react';\nimport { useRequest } from 'ahooks';\nimport { Select, Option, Table, Box, Typography, Tooltip } from '@mui/joy';\nimport { Button } from 'antd';\nimport AutoAwesomeMotionIcon from '@mui/icons-material/AutoAwesomeMotion';\nimport { Input, Tree, Empty, Tabs } from 'antd';\nimport type { DataNode } from 'antd/es/tree';\nimport MonacoEditor from './monaco-editor';\nimport { sendGetRequest, sendSpacePostRequest } from '@/utils/request';\nimport { useSearchParams } from 'next/navigation';\nimport { OnChange } from '@monaco-editor/react';\nimport Header from './header';\nimport Chart from '../chart';\n\nconst { Search } = Input;\n\ninterface EditorValueProps {\n sql?: string;\n thoughts?: string;\n title?: string;\n showcase?: string;\n}\n\ninterface RoundProps {\n db_name: string;\n round: number;\n round_name: string;\n}\n\ninterface IProps {\n editorValue?: EditorValueProps;\n chartData?: any;\n tableData?: any;\n handleChange: OnChange;\n}\n\ninterface ITableTreeItem {\n title: string;\n key: string;\n type: string;\n default_value: string | null;\n can_null: string;\n comment: string | null;\n children: Array;\n}\n\nfunction DbEditorContent({ editorValue, chartData, tableData, handleChange }: IProps) {\n const chartWrapper = React.useMemo(() => {\n if (!chartData) return
    ;\n return (\n
    \n \n
    \n );\n }, [chartData]);\n\n return (\n <>\n
    \n
    \n \n
    \n {chartWrapper}\n
    \n
    \n {tableData?.values?.length > 0 ? (\n
    \n \n \n {tableData?.columns?.map((column: any, i: number) => (\n \n ))}\n \n \n \n {tableData?.values?.map((value: any, i: number) => (\n \n {Object.keys(value)?.map((v) => (\n \n ))}\n \n ))}\n \n
    {column}
    {value[v]}
    \n ) : (\n
    \n \n
    \n )}\n \n \n );\n}\n\nfunction DbEditor() {\n const [expandedKeys, setExpandedKeys] = React.useState([]);\n const [searchValue, setSearchValue] = React.useState('');\n const [currentRound, setCurrentRound] = React.useState();\n const [autoExpandParent, setAutoExpandParent] = React.useState(true);\n const [chartData, setChartData] = React.useState();\n const [editorValue, setEditorValue] = React.useState();\n const [newEditorValue, setNewEditorValue] = React.useState();\n const [tableData, setTableData] = React.useState<{ columns: string[]; values: any }>();\n const [currentTabIndex, setCurrentTabIndex] = React.useState();\n\n const searchParams = useSearchParams();\n const id = searchParams?.get('id');\n const scene = searchParams?.get('scene');\n\n const { data: rounds, loading: roundsLoading } = useRequest(\n async () =>\n await sendGetRequest('/v1/editor/sql/rounds', {\n con_uid: id,\n }),\n {\n onSuccess: (res) => {\n const lastItem = res?.data?.[res?.data?.length - 1];\n if (lastItem) {\n setCurrentRound(lastItem?.round);\n }\n },\n },\n );\n\n const { run: runSql, loading: runLoading } = useRequest(\n async () => {\n const db_name = rounds?.data?.find((item) => item.round === currentRound)?.db_name;\n return await sendSpacePostRequest(`/api/v1/editor/sql/run`, {\n db_name,\n sql: newEditorValue?.sql,\n });\n },\n {\n manual: true,\n onSuccess: (res) => {\n setTableData({\n columns: res?.data?.colunms,\n values: res?.data?.values,\n });\n },\n },\n );\n\n const { run: runCharts, loading: runChartsLoading } = useRequest(\n async () => {\n const db_name = rounds?.data?.find((item) => item.round === currentRound)?.db_name;\n const params: {\n db_name: string;\n sql?: string;\n chart_type?: string;\n } = {\n db_name,\n sql: newEditorValue?.sql,\n };\n if (scene === 'chat_dashboard') {\n params['chart_type'] = newEditorValue?.showcase;\n }\n return await sendSpacePostRequest(`/api/v1/editor/chart/run`, params);\n },\n {\n manual: true,\n ready: !!newEditorValue?.sql,\n onSuccess: (res) => {\n if (res?.success) {\n setTableData({\n columns: res?.data?.sql_data?.colunms || [],\n values: res?.data?.sql_data?.values || [],\n });\n if (!res?.data?.chart_values) {\n setChartData(undefined);\n } else {\n setChartData({\n type: res?.data?.chart_type,\n values: res?.data?.chart_values,\n title: newEditorValue?.title,\n description: newEditorValue?.thoughts,\n });\n }\n }\n },\n },\n );\n\n const { run: submitSql, loading: submitLoading } = useRequest(\n async () => {\n const db_name = rounds?.data?.find((item: RoundProps) => item.round === currentRound)?.db_name;\n return await sendSpacePostRequest(`/api/v1/sql/editor/submit`, {\n conv_uid: id,\n db_name,\n conv_round: currentRound,\n old_sql: editorValue?.sql,\n old_speak: editorValue?.thoughts,\n new_sql: newEditorValue?.sql,\n new_speak: newEditorValue?.thoughts?.match(/^\\n--(.*)\\n\\n$/)?.[1]?.trim() || newEditorValue?.thoughts,\n });\n },\n {\n manual: true,\n onSuccess: (res) => {\n if (res?.success) {\n runSql();\n }\n },\n },\n );\n\n const { run: submitChart, loading: submitChartLoading } = useRequest(\n async () => {\n const db_name = rounds?.data?.find((item) => item.round === currentRound)?.db_name;\n return await sendSpacePostRequest(`/api/v1/chart/editor/submit`, {\n conv_uid: id,\n chart_title: newEditorValue?.title,\n db_name,\n old_sql: editorValue?.[currentTabIndex]?.sql,\n new_chart_type: newEditorValue?.showcase,\n new_sql: newEditorValue?.sql,\n new_comment: newEditorValue?.thoughts?.match(/^\\n--(.*)\\n\\n$/)?.[1]?.trim() || newEditorValue?.thoughts,\n gmt_create: new Date().getTime(),\n });\n },\n {\n manual: true,\n onSuccess: (res) => {\n if (res?.success) {\n runCharts();\n }\n },\n },\n );\n\n const { data: tables } = useRequest(\n async () => {\n const db_name = rounds?.data?.find((item: RoundProps) => item.round === currentRound)?.db_name;\n return await sendGetRequest('/v1/editor/db/tables', {\n db_name,\n page_index: 1,\n page_size: 200,\n });\n },\n {\n ready: !!rounds?.data?.find((item: RoundProps) => item.round === currentRound)?.db_name,\n refreshDeps: [rounds?.data?.find((item: RoundProps) => item.round === currentRound)?.db_name],\n },\n );\n\n const { run: handleGetEditorSql } = useRequest(\n async (round) =>\n await sendGetRequest('/v1/editor/sql', {\n con_uid: id,\n round,\n }),\n {\n manual: true,\n onSuccess: (res) => {\n let sql = undefined;\n try {\n if (Array.isArray(res?.data)) {\n sql = res?.data;\n setCurrentTabIndex('0');\n } else if (typeof res?.data === 'string') {\n const d = JSON.parse(res?.data);\n sql = d;\n } else {\n sql = res?.data;\n }\n } catch (e) {\n console.log(e);\n } finally {\n setEditorValue(sql);\n if (Array.isArray(sql)) {\n setNewEditorValue(sql?.[Number(currentTabIndex || 0)]);\n } else {\n setNewEditorValue(sql);\n }\n }\n },\n },\n );\n\n const treeData = React.useMemo(() => {\n const loop = (data: Array, parentKey?: string | number): DataNode[] =>\n data.map((item: ITableTreeItem) => {\n const strTitle = item.title;\n const index = strTitle.indexOf(searchValue);\n const beforeStr = strTitle.substring(0, index);\n const afterStr = strTitle.slice(index + searchValue.length);\n const showTitle =\n index > -1 ? (\n \n \n {beforeStr}\n {searchValue}\n {afterStr}\n {item?.type && (\n \n {`[${item?.type}]`}\n \n )}\n \n \n ) : (\n \n \n {strTitle}\n {item?.type && (\n \n {`[${item?.type}]`}\n \n )}\n \n \n );\n if (item.children) {\n const itemKey = parentKey ? String(parentKey) + '_' + item.key : item.key;\n return { title: strTitle, showTitle, key: itemKey, children: loop(item.children, itemKey) };\n }\n\n return {\n title: strTitle,\n showTitle,\n key: item.key,\n };\n });\n if (tables?.data) {\n // default expand first node\n setExpandedKeys([tables?.data.key]);\n return loop([tables?.data]);\n }\n return [];\n }, [searchValue, tables]);\n\n const dataList = React.useMemo(() => {\n let res: { key: string | number; title: string; parentKey?: string | number }[] = [];\n const generateList = (data: DataNode[], parentKey?: string | number) => {\n if (!data || data?.length <= 0) return;\n for (let i = 0; i < data.length; i++) {\n const node = data[i];\n const { key, title } = node;\n res.push({ key, title: title as string, parentKey });\n if (node.children) {\n generateList(node.children, key);\n }\n }\n };\n if (treeData) {\n generateList(treeData);\n }\n return res;\n }, [treeData]);\n\n const getParentKey = (key: React.Key, tree: DataNode[]): React.Key => {\n let parentKey: React.Key;\n for (let i = 0; i < tree.length; i++) {\n const node = tree[i];\n if (node.children) {\n if (node.children.some((item) => item.key === key)) {\n parentKey = node.key;\n } else if (getParentKey(key, node.children)) {\n parentKey = getParentKey(key, node.children);\n }\n }\n }\n return parentKey!;\n };\n\n const onChange = (e: React.ChangeEvent) => {\n const { value } = e.target;\n if (tables?.data) {\n if (!value) {\n setExpandedKeys([]);\n } else {\n const newExpandedKeys = dataList\n .map((item) => {\n if (item.title.indexOf(value) > -1) {\n return getParentKey(item.key, treeData);\n }\n return null;\n })\n .filter((item, i, self) => item && self.indexOf(item) === i);\n setExpandedKeys(newExpandedKeys as React.Key[]);\n }\n setSearchValue(value);\n setAutoExpandParent(true);\n }\n };\n\n React.useEffect(() => {\n if (currentRound) {\n handleGetEditorSql(currentRound);\n }\n }, [handleGetEditorSql, currentRound]);\n\n React.useEffect(() => {\n if (editorValue && scene === 'chat_dashboard' && currentTabIndex) {\n runCharts();\n }\n }, [currentTabIndex, scene, editorValue, runCharts]);\n\n React.useEffect(() => {\n if (editorValue && scene !== 'chat_dashboard') {\n runSql();\n }\n }, [scene, editorValue, runSql]);\n\n function resolveSqlAndThoughts(value: string | undefined) {\n if (!value) {\n return { sql: '', thoughts: '' };\n }\n const match = value && value.match(/(--.*)\\n([\\s\\S]*)/);\n let thoughts = '';\n let sql;\n if (match && match.length >= 3) {\n thoughts = match[1];\n sql = match[2];\n }\n return { sql, thoughts };\n }\n\n return (\n
    \n
    \n
    \n \n
    \n {\n if (scene === 'chat_dashboard') {\n runCharts();\n } else {\n runSql();\n }\n }}\n >\n Run\n \n {\n if (scene === 'chat_dashboard') {\n await submitChart();\n } else {\n await submitSql();\n }\n }}\n >\n Save\n \n
    \n
    \n {\n setCurrentRound(newValue);\n }}\n >\n {rounds?.data?.map((item: RoundProps) => (\n \n ))}\n \n \n
    \n \n {treeData && treeData.length > 0 && (\n {\n setExpandedKeys(newExpandedKeys);\n setAutoExpandParent(false);\n }}\n expandedKeys={expandedKeys}\n autoExpandParent={autoExpandParent}\n treeData={treeData}\n fieldNames={{\n title: 'showTitle',\n }}\n />\n )}\n
    \n
    \n {Array.isArray(editorValue) ? (\n <>\n .ant-tabs-nav .ant-tabs-tab, & .ant-tabs-card.ant-tabs-top >div>.ant-tabs-nav .ant-tabs-tab': {\n borderRadius: '0',\n },\n }}\n >\n {\n setCurrentTabIndex(activeKey);\n setNewEditorValue(editorValue?.[Number(activeKey)]);\n }}\n items={editorValue?.map((item, i) => ({\n key: i + '',\n label: item?.title,\n children: (\n
    \n {\n const { sql, thoughts } = resolveSqlAndThoughts(value);\n setNewEditorValue((old) => {\n return Object.assign({}, old, {\n sql,\n thoughts,\n });\n });\n }}\n tableData={tableData}\n chartData={chartData}\n />\n
    \n ),\n }))}\n />\n \n \n ) : (\n {\n const { sql, thoughts } = resolveSqlAndThoughts(value);\n setNewEditorValue((old) => {\n return Object.assign({}, old, {\n sql,\n thoughts,\n });\n });\n }}\n tableData={tableData}\n chartData={undefined}\n />\n )}\n
    \n
    \n \n );\n}\n\nexport default DbEditor;\n" }, { "path": "components/chat/doc-list.tsx", "content": "import { IDocument } from '@/types/knowledge';\nimport { Button, Tooltip } from 'antd';\nimport { useRouter } from 'next/router';\nimport React from 'react';\nimport FileStatusIcon from '../common/FileStatusIcon';\n\ninterface IProps {\n documents: IDocument[];\n dbParam?: string;\n}\n\nexport default function DocList(props: IProps) {\n const { documents, dbParam } = props;\n const router = useRouter();\n\n const handleClick = (id: number) => {\n router.push(`/knowledge/chunk/?spaceName=${dbParam}&id=${id}`);\n };\n\n if (!documents?.length) return null;\n\n return (\n
    \n {documents.map((doc) => {\n let color;\n switch (doc.status) {\n case 'RUNNING':\n color = '#2db7f5';\n break;\n case 'FINISHED':\n color = '#87d068';\n break;\n case 'FAILED':\n color = '#f50';\n break;\n default:\n color = '#87d068';\n break;\n }\n return (\n \n {\n handleClick(doc.id);\n }}\n className=\"shrink flex items-center mr-3\"\n >\n \n {doc.doc_name}\n \n \n );\n })}\n
    \n );\n}\n" }, { "path": "components/chat/doc-upload.tsx", "content": "import { ChatContext } from '@/app/chat-context';\nimport { apiInterceptors, uploadDocument } from '@/client/api';\n\nimport useSummary from '@/hooks/use-summary';\nimport { PaperClipOutlined } from '@ant-design/icons';\nimport { Button, Upload } from 'antd';\nimport React, { useContext, useState } from 'react';\n\ninterface IProps {\n className?: string;\n handleFinish?: (data: boolean) => void;\n onUploadFinish: () => void;\n}\nexport default function DocUpload(props: IProps) {\n const { dbParam, setDocId } = useContext(ChatContext);\n const { onUploadFinish, handleFinish } = props;\n const summary = useSummary();\n const [loading, setLoading] = useState(false);\n\n const handleUpload = async (data: any) => {\n setLoading(true);\n const formData = new FormData();\n formData.append('doc_name', data.file.name);\n formData.append('doc_file', data.file);\n formData.append('doc_type', 'DOCUMENT');\n\n const res = await apiInterceptors(uploadDocument(dbParam || 'default', formData));\n\n if (!res[1]) {\n setLoading(false);\n return;\n }\n setDocId(res[1]);\n onUploadFinish();\n setLoading(false);\n handleFinish?.(true);\n await summary(res[1]);\n handleFinish?.(false);\n };\n\n return (\n \n \n \n );\n}\n" }, { "path": "components/chat/header/agent-selector.tsx", "content": "import { ChatContext } from '@/app/chat-context';\nimport { apiInterceptors, getDbgptsList } from '@/client/api';\nimport { useRequest } from 'ahooks';\nimport { Select } from 'antd';\nimport { useContext } from 'react';\nimport { useTranslation } from 'react-i18next';\n\nfunction AgentSelector() {\n const { t } = useTranslation();\n const { agent, setAgent } = useContext(ChatContext);\n\n const { data = [] } = useRequest(async () => {\n const [, res] = await apiInterceptors(getDbgptsList());\n return res ?? [];\n });\n\n return (\n ({ label: item.app_name, value: item.app_code }))}\n allowClear\n onChange={(val) => {\n setAgent?.(val);\n }}\n />\n );\n}\n\nexport default AgentSelector;\n" }, { "path": "components/chat/header/chat-excel.tsx", "content": "import ExcelUpload from './excel-upload';\nimport { LinkOutlined } from '@ant-design/icons';\nimport { useContext } from 'react';\nimport { ChatContext } from '@/app/chat-context';\n\ninterface Props {\n onComplete?: () => void;\n}\n\nfunction ChatExcel({ onComplete }: Props) {\n const { currentDialogue, scene, chatId } = useContext(ChatContext);\n\n if (scene !== 'chat_excel') return null;\n\n return (\n
    \n {currentDialogue ? (\n
    \n
    \n \n
    \n
    \n {currentDialogue.select_param}\n
    \n
    \n ) : (\n \n )}\n
    \n );\n}\n\nexport default ChatExcel;\n" }, { "path": "components/chat/header/db-selector.tsx", "content": "import { ChatContext } from '@/app/chat-context';\nimport { apiInterceptors, postChatModeParamsList } from '@/client/api';\nimport { IDB } from '@/types/chat';\nimport { dbMapper } from '@/utils';\nimport { useAsyncEffect } from 'ahooks';\nimport { Select } from 'antd';\nimport { useContext, useEffect, useMemo, useState } from 'react';\nimport DBIcon from '@/components/common/db-icon';\n\nfunction DBSelector() {\n const { scene, dbParam, setDbParam } = useContext(ChatContext);\n\n const [dbs, setDbs] = useState([]);\n\n useAsyncEffect(async () => {\n const [, res] = await apiInterceptors(postChatModeParamsList(scene as string));\n setDbs(res ?? []);\n }, [scene]);\n\n const dbOpts = useMemo(\n () =>\n dbs.map?.((db: IDB) => {\n return { name: db.param, ...dbMapper[db.type] };\n }),\n [dbs],\n );\n\n useEffect(() => {\n if (dbOpts?.length && !dbParam) {\n setDbParam(dbOpts[0].name);\n }\n }, [dbOpts, setDbParam, dbParam]);\n\n if (!dbOpts?.length) return null;\n\n return (\n {\n setDbParam(val);\n }}\n >\n {dbOpts.map((item) => (\n \n \n {item.name}\n \n ))}\n \n );\n}\n\nexport default DBSelector;\n" }, { "path": "components/chat/header/excel-upload.tsx", "content": "import { PropsWithChildren, useContext, useState } from 'react';\nimport { Upload, UploadProps, Button, message, UploadFile, Tooltip } from 'antd';\nimport { LinkOutlined, SelectOutlined, UploadOutlined } from '@ant-design/icons';\nimport { apiInterceptors, postChatModeParamsFileLoad } from '@/client/api';\nimport { ChatContext } from '@/app/chat-context';\n\ninterface Props {\n convUid: string;\n chatMode: string;\n onComplete?: () => void;\n}\n\nfunction ExcelUpload({ convUid, chatMode, onComplete, ...props }: PropsWithChildren) {\n const [loading, setLoading] = useState(false);\n const [messageApi, contextHolder] = message.useMessage();\n const [fileList, setFileList] = useState([]);\n const [percent, setPercent] = useState();\n const { model } = useContext(ChatContext);\n\n const onChange: UploadProps['onChange'] = async (info) => {\n if (!info) {\n message.error('Please select the *.(csv|xlsx|xls) file');\n return;\n }\n if (!/\\.(csv|xlsx|xls)$/.test(info.file.name ?? '')) {\n message.error('File type must be csv, xlsx or xls');\n return;\n }\n\n setFileList([info.file]);\n };\n\n const onUpload = async () => {\n setLoading(true);\n try {\n const formData = new FormData();\n formData.append('doc_file', fileList[0] as any);\n messageApi.open({ content: `Uploading ${fileList[0].name}`, type: 'loading', duration: 0 });\n const [err] = await apiInterceptors(\n postChatModeParamsFileLoad({\n convUid,\n chatMode,\n data: formData,\n model,\n config: {\n /** timeout 1h */\n timeout: 1000 * 60 * 60,\n onUploadProgress: (progressEvent) => {\n const progress = Math.ceil((progressEvent.loaded / (progressEvent.total || 0)) * 100);\n setPercent(progress);\n },\n },\n }),\n );\n if (err) return;\n message.success('success');\n onComplete?.();\n } catch (e: any) {\n message.error(e?.message || 'Upload Error');\n } finally {\n setLoading(false);\n messageApi.destroy();\n }\n };\n\n return (\n <>\n
    \n {contextHolder}\n \n false}\n fileList={fileList}\n name=\"file\"\n accept=\".csv,.xlsx,.xls\"\n multiple={false}\n onChange={onChange}\n showUploadList={{\n showDownloadIcon: false,\n showPreviewIcon: false,\n showRemoveIcon: false,\n }}\n itemRender={() => <>}\n {...props}\n >\n \n \n \n }\n onClick={onUpload}\n >\n {loading ? (percent === 100 ? 'Analysis' : 'Uploading') : 'Upload'}\n \n {!!fileList.length && (\n
    \n \n {fileList[0]?.name}\n
    \n )}\n
    \n \n );\n}\n\nexport default ExcelUpload;\n" }, { "path": "components/chat/header/index.tsx", "content": "import { useContext } from 'react';\nimport ChatExcel from './chat-excel';\nimport { ChatContext } from '@/app/chat-context';\nimport ModeTab from '@/components/chat/mode-tab';\nimport ModelSelector from '@/components/chat/header/model-selector';\nimport DBSelector from './db-selector';\nimport AgentSelector from './agent-selector';\n\n/**\n * chat header\n */\ninterface Props {\n refreshHistory?: () => Promise;\n modelChange?: (val: string) => void;\n}\n\nfunction Header({ refreshHistory, modelChange }: Props) {\n const { scene, refreshDialogList } = useContext(ChatContext);\n\n return (\n
    \n {/* Models Selector */}\n \n {/* DB Selector */}\n \n {/* Excel Upload */}\n {scene === 'chat_excel' && (\n {\n refreshDialogList?.();\n refreshHistory?.();\n }}\n />\n )}\n {/* Agent Selector */}\n {scene === 'chat_agent' && }\n \n
    \n );\n}\n\nexport default Header;\n" }, { "path": "components/chat/header/model-selector.tsx", "content": "/**\n * multi-models selector\n */\n\nimport { ChatContext } from '@/app/chat-context';\nimport { Select } from 'antd';\nimport { MODEL_ICON_MAP } from '@/utils/constants';\nimport Image from 'next/image';\nimport { useContext } from 'react';\nimport { useTranslation } from 'react-i18next';\n\ninterface Props {\n onChange?: (model: string) => void;\n}\n\nconst DEFAULT_ICON_URL = '/models/huggingface.svg';\n\nexport function renderModelIcon(model?: string, props?: { width: number; height: number }) {\n const { width, height } = props || {};\n\n if (!model) return null;\n\n return (\n \n );\n}\n\nfunction ModelSelector({ onChange }: Props) {\n const { t } = useTranslation();\n const { modelList, model } = useContext(ChatContext);\n if (!modelList || modelList.length <= 0) {\n return null;\n }\n return (\n {\n onChange?.(val);\n }}\n >\n {modelList.map((item) => (\n \n
    \n {renderModelIcon(item)}\n {MODEL_ICON_MAP[item]?.label || item}\n
    \n     \n ))}\n \n );\n}\n\nexport default ModelSelector;\n" }, { "path": "components/chat/mode-tab/index.css", "content": ".model-tab::before {\n content: \"\";\n position: absolute;\n left: 0.4rem;\n width: 45%;\n height: 80%;\n background-color: #ffc800;\n border-radius: 2rem;\n transition: all .4s;\n}\n.editor-tab::before {\n left: calc(50%);\n}" }, { "path": "components/chat/mode-tab/index.tsx", "content": "import './index.css';\nimport { useContext } from 'react';\nimport { ChatContext } from '@/app/chat-context';\nimport { Radio } from 'antd';\nimport Icon, { AppstoreFilled } from '@ant-design/icons';\nimport { StarsSvg } from '@/components/icons';\n\nexport default function ModeTab() {\n const { isContract, setIsContract, scene } = useContext(ChatContext);\n const isShow = scene && ['chat_with_db_execute', 'chat_dashboard'].includes(scene as string);\n\n if (!isShow) {\n return null;\n }\n\n return (\n {\n setIsContract(!isContract);\n }}\n >\n \n \n Preview\n \n \n \n Editor\n \n \n );\n}\n" }, { "path": "components/chat/monaco-editor.tsx", "content": "import * as monaco from 'monaco-editor/esm/vs/editor/editor.api.js';\nimport Editor, { OnChange, loader } from '@monaco-editor/react';\nimport classNames from 'classnames';\nimport { useMemo } from 'react';\nimport { format } from 'sql-formatter';\n\nloader.config({ monaco });\n\ninterface MonacoEditorProps {\n className?: string;\n value: string;\n language: string;\n onChange?: OnChange;\n thoughts?: string;\n}\n\nexport default function MonacoEditor({ className, value, language = 'mysql', onChange, thoughts }: MonacoEditorProps) {\n // merge value and thoughts\n const editorValue = useMemo(() => {\n if (language !== 'mysql') {\n return value;\n }\n if (thoughts && thoughts.length > 0) {\n return format(`-- ${thoughts} \\n${value}`);\n }\n return format(value);\n }, [value, thoughts]);\n\n return (\n \n );\n}\n" }, { "path": "components/common/FileStatusIcon.tsx", "content": "import { IDocument } from '@/types/knowledge';\nimport React from 'react';\nimport { FileDone, FileSync } from '../icons';\nimport FileError from '../icons/file-error';\n\ninterface IProps {\n document: IDocument;\n}\n\nexport default function FileStatusIcon({ document }: IProps) {\n switch (document.status) {\n case 'RUNNING':\n return ;\n case 'FINISHED':\n return ;\n case 'FAILED':\n return ;\n default:\n return ;\n }\n}\n" }, { "path": "components/common/MyEmpty.tsx", "content": "import { Button, Empty } from 'antd';\nimport { useTranslation } from 'react-i18next';\n\ninterface Props {\n error?: boolean;\n description?: string;\n refresh?: () => void;\n}\n\nfunction MyEmpty({ error, description, refresh }: Props) {\n const { t } = useTranslation();\n\n return (\n \n {t('try_again')}\n \n ) : (\n description ?? t('no_data')\n )\n }\n />\n );\n}\n\nexport default MyEmpty;\n" }, { "path": "components/common/chat-dialog.tsx", "content": "import useChat from '@/hooks/use-chat';\nimport CompletionInput from './completion-input';\nimport { useCallback, useState } from 'react';\nimport { IChatDialogueMessageSchema, IChatDialogueSchema } from '@/types/chat';\nimport AgentContent from '../chat/agent-content';\nimport { renderModelIcon } from '../chat/header/model-selector';\nimport MyEmpty from './MyEmpty';\nimport { CaretLeftOutlined } from '@ant-design/icons';\nimport classNames from 'classnames';\nimport { useRequest } from 'ahooks';\nimport { apiInterceptors, newDialogue } from '@/client/api';\nimport ChatContent from '../chat/chat-content';\n\ninterface Props {\n title?: string;\n completionApi?: string;\n chatMode: IChatDialogueSchema['chat_mode'];\n chatParams?: {\n select_param?: string;\n } & Record;\n model?: string;\n}\n\nfunction ChatDialog({ title, chatMode, completionApi, chatParams, model = '' }: Props) {\n const chat = useChat({ queryAgentURL: completionApi });\n\n const [loading, setLoading] = useState(false);\n const [list, setList] = useState([]);\n const [open, setOpen] = useState(false);\n\n const { data } = useRequest(\n async () => {\n const [, res] = await apiInterceptors(newDialogue({ chat_mode: chatMode }));\n return res;\n },\n {\n ready: !!chatMode,\n },\n );\n\n const handleChat = useCallback(\n (content: string) => {\n if (!data) return;\n return new Promise((resolve) => {\n const tempList: IChatDialogueMessageSchema[] = [\n ...list,\n { role: 'human', context: content, model_name: model, order: 0, time_stamp: 0 },\n { role: 'view', context: '', model_name: model, order: 0, time_stamp: 0 },\n ];\n const index = tempList.length - 1;\n setList([...tempList]);\n setLoading(true);\n chat({\n chatId: data?.conv_uid,\n data: { ...chatParams, chat_mode: chatMode, model_name: model, user_input: content },\n onMessage: (message) => {\n tempList[index].context = message;\n setList([...tempList]);\n },\n onDone: () => {\n resolve();\n },\n onClose: () => {\n resolve();\n },\n onError: (message) => {\n tempList[index].context = message;\n setList([...tempList]);\n resolve();\n },\n }).finally(() => {\n setLoading(false);\n });\n });\n },\n [chat, list, data?.conv_uid],\n );\n\n return (\n \n {title &&
    {title}
    }\n
    \n {list.map((item, index) => (\n <>{chatParams?.chat_mode === 'chat_agent' ? : }\n ))}\n {!list.length && }\n
    \n
    \n {model &&
    {renderModelIcon(model)}
    }\n \n
    \n {\n setOpen(!open);\n }}\n >\n \n \n \n );\n}\n\nexport default ChatDialog;\n" }, { "path": "components/common/completion-input.tsx", "content": "import { SendOutlined } from '@ant-design/icons';\nimport { Button, Input } from 'antd';\nimport { PropsWithChildren, useContext, useEffect, useMemo, useRef, useState } from 'react';\nimport PromptBot from './prompt-bot';\nimport DocUpload from '../chat/doc-upload';\nimport DocList from '../chat/doc-list';\nimport { IDocument } from '@/types/knowledge';\nimport { ChatContext } from '@/app/chat-context';\nimport { apiInterceptors, getDocumentList } from '@/client/api';\n\ntype TextAreaProps = Omit[0], 'value' | 'onPressEnter' | 'onChange' | 'onSubmit'>;\n\ninterface Props {\n loading?: boolean;\n onSubmit: (val: string) => void;\n handleFinish?: (val: boolean) => void;\n}\n\nfunction CompletionInput({ children, loading, onSubmit, handleFinish, ...props }: PropsWithChildren) {\n const { dbParam, scene } = useContext(ChatContext);\n\n const [userInput, setUserInput] = useState('');\n const showUpload = useMemo(() => scene === 'chat_knowledge', [scene]);\n const [documents, setDocuments] = useState([]);\n const uploadCountRef = useRef(0);\n\n useEffect(() => {\n showUpload && fetchDocuments();\n }, [dbParam]);\n\n async function fetchDocuments() {\n if (!dbParam) {\n return null;\n }\n const [_, data] = await apiInterceptors(\n getDocumentList(dbParam, {\n page: 1,\n page_size: uploadCountRef.current,\n }),\n );\n setDocuments(data?.data!);\n }\n\n const onUploadFinish = async () => {\n uploadCountRef.current += 1;\n await fetchDocuments();\n };\n\n return (\n
    \n \n {showUpload && }\n {\n if (!userInput.trim()) return;\n if (e.keyCode === 13) {\n if (e.shiftKey) {\n setUserInput((state) => state + '\\n');\n return;\n }\n onSubmit(userInput);\n setTimeout(() => {\n setUserInput('');\n }, 0);\n }\n }}\n onChange={(e) => {\n if (typeof props.maxLength === 'number') {\n setUserInput(e.target.value.substring(0, props.maxLength));\n return;\n }\n setUserInput(e.target.value);\n }}\n />\n }\n onClick={() => {\n onSubmit(userInput);\n }}\n />\n {\n setUserInput(userInput + prompt);\n }}\n />\n {children}\n
    \n );\n}\n\nexport default CompletionInput;\n" }, { "path": "components/common/db-icon.tsx", "content": "import Image from 'next/image';\n\ninterface IProps {\n width?: number;\n height?: number;\n src: string;\n label: string;\n className?: string;\n}\n\nfunction DBIcon({ src, label, width, height, className }: IProps) {\n return (\n \n );\n}\n\nexport default DBIcon;\n" }, { "path": "components/common/gpt-card.tsx", "content": "import React, { HtmlHTMLAttributes, PropsWithChildren, ReactNode, memo, useCallback, useMemo } from 'react';\nimport { Tag, TagProps, Tooltip } from 'antd';\nimport classNames from 'classnames';\nimport Image from 'next/image';\n\ninterface Props {\n title: string;\n desc?: string;\n disabled?: boolean;\n tags?: (\n | string\n | {\n text: ReactNode;\n /** @default false */\n border?: boolean;\n /** @default default */\n color?: TagProps['color'];\n }\n )[];\n operations?: {\n children: ReactNode;\n label?: string;\n onClick?: () => void;\n }[];\n icon?: ReactNode;\n iconBorder?: boolean;\n onClick?: () => void;\n}\n\nfunction GPTCard({\n icon,\n iconBorder = true,\n title,\n desc,\n tags,\n children,\n disabled,\n operations,\n className,\n ...props\n}: PropsWithChildren & Props>) {\n const iconNode = useMemo(() => {\n if (!icon) return null;\n\n if (typeof icon === 'string') {\n return (\n \n );\n }\n\n return icon;\n }, [icon]);\n\n const tagNode = useMemo(() => {\n if (!tags || !tags.length) return null;\n return (\n
    \n {tags.map((tag, index) => {\n if (typeof tag === 'string') {\n return (\n \n {tag}\n \n );\n }\n return (\n \n {tag.text}\n \n );\n })}\n
    \n );\n }, [tags]);\n\n return (\n \n
    \n
    \n {iconNode}\n
    \n

    {title}

    \n {tagNode}\n
    \n
    \n {desc && (\n \n

    {desc}

    \n     \n )}\n
    \n
    \n {children}\n {operations && !!operations.length && (\n
    \n {operations.map((item, index) => (\n \n {\n e.stopPropagation();\n item.onClick?.();\n }}\n >\n {item.children}\n {index < operations.length - 1 &&
    }\n
    \n     \n ))}\n
    \n )}\n
    \n \n );\n}\n\nexport default memo(GPTCard);\n" }, { "path": "components/common/icon-wrapper.tsx", "content": "import classNames from 'classnames';\nimport React from 'react';\n\ninterface IconWrapperProps {\n children: React.ReactNode;\n className?: string;\n}\n\n// Icon wrapper, with background color and hover color. same width and height\nconst IconWrapper: React.FC = ({ children, className }) => {\n return (\n \n {children}\n \n );\n};\n\nexport default IconWrapper;\n" }, { "path": "components/common/loading.tsx", "content": "import { LoadingOutlined } from '@ant-design/icons';\n\nfunction MuiLoading({ visible }: { visible: boolean }) {\n if (!visible) return null;\n\n return (\n
    \n \n
    \n );\n}\n\nexport default MuiLoading;\n" }, { "path": "components/common/prompt-bot.tsx", "content": "import { useState } from 'react';\nimport { List, FloatButton, Popover, Tooltip, Form, message, Select, ConfigProvider } from 'antd';\nimport { useRequest } from 'ahooks';\nimport { sendSpacePostRequest } from '@/utils/request';\nimport { useTranslation } from 'react-i18next';\n\ntype SelectTableProps = {\n data: any;\n loading: boolean;\n submit: (prompt: string) => void;\n close: () => void;\n};\n\nconst SelectTable: React.FC = ({ data, loading, submit, close }) => {\n const { t } = useTranslation();\n const handleClick = (content: string) => () => {\n submit(content);\n close();\n };\n\n return (\n \n record.prompt_name}\n renderItem={(item) => (\n \n \n \n \n \n )}\n />\n \n );\n};\n\ntype PromptBotProps = {\n submit: (prompt: string) => void;\n};\n\nconst PromptBot: React.FC = ({ submit }) => {\n const { t } = useTranslation();\n const [open, setOpen] = useState(false);\n const [current, setCurrent] = useState('common');\n\n const { data, loading } = useRequest(\n () => {\n const body = {\n prompt_type: current,\n };\n return sendSpacePostRequest('/prompt/list', body);\n },\n {\n refreshDeps: [current],\n onError: (err) => {\n message.error(err?.message);\n },\n },\n );\n\n const close = () => {\n setOpen(false);\n };\n\n const handleOpenChange = (newOpen: boolean) => {\n setOpen(newOpen);\n };\n\n const handleChange = (value: string) => {\n setCurrent(value);\n };\n\n return (\n \n \n \n \n }\n content={}\n placement=\"topRight\"\n trigger=\"click\"\n open={open}\n onOpenChange={handleOpenChange}\n >\n \n \n \n \n \n );\n};\n\nexport default PromptBot;\n" }, { "path": "components/database/form-dialog.tsx", "content": "/* eslint-disable react-hooks/exhaustive-deps */\nimport { Button, Form, Input, InputNumber, Modal, Select, message } from 'antd';\nimport { useEffect, useMemo, useState } from 'react';\nimport { apiInterceptors, postDbAdd, postDbEdit, postDbTestConnect } from '@/client/api';\nimport { DBOption, DBType, DbListResponse, PostDbParams } from '@/types/db';\nimport { isFileDb } from '@/pages/database';\nimport { useTranslation } from 'react-i18next';\n\ntype DBItem = DbListResponse[0];\n\ninterface Props {\n dbTypeList: DBOption[];\n open: boolean;\n choiceDBType?: DBType;\n editValue?: DBItem;\n dbNames: string[];\n onSuccess?: () => void;\n onClose?: () => void;\n}\n\nfunction FormDialog({ open, choiceDBType, dbTypeList, editValue, dbNames, onClose, onSuccess }: Props) {\n const [loading, setLoading] = useState(false);\n const { t } = useTranslation();\n const [form] = Form.useForm();\n const dbType = Form.useWatch('db_type', form);\n\n const fileDb = useMemo(() => isFileDb(dbTypeList, dbType), [dbTypeList, dbType]);\n\n useEffect(() => {\n if (choiceDBType) {\n form.setFieldValue('db_type', choiceDBType);\n }\n }, [choiceDBType]);\n\n useEffect(() => {\n if (editValue) {\n form.setFieldsValue({ ...editValue });\n }\n }, [editValue]);\n\n useEffect(() => {\n if (!open) {\n form.resetFields();\n }\n }, [open]);\n\n const onFinish = async (val: DBItem) => {\n const { db_host, db_path, db_port, ...params } = val;\n if (!editValue && dbNames.some((item) => item === params.db_name)) {\n message.error('The database already exists!');\n return;\n }\n const data: PostDbParams = {\n db_host: fileDb ? undefined : db_host,\n db_port: fileDb ? undefined : db_port,\n file_path: fileDb ? db_path : undefined,\n ...params,\n };\n setLoading(true);\n try {\n const [testErr] = await apiInterceptors(postDbTestConnect(data));\n if (testErr) return;\n const [err] = await apiInterceptors((editValue ? postDbEdit : postDbAdd)(data));\n if (err) {\n message.error(err.message);\n return;\n }\n message.success('success');\n onSuccess?.();\n } catch (e: any) {\n message.error(e.message);\n } finally {\n setLoading(false);\n }\n };\n\n const lockDBType = useMemo(() => !!editValue || !!choiceDBType, [editValue, choiceDBType]);\n\n return (\n \n
    \n \n \n \n {fileDb === true && (\n \n \n \n )}\n {fileDb === false && (\n <>\n \n \n \n \n \n \n \n \n \n \n \n \n \n )}\n\n \n \n \n \n \n \n \n
    \n     \n );\n}\n\nexport default FormDialog;\n" }, { "path": "components/flow/add-nodes.tsx", "content": "import { apiInterceptors, getFlowNodes } from '@/client/api';\nimport { IFlowNode } from '@/types/flow';\nimport { PlusOutlined } from '@ant-design/icons';\nimport { Badge, Button, Collapse, CollapseProps, Input, Popover } from 'antd';\nimport React, { useEffect, useMemo, useState } from 'react';\nimport { useTranslation } from 'react-i18next';\nimport { FLOW_NODES_KEY } from '@/utils';\nimport StaticNodes from './static-nodes';\n\nconst { Search } = Input;\n\ntype GroupType = { category: string; categoryLabel: string; nodes: IFlowNode[] };\n\nconst AddNodes: React.FC = () => {\n const { t } = useTranslation();\n const [operators, setOperators] = useState>([]);\n const [resources, setResources] = useState>([]);\n const [operatorsGroup, setOperatorsGroup] = useState([]);\n const [resourcesGroup, setResourcesGroup] = useState([]);\n const [searchValue, setSearchValue] = useState('');\n\n useEffect(() => {\n getNodes();\n }, []);\n\n async function getNodes() {\n const [_, data] = await apiInterceptors(getFlowNodes());\n if (data && data.length > 0) {\n localStorage.setItem(FLOW_NODES_KEY, JSON.stringify(data));\n const operatorNodes = data.filter((node) => node.flow_type === 'operator');\n const resourceNodes = data.filter((node) => node.flow_type === 'resource');\n setOperators(operatorNodes);\n setResources(resourceNodes);\n setOperatorsGroup(groupNodes(operatorNodes));\n setResourcesGroup(groupNodes(resourceNodes));\n }\n }\n\n function groupNodes(data: IFlowNode[]) {\n const groups: GroupType[] = [];\n const categoryMap: Record = {};\n data.forEach((item) => {\n const { category, category_label } = item;\n if (!categoryMap[category]) {\n categoryMap[category] = { category, categoryLabel: category_label, nodes: [] };\n groups.push(categoryMap[category]);\n }\n categoryMap[category].nodes.push(item);\n });\n return groups;\n }\n\n const operatorItems: CollapseProps['items'] = useMemo(() => {\n if (!searchValue) {\n return operatorsGroup.map(({ category, categoryLabel, nodes }) => ({\n key: category,\n label: categoryLabel,\n children: ,\n extra: 0 ? '#52c41a' : '#7f9474' }} />,\n }));\n } else {\n const searchedNodes = operators.filter((node) => node.label.toLowerCase().includes(searchValue.toLowerCase()));\n return groupNodes(searchedNodes).map(({ category, categoryLabel, nodes }) => ({\n key: category,\n label: categoryLabel,\n children: ,\n extra: 0 ? '#52c41a' : '#7f9474' }} />,\n }));\n }\n }, [operatorsGroup, searchValue]);\n\n const resourceItems: CollapseProps['items'] = useMemo(() => {\n if (!searchValue) {\n return resourcesGroup.map(({ category, categoryLabel, nodes }) => ({\n key: category,\n label: categoryLabel,\n children: ,\n extra: 0 ? '#52c41a' : '#7f9474' }} />,\n }));\n } else {\n const searchedNodes = resources.filter((node) => node.label.toLowerCase().includes(searchValue.toLowerCase()));\n return groupNodes(searchedNodes).map(({ category, categoryLabel, nodes }) => ({\n key: category,\n label: categoryLabel,\n children: ,\n extra: 0 ? '#52c41a' : '#7f9474' }} />,\n }));\n }\n }, [resourcesGroup, searchValue]);\n\n function searchNode(val: string) {\n setSearchValue(val);\n }\n\n return (\n \n

    {t('add_node')}

    \n \n

    {t('operators')}

    \n \n

    {t('resource')}

    \n \n \n }\n >\n }\n >\n \n );\n};\n\nexport default AddNodes;\n" }, { "path": "components/flow/button-edge.tsx", "content": "import React from 'react';\nimport { getBezierPath, EdgeProps, BaseEdge, useReactFlow } from 'reactflow';\n\nconst ButtonEdge: React.FC = ({ id, sourceX, sourceY, targetX, targetY, sourcePosition, targetPosition, style = {}, data, markerEnd }) => {\n const [edgePath, edgeCenterX, edgeCenterY] = getBezierPath({\n sourceX,\n sourceY,\n sourcePosition,\n targetX,\n targetY,\n targetPosition,\n });\n const reactFlow = useReactFlow();\n\n function onEdgeClick(event: React.MouseEvent, id: string) {\n event.stopPropagation();\n reactFlow.setEdges(reactFlow.getEdges().filter((edge) => edge.id !== id));\n }\n return (\n <>\n \n \n onEdgeClick(event, id)}\n >\n ×\n \n \n \n );\n};\n\nexport default ButtonEdge;\n" }, { "path": "components/flow/canvas-node.tsx", "content": "import { IFlowNode } from '@/types/flow';\nimport Image from 'next/image';\nimport NodeParamHandler from './node-param-handler';\nimport classNames from 'classnames';\nimport { useState } from 'react';\nimport NodeHandler from './node-handler';\nimport { Popover, Tooltip } from 'antd';\nimport { CopyOutlined, DeleteOutlined, InfoCircleOutlined } from '@ant-design/icons';\nimport { useReactFlow } from 'reactflow';\nimport IconWrapper from '../common/icon-wrapper';\nimport { getUniqueNodeId } from '@/utils/flow';\nimport { cloneDeep } from 'lodash';\n\ntype CanvasNodeProps = {\n data: IFlowNode;\n};\n\nconst ICON_PATH_PREFIX = '/icons/node/';\n\nfunction TypeLabel({ label }: { label: string }) {\n return
    {label}
    ;\n}\n\nconst CanvasNode: React.FC = ({ data }) => {\n const node = data;\n const { inputs, outputs, parameters, flow_type: flowType } = node;\n const [isHovered, setIsHovered] = useState(false);\n const reactFlow = useReactFlow();\n\n function onHover() {\n setIsHovered(true);\n }\n\n function onLeave() {\n setIsHovered(false);\n }\n\n function copyNode(e: React.MouseEvent) {\n e.preventDefault();\n e.stopPropagation();\n const nodes = reactFlow.getNodes();\n const originalNode = nodes.find((item) => item.id === node.id);\n if (originalNode) {\n const newNodeId = getUniqueNodeId(originalNode as IFlowNode, nodes);\n const cloneNode = cloneDeep(originalNode);\n const duplicatedNode = {\n ...cloneNode,\n id: newNodeId,\n position: {\n x: cloneNode.position.x + 400,\n y: cloneNode.position.y,\n },\n positionAbsolute: {\n x: cloneNode.positionAbsolute!.x + 400,\n y: cloneNode.positionAbsolute!.y,\n },\n data: {\n ...cloneNode.data,\n id: newNodeId,\n },\n selected: false,\n };\n reactFlow.setNodes((nodes) => [...nodes, duplicatedNode]);\n }\n }\n\n function deleteNode(e: React.MouseEvent) {\n e.preventDefault();\n e.stopPropagation();\n reactFlow.setNodes((nodes) => nodes.filter((item) => item.id !== node.id));\n reactFlow.setEdges((edges) => edges.filter((edge) => edge.source !== node.id && edge.target !== node.id));\n }\n\n function renderOutput(data: IFlowNode) {\n if (flowType === 'operator' && outputs?.length > 0) {\n return (\n <>\n \n {(outputs || []).map((output, index) => (\n \n ))}\n \n );\n } else if (flowType === 'resource') {\n // resource nodes show output default\n return (\n <>\n \n \n \n );\n }\n }\n\n return (\n \n \n \n \n \n \n \n \n \n \n \n \n \n }\n >\n \n {/* icon and label */}\n
    \n \"\"\n

    {node.label}

    \n
    \n {inputs && inputs.length > 0 && (\n <>\n \n {(inputs || []).map((input, index) => (\n \n ))}\n \n )}\n {parameters && parameters.length > 0 && (\n <>\n \n {(parameters || []).map((parameter, index) => (\n \n ))}\n \n )}\n {renderOutput(node)}\n \n \n );\n};\n\nexport default CanvasNode;\n" }, { "path": "components/flow/flow-card.tsx", "content": "import { apiInterceptors, deleteFlowById, newDialogue } from '@/client/api';\nimport { IFlow } from '@/types/flow';\nimport {\n CopyFilled,\n DeleteFilled,\n EditFilled,\n ExclamationCircleFilled,\n ExclamationCircleOutlined,\n MessageFilled,\n WarningOutlined,\n} from '@ant-design/icons';\nimport { Modal, Tooltip } from 'antd';\nimport React, { useContext } from 'react';\nimport { useTranslation } from 'react-i18next';\nimport FlowPreview from './preview-flow';\nimport { useRouter } from 'next/router';\nimport GptCard from '../common/gpt-card';\nimport { ChatContext } from '@/app/chat-context';\nimport qs from 'querystring';\n\ninterface FlowCardProps {\n flow: IFlow;\n deleteCallback: (uid: string) => void;\n onCopy: (flow: IFlow) => void;\n}\n\nconst FlowCard: React.FC = ({ flow, onCopy, deleteCallback }) => {\n const { model } = useContext(ChatContext);\n const { t } = useTranslation();\n const [modal, contextHolder] = Modal.useModal();\n const router = useRouter();\n\n async function deleteFlow() {\n const [, , res] = await apiInterceptors(deleteFlowById(flow.uid));\n if (res?.success) {\n deleteCallback && deleteCallback(flow.uid);\n }\n }\n\n function cardClick() {\n router.push('/flow/canvas?id=' + flow.uid);\n }\n\n const handleChat = async () => {\n const [, res] = await apiInterceptors(newDialogue({ chat_mode: 'chat_agent' }));\n if (res) {\n const queryStr = qs.stringify({\n scene: 'chat_flow',\n id: res.conv_uid,\n model: model,\n select_param: flow.uid,\n });\n router.push(`/chat?${queryStr}`);\n }\n };\n\n const handleDel = () => {\n modal.confirm({\n title: t('Tips'),\n icon: ,\n content: t('delete_flow_confirm'),\n okText: 'Yes',\n okType: 'danger',\n cancelText: 'No',\n async onOk() {\n deleteFlow();\n },\n });\n };\n\n return (\n <>\n {contextHolder}\n \n {flow.error_message ? (\n \n {flow.state}\n \n \n ) : (\n flow.state\n )}\n \n ),\n color: flow.state === 'load_failed' ? 'red' : flow.state === 'running' ? 'green' : 'blue',\n border: true,\n },\n ]}\n operations={[\n {\n label: t('Chat'),\n children: ,\n onClick: handleChat,\n },\n {\n label: t('Edit'),\n children: ,\n onClick: cardClick,\n },\n {\n label: t('Copy'),\n children: ,\n onClick: () => {\n onCopy(flow);\n },\n },\n {\n label: t('Delete'),\n children: ,\n onClick: handleDel,\n },\n ]}\n >\n
    \n \n
    \n \n \n );\n};\n\nexport default FlowCard;\n" }, { "path": "components/flow/node-handler.tsx", "content": "import { Popconfirm, Tooltip, Typography, message } from 'antd';\nimport React from 'react';\nimport { Connection, Handle, Position, useReactFlow } from 'reactflow';\nimport RequiredIcon from './required-icon';\nimport { InfoCircleOutlined, PlusOutlined } from '@ant-design/icons';\nimport { IFlowNode, IFlowNodeInput, IFlowNodeOutput, IFlowNodeParameter } from '@/types/flow';\nimport { useTranslation } from 'react-i18next';\nimport classNames from 'classnames';\nimport { FLOW_NODES_KEY } from '@/utils';\nimport StaticNodes from './static-nodes';\n\ninterface NodeHandlerProps {\n node: IFlowNode;\n data: IFlowNodeInput | IFlowNodeParameter | IFlowNodeOutput;\n type: 'source' | 'target';\n label: 'inputs' | 'outputs' | 'parameters';\n index: number;\n}\n\n// render react flow handle item\nconst NodeHandler: React.FC = ({ node, data, type, label, index }) => {\n const { t } = useTranslation();\n const reactflow = useReactFlow();\n const [relatedNodes, setRelatedNodes] = React.useState([]);\n\n function isValidConnection(connection: Connection) {\n const { sourceHandle, targetHandle, source, target } = connection;\n const sourceNode = reactflow.getNode(source!);\n const targetNode = reactflow.getNode(target!);\n const { flow_type: sourceFlowType } = sourceNode?.data;\n const { flow_type: targetFlowType } = targetNode?.data;\n const sourceLabel = sourceHandle?.split('|')[1];\n const targetLabel = targetHandle?.split('|')[1];\n const sourceIndex = sourceHandle?.split('|')[2];\n const targetIndex = targetHandle?.split('|')[2];\n const targetTypeCls = targetNode?.data[targetLabel!][targetIndex!].type_cls;\n if (sourceFlowType === targetFlowType && sourceFlowType === 'operator') {\n // operator to operator, only type_cls and is_list matched can be connected\n const sourceTypeCls = sourceNode?.data[sourceLabel!][sourceIndex!].type_cls;\n const sourceIsList = sourceNode?.data[sourceLabel!][sourceIndex!].is_list;\n const targetIsList = targetNode?.data[targetLabel!][targetIndex!].is_list;\n return sourceTypeCls === targetTypeCls && sourceIsList === targetIsList;\n } else if (sourceFlowType === 'resource' && (targetFlowType === 'operator' || targetFlowType === 'resource')) {\n // resource to operator, check operator type_cls and resource parent_cls\n const sourceParentCls = sourceNode?.data.parent_cls;\n return sourceParentCls.includes(targetTypeCls);\n }\n message.warning(t('connect_warning'));\n return false;\n }\n\n function showRelatedNodes() {\n // find all nodes that can be connected to this node\n const cache = localStorage.getItem(FLOW_NODES_KEY);\n if (!cache) {\n return;\n }\n const staticNodes = JSON.parse(cache);\n const typeCls = data.type_cls;\n let nodes: IFlowNode[] = [];\n if (label === 'inputs') {\n // find other operators and outputs matching this input type_cls\n nodes = staticNodes\n .filter((node: IFlowNode) => node.flow_type === 'operator')\n .filter((node: IFlowNode) =>\n node.outputs?.some((output: IFlowNodeOutput) => output.type_cls === typeCls && output.is_list === data?.is_list),\n );\n } else if (label === 'parameters') {\n // fint other resources and parent_cls including this parameter type_cls\n nodes = staticNodes.filter((node: IFlowNode) => node.flow_type === 'resource').filter((node: IFlowNode) => node.parent_cls?.includes(typeCls));\n } else if (label === 'outputs') {\n if (node.flow_type === 'operator') {\n // find other operators and inputs matching this output type_cls\n nodes = staticNodes\n .filter((node: IFlowNode) => node.flow_type === 'operator')\n .filter((node: IFlowNode) => node.inputs?.some((input: IFlowNodeInput) => input.type_cls === typeCls && input.is_list === data?.is_list));\n } else if (node.flow_type === 'resource') {\n // find other resources or operators that this output parent_cls includes their type_cls\n nodes = staticNodes.filter(\n (item: IFlowNode) =>\n item.inputs?.some((input: IFlowNodeInput) => node.parent_cls?.includes(input.type_cls)) ||\n item.parameters?.some((parameter: IFlowNodeParameter) => node.parent_cls?.includes(parameter.type_cls)),\n );\n }\n }\n setRelatedNodes(nodes);\n }\n\n return (\n \n isValidConnection(connection)}\n />\n \n \n \n \n }\n >\n {['inputs', 'parameters'].includes(label) && }\n \n {data.type_name}:{label !== 'outputs' && }\n {data.description && (\n \n \n \n )}\n \n \n \n }\n >\n {['outputs'].includes(label) && }\n \n \n \n );\n};\n\nexport default NodeHandler;\n" }, { "path": "components/flow/node-param-handler.tsx", "content": "import { IFlowNode, IFlowNodeParameter } from '@/types/flow';\nimport { Checkbox, Input, InputNumber, Select, Tooltip } from 'antd';\nimport React from 'react';\nimport RequiredIcon from './required-icon';\nimport NodeHandler from './node-handler';\nimport { InfoCircleOutlined } from '@ant-design/icons';\n\ninterface NodeParamHandlerProps {\n node: IFlowNode;\n data: IFlowNodeParameter;\n label: 'inputs' | 'outputs' | 'parameters';\n index: number; // index of array\n}\n\n// render node parameters item\nconst NodeParamHandler: React.FC = ({ node, data, label, index }) => {\n function handleChange(value: any) {\n data.value = value;\n }\n\n if (data.category === 'resource') {\n return ;\n } else if (data.category === 'common') {\n let defaultValue = data.value !== null && data.value !== undefined ? data.value : data.default;\n switch (data.type_name) {\n case 'int':\n return (\n
    \n

    \n {data.label}:\n {data.description && (\n \n \n \n )}\n

    \n {\n handleChange(e.target.value);\n }}\n />\n
    \n );\n case 'str':\n return (\n
    \n

    \n {data.label}:\n {data.description && (\n \n \n \n )}\n

    \n {data.options?.length > 0 ? (\n ({ label: item.label, value: item.value }))}\n onChange={handleChange}\n />\n ) : (\n {\n handleChange(e.target.value);\n }}\n />\n )}\n
    \n );\n case 'bool':\n defaultValue = defaultValue === 'False' ? false : defaultValue;\n defaultValue = defaultValue === 'True' ? true : defaultValue;\n return (\n
    \n

    \n {data.label}:\n {data.description && (\n \n \n \n )}\n {\n handleChange(e.target.checked);\n }}\n />\n

    \n
    \n );\n }\n }\n};\n\nexport default NodeParamHandler;\n" }, { "path": "components/flow/preview-flow.tsx", "content": "import { IFlowData } from '@/types/flow';\nimport React from 'react';\nimport ReactFlow, { Background } from 'reactflow';\nimport ButtonEdge from './button-edge';\nimport { mapUnderlineToHump } from '@/utils/flow';\nimport 'reactflow/dist/style.css';\n\nconst PreviewFlow: React.FC<{ flowData: IFlowData; minZoom?: number }> = ({ flowData, minZoom }) => {\n const data = mapUnderlineToHump(flowData);\n\n return (\n \n \n \n );\n};\n\nexport default PreviewFlow;\n" }, { "path": "components/flow/required-icon.tsx", "content": "import React from 'react';\n\nconst RequiredIcon: React.FC<{ optional?: boolean | undefined }> = ({ optional }) => {\n if (optional) {\n return null;\n }\n return  *;\n};\n\nexport default RequiredIcon;\n" }, { "path": "components/flow/static-nodes.tsx", "content": "import { IFlowNode } from '@/types/flow';\nimport { Avatar, Empty, List } from 'antd';\nimport React, { DragEvent } from 'react';\nimport { useTranslation } from 'react-i18next';\n\nconst StaticNodes: React.FC<{ nodes: IFlowNode[] }> = ({ nodes }) => {\n const { t } = useTranslation();\n\n function onDragStart(event: DragEvent, node: IFlowNode) {\n event.dataTransfer.setData('application/reactflow', JSON.stringify(node));\n event.dataTransfer.effectAllowed = 'move';\n }\n\n if (nodes?.length > 0) {\n return (\n (\n onDragStart(event, node)}\n >\n }\n title={

    {node.label}

    }\n description={

    {node.description}

    }\n />\n \n )}\n />\n );\n } else {\n return ;\n }\n};\n\nexport default StaticNodes;\n" }, { "path": "components/icons/add-icon.tsx", "content": "import React from 'react';\n\nexport default function AddIcon() {\n return (\n \n \n \n );\n}\n" }, { "path": "components/icons/collect.tsx", "content": "import React from 'react';\n\nexport default function CollectIcon() {\n return (\n \n \n \n );\n}\n" }, { "path": "components/icons/collected.tsx", "content": "import React from 'react';\n\nexport default function CollectedIcon() {\n return (\n \n );\n}\n" }, { "path": "components/icons/colorful-chat.tsx", "content": "function ColorfulChat() {\n return (\n \n \n \n \n \n \n \n );\n}\n\nexport default ColorfulChat;\n" }, { "path": "components/icons/colorful-dashboard.tsx", "content": "function ColorfulDashboard() {\n return (\n \n \n \n \n \n \n );\n}\n\nexport default ColorfulDashboard;\n" }, { "path": "components/icons/colorful-data.tsx", "content": "function ColorfulData() {\n return (\n \n \n \n \n \n \n \n );\n}\n\nexport default ColorfulData;\n" }, { "path": "components/icons/colorful-db.tsx", "content": "function ColorfulDB() {\n return (\n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n );\n}\n\nexport default ColorfulDB;\n" }, { "path": "components/icons/colorful-doc.tsx", "content": "function ColorfulDoc() {\n return (\n \n \n \n \n );\n}\n\nexport default ColorfulDoc;\n" }, { "path": "components/icons/colorful-excel.tsx", "content": "function ColorfulExcel() {\n return (\n \n \n \n \n \n \n );\n}\n\nexport default ColorfulExcel;\n" }, { "path": "components/icons/colorful-plugin.tsx", "content": "function ColorfulPlugin() {\n return (\n \n \n \n );\n}\n\nexport default ColorfulPlugin;\n" }, { "path": "components/icons/dark-svg.tsx", "content": "function DarkSvg() {\n return (\n \n \n \n );\n}\n\nexport default DarkSvg;\n" }, { "path": "components/icons/db-svg.tsx", "content": "function DBSvg() {\n return (\n \n \n \n );\n}\n\nexport default DBSvg;\n" }, { "path": "components/icons/done-icon.tsx", "content": "export default function DoneIcon() {\n return (\n \n \n \n \n \n );\n}\n" }, { "path": "components/icons/file-done.tsx", "content": "import React from 'react';\n\nexport default function FileDone() {\n return (\n \n \n \n \n \n );\n}\n" }, { "path": "components/icons/file-error.tsx", "content": "import React from 'react';\n\nexport default function FileError() {\n return (\n \n \n \n );\n}\n" }, { "path": "components/icons/file-sync.tsx", "content": "import React from 'react';\n\nexport default function FileSync() {\n return (\n \n \n \n \n \n );\n}\n" }, { "path": "components/icons/index.tsx", "content": "import ColorfulDashboard from './colorful-dashboard';\nimport ColorfulData from './colorful-data';\nimport ColorfulDB from './colorful-db';\nimport ColorfulDoc from './colorful-doc';\nimport ColorfulExcel from './colorful-excel';\nimport ColorfulPlugin from './colorful-plugin';\nimport ColorfulChat from './colorful-chat';\nimport DarkSvg from './dark-svg';\nimport DBSvg from './db-svg';\nimport ModelSvg from './model-svg';\nimport StarsSvg from './stars-svg';\nimport SunnySvg from './sunny-svg';\nimport Knowledge from './knowledge';\nimport FileDone from './file-done';\nimport FileSync from './file-sync';\nimport PendingIcon from './pending-icon';\nimport SyncIcon from './sync-icon';\nimport DoneIcon from './done-icon';\nimport FileError from './file-error';\n\nexport {\n ColorfulDashboard,\n ColorfulData,\n ColorfulDB,\n ColorfulDoc,\n ColorfulExcel,\n ColorfulPlugin,\n ColorfulChat,\n DarkSvg,\n DBSvg,\n ModelSvg,\n StarsSvg,\n SunnySvg,\n Knowledge,\n FileDone,\n FileSync,\n PendingIcon,\n SyncIcon,\n DoneIcon,\n FileError,\n};\n" }, { "path": "components/icons/knowledge.tsx", "content": "import React from 'react';\n\nexport default function knowledge() {\n return (\n \n \n \n );\n}\n" }, { "path": "components/icons/model-svg.tsx", "content": "function ModelSvg() {\n return (\n \n \n \n );\n}\n\nexport default ModelSvg;\n" }, { "path": "components/icons/pending-icon.tsx", "content": "export default function PendingIcon() {\n return (\n \n \n \n \n \n );\n}\n" }, { "path": "components/icons/stars-svg.tsx", "content": "function StarsSvg() {\n return (\n \n \n \n );\n}\n\nexport default StarsSvg;\n" }, { "path": "components/icons/sunny-svg.tsx", "content": "function SunnySvg() {\n return (\n \n \n \n );\n}\n\nexport default SunnySvg;\n" }, { "path": "components/icons/sync-icon.tsx", "content": "export default function SyncIcon() {\n return (\n \n \n \n );\n}\n" }, { "path": "components/knowledge/arguments-modal.tsx", "content": "import React, { useEffect, useState } from 'react';\nimport { Modal, Tabs, Button, Input, Form, Col, Row, Spin } from 'antd';\nimport { useTranslation } from 'react-i18next';\n\nimport { AlertFilled, BookOutlined, FileSearchOutlined } from '@ant-design/icons';\nimport { apiInterceptors, getArguments, saveArguments } from '@/client/api';\nimport { IArguments, ISpace } from '@/types/knowledge';\n\nconst { TextArea } = Input;\n\ninterface IProps {\n space: ISpace;\n argumentsShow: boolean;\n setArgumentsShow: (argumentsShow: boolean) => void;\n}\n\nexport default function ArgumentsModal({ space, argumentsShow, setArgumentsShow }: IProps) {\n const { t } = useTranslation();\n const [newSpaceArguments, setNewSpaceArguments] = useState();\n const [spinning, setSpinning] = useState(false);\n\n const fetchArguments = async () => {\n const [_, data] = await apiInterceptors(getArguments(space.name));\n setNewSpaceArguments(data);\n };\n\n useEffect(() => {\n fetchArguments();\n }, [space.name]);\n\n const renderEmbeddingForm = () => {\n return (\n \n \n tooltip={t(`the_top_k_vectors`)} rules={[{ required: true }]} label={t('topk')} name={['embedding', 'topk']}>\n \n \n \n \n \n tooltip={t(`Set_a_threshold_score`)}\n rules={[{ required: true }]}\n label={t('recall_score')}\n name={['embedding', 'recall_score']}\n >\n \n \n \n \n tooltip={t(`recall_type`)} rules={[{ required: true }]} label={t('recall_type')} name={['embedding', 'recall_type']}>\n \n \n \n \n tooltip={t(`A_model_used`)} rules={[{ required: true }]} label={t('model')} name={['embedding', 'model']}>\n \n \n \n \n \n tooltip={t(`The_size_of_the_data_chunks`)}\n rules={[{ required: true }]}\n label={t('chunk_size')}\n name={['embedding', 'chunk_size']}\n >\n \n \n \n \n \n tooltip={t(`The_amount_of_overlap`)}\n rules={[{ required: true }]}\n label={t('chunk_overlap')}\n name={['embedding', 'chunk_overlap']}\n >\n \n \n \n \n );\n };\n\n const renderPromptForm = () => {\n return (\n <>\n tooltip={t(`A_contextual_parameter`)} label={t('scene')} name={['prompt', 'scene']}>\n