Merge pull request #74 from AGIUI/dev0.3.7-ask-shadow

Dev0.3.7 ask shadow

README.md

@@ -157,6 +157,9 @@ npm run build [browser]
 
 ## 版本记录
 
+#### v0.3.7
+- 新增节点：用户输入、合并输入
+
 #### v0.3.6
 - 角色节点的升级，对话界面可以切换角色
 

package.json

@@ -1,7 +1,7 @@
 {
     "name": "Earth",
     "displayName": "Earth",
-    "version": "0.3.7.1",
+    "version": "0.3.7.2",
     "description": "AGIUI for Browser Extension",
     "license": "MIT",
     "repository": {

src/components/flow/Sidebar/index.tsx

@@ -1,10 +1,10 @@
-import React from 'react';
+import React, { useEffect } from 'react';
 import { Collapse } from 'antd';
 const { Panel } = Collapse;
 import getNodes from '../nodeComponents/index'
 import i18n from "i18next";
 
-export default () => {
+export default (props: any) => {
     const onDragStart = (event: any, nodeType: string, dataType: string) => {
         event.dataTransfer.setData('application/reactflow', nodeType);
         event.dataTransfer.setData('application/dataType', dataType);
@@ -13,7 +13,16 @@ export default () => {
     const onChange: any = (key: string) => {
         console.log(key);
     };
-    const nodes = getNodes()
+
+    const { newNodes } = props;
+
+    const [nodes, setNodes] = React.useState(getNodes());
+
+    useEffect(() => {
+        console.log('sidebar newNodes:', newNodes)
+        if (newNodes && newNodes.length > 0) setNodes(newNodes)
+    }, [newNodes])
+
     // console.log(Array.from(nodes.filter((n: any) => n.open), n => n.title))
     return (
         <Collapse

src/components/flow/index.tsx

@@ -15,7 +15,7 @@ import ReactFlow, {
 } from 'reactflow';
 import { shallow } from 'zustand/shallow';
 
-import { Button, Input, Checkbox, Card, Divider, Collapse, Popconfirm, Space, Spin,Tooltip } from 'antd';
+import { Button, Input, Checkbox, Card, Divider, Collapse, Popconfirm, Space, Spin, Tooltip } from 'antd';
 
 const { Panel: Panel0 } = Collapse;
 
@@ -35,19 +35,6 @@ import 'reactflow/dist/style.css';
 
 import { _DEFAULTCOMBO, defaultNode } from './Workflow';
 
-import getNodes from './nodeComponents/index';
-
-
-// 定义节点类型
-const nodeTypes: any = {};
-
-for (const node of getNodes()) {
-  const children: any = node.children;
-  for (const n of children) {
-    nodeTypes[n.key] = n.component
-  }
-
-}
 
 // 定义连线类型
 const edgeTypes = {
@@ -86,8 +73,8 @@ const defaultEdgeOptions = { style: connectionLineStyle, type: 'brainwave' };
 
 function Flow(props: any) {
 
-  const { debug, merge, loadData, isNew, saveCallback, deleteCallback, exportData } = props;
-  // console.log('Flow isNew', isNew)
+  const { debug, merge, loadData, isNew, saveCallback, deleteCallback, exportData, newNodes } = props;
+
 
   const reactFlowInstance = useReactFlow();
 
@@ -461,7 +448,6 @@ function Flow(props: any) {
   })
 
 
-
   return (
     <ReactFlow
       nodes={nodes}
@@ -471,7 +457,7 @@ function Flow(props: any) {
       onConnect={onConnect}
       onConnectStart={onConnectStart}
       onConnectEnd={onConnectEnd}
-      nodeTypes={nodeTypes}
+      nodeTypes={newNodes.nodeTypes}
       edgeTypes={edgeTypes}
       nodeOrigin={nodeOrigin}
       defaultEdgeOptions={defaultEdgeOptions}
@@ -501,7 +487,7 @@ function Flow(props: any) {
       <Background variant={variant} />
       {isLoaded ? <>
         <Panel position="top-left">
-          <Sidebar />
+          <Sidebar newNodes={newNodes.nodes} />
         </Panel>
         <Panel position="top-right">
           <Card
@@ -517,9 +503,9 @@ function Flow(props: any) {
                   size={"small"}
                 >
 
-                    <Tooltip title={`ID: ${id}`} placement="rightBottom">
-                      <span style={{ fontWeight: "bold" }}>{i18n.t("workflowName")}</span>
-                    </Tooltip>
+                  <Tooltip title={`ID: ${id}`} placement="rightBottom">
+                    <span style={{ fontWeight: "bold" }}>{i18n.t("workflowName")}</span>
+                  </Tooltip>
 
                   <Input placeholder={i18n.t("inputTextPlaceholder")?.toString()}
                     value={tag}
@@ -584,7 +570,7 @@ function Flow(props: any) {
 }
 
 export default (props: any) => {
-  const { debug, merge, loadData, isNew, saveCallback, deleteCallback, exportData } = props;
+  const { debug, merge, loadData, isNew, saveCallback, deleteCallback, exportData, newNodes } = props;
 
   return (<ReactFlowProvider >
     <Flow
@@ -595,6 +581,7 @@ export default (props: any) => {
       exportData={exportData}
       saveCallback={saveCallback}
       deleteCallback={deleteCallback}
+      newNodes={newNodes} //自定义节点的动态开关 
     />
   </ReactFlowProvider>)
 };

src/components/flow/nodeComponents/InputMergeNode.tsx

@@ -124,6 +124,7 @@ function Main({ id, data, selected }: any) {
 
 
                 {createText('output', i18n.t('mergeReg'), '', output, '', updateData)}
+                <p style={{marginTop:5,color:"red",fontSize:12}}>{i18n.t('inputMergePlaceholderTips')}</p>
 
             </div>
 

src/components/flow/nodeComponents/QueryInputNode.tsx

@@ -30,7 +30,7 @@ const createUrl = (input: string, json: any, onChange: any) => {
     }}>
 
     {
-      createTextArea(i18n.t('selectQuery'), query, i18n.t('selectQuery'), "", (e: any) => {
+      createTextArea(i18n.t('selectQuery'), query, ".tag", "", (e: any) => {
         const data = {
           ...json,
           queryObj: {