Merge pull request #100 from DLHTX/flow

src/components/DeveloperIDE/Flow/index.tsx

@@ -6,7 +6,7 @@ import ReactFlow, { Background, Controls, MarkerType, NodeTypes } from 'reactflo
 import { useStore } from '@/store/index';
 import { generateNodeGroupMenu, generateReactFlowNode, NodeIcon, NodeMenuItem } from '@/components/FlowNode';
 import 'reactflow/dist/style.css';
-import { INodeType } from '@/server/nodes/types';
+import { INodeType } from '@/lib/nodes/types';
 import { helper } from '@/lib/helper';
 import { FlowNode } from '@/store/standard/Node';
 import { hooks } from '@/lib/hooks';
@@ -19,7 +19,7 @@ import { Flows, IndexDb } from '@/lib/dexie';
 import { Box, Button, Collapse, Flex, Text } from '@chakra-ui/react';
 import { getSelectedStyles } from '../ToolBar';
 import { DeleteIcon } from '@chakra-ui/icons';
-import { VscDebugStart } from 'react-icons/vsc';
+import { VscDebugStart, VscDebugPause } from 'react-icons/vsc';
 
 const MenuItemCollapse = ({ nodeMenuItem, addNode }: { nodeMenuItem: NodeMenuItem; addNode: (event: any, nodeInstance: INodeType) => void }) => {
   // const { classes } = useStyles();
@@ -274,7 +274,7 @@ const Flow = observer(() => {
                   minZoom={0.5}
                   maxZoom={1.5}
                   onInit={flow.onInit}
-                  nodes={flow.nodes.map((i) => ({ ...i, dragHandle:".drag-handle" }))}
+                  nodes={flow.nodes.map((i) => ({ ...i, dragHandle: '.drag-handle' }))}
                   edges={flow.edges}
                   onNodesChange={flow.onNodesChange}
                   onEdgesChange={flow.onEdgesChange}
@@ -314,12 +314,19 @@ const Flow = observer(() => {
                   color: '#fff',
                   cursor: 'pointer'
                 }}
-                rightIcon={<VscDebugStart color="white" />}
+                // VscDebugPause
+                rightIcon={flow.curFlowRunning ? <VscDebugPause /> : <VscDebugStart />}
                 onClick={() => {
-                  flow.executeFlow();
+                  if (flow.curFlowRunning) {
+                    flow.curFlowRunning = false;
+                    return;
+                  } else {
+                    flow.curFlowRunning = true;
+                    flow.executeFlow();
+                  }
                 }}
               >
-                Start
+                {flow.curFlowRunning ? 'Pause' : 'Start'}
               </Button>
             </Flex>
           </>

src/components/FlowNode/index.tsx

@@ -8,7 +8,7 @@ import { ImEqualizer } from 'react-icons/im';
 import { Handle, NodeTypes, Position } from 'reactflow';
 import { observer, useLocalObservable } from 'mobx-react-lite';
 import { useStore } from '@/store/index';
-import { INodeGroup, INodeIconType, INodeType } from '@/server/nodes/types';
+import { INodeGroup, INodeIconType, INodeType } from '@/lib/nodes/types';
 import { hooks } from '@/lib/hooks';
 import { FlowNode } from '@/store/standard/Node';
 import { Radar2 } from 'tabler-icons-react';

src/components/JSONFormWidgets/RuntimeConsoleWidget/index.tsx

@@ -59,16 +59,12 @@ const RuntimeConsole = observer(({ label, required, value, readonly, onChange, o
         return (
           <Flex userSelect={'text'}>
             <Flex color="#d892ff" mr={2} whiteSpace="nowrap">
-              [wasmvm
-              {/* {
-                <>
-                  <Box color="#ffd300" ml={1}>
-                    {dayjs(i?.['@ts']).format('hh:mm:ss')}
-                  </Box>
-                </>
-              } */}
-              ]
-            </Flex>{' '}
+              <>
+                <Box color="#ffd300" ml={1}>
+                  {dayjs(i?.['@ts']).format('hh:mm:ss')}
+                </Box>
+              </>
+            </Flex>
             <Flex wordBreak={'break-all'}>{JSON.stringify(i)}</Flex>
           </Flex>
         );

src/components/JSONRender/index.tsx

@@ -2,10 +2,6 @@ import React, { AllHTMLAttributes, useEffect } from 'react';
 import { useLocalObservable, observer } from 'mobx-react-lite';
 import { _ } from '@/lib/lodash';
 import { extendObservable, makeAutoObservable, toJS } from 'mobx';
-import { JSONForm } from '../JSONForm';
-import WebhookSubmitWidget from './WebhookSubmitWidget';
-import { helper } from '@/lib/helper';
-import { Box } from '@chakra-ui/react';
 
 // export let JSONRenderComponentsMap = {
 //   div: Box,

src/server/nodes/Trigger/SimulationNode.ts → src/lib/nodes/Trigger/SimulationNode.ts

@@ -29,9 +29,10 @@ return faker.helpers.multiple(createRandomUser, {
 export const dataSimulationNodeSchema = {
   type: 'object',
   properties: {
+    triggerInterval: { type: 'number', title: 'Trigger Interval (Seconds)' },
     code: { type: 'string', title: 'Code' }
   },
-  required: ['id', 'code']
+  required: ['triggerInterval', 'code']
 } as const;
 
 export type dataSimulationNodeSchemaType = FromSchema<typeof dataSimulationNodeSchema>;
@@ -106,7 +107,8 @@ export class SimulationNode extends BaseNode {
                   }
                 },
                 value: {
-                  code: ''
+                  code: '',
+                  triggerInterval: '2'
                 }
               }
             }

src/server/nodes/baseNode.ts → src/lib/nodes/baseNode.ts

@@ -1,6 +1,6 @@
 import { IFormType, INodeType, INodeTypeDescription } from './types';
 import { v4 as uuid } from 'uuid';
-import { FlowNode } from '../types';
+import { FlowNode } from '../../server/types';
 export const BaseNodeSettingSchema = {
   type: 'object',
   properties: {
@@ -53,4 +53,6 @@ export abstract class BaseNode implements INodeType {
     const jsonForm = this.form.formList[formIndex]?.form?.find((item) => item.component === 'JSONForm');
     jsonForm && (jsonForm.props.formState.value = value);
   };
+
+
 }

src/server/nodes/index.ts → src/lib/nodes/index.ts

@@ -1,8 +1,4 @@
 import { INodeType } from './types';
-import { CodeNode } from './codeNode';
-import { WebhookNode } from './webhookNode';
-import { CarNode } from './Trigger/SmartCar';
-import { RadarNode } from './Trigger/Radar';
 import { SimulationNode } from './Trigger/SimulationNode';
 import { WasmNode } from './Code/WasmNode';
 import { VmRunTimeNode } from './Runtime/VmRunTimeNode';
@@ -12,21 +8,12 @@ export class NodeManager {
   nodeClassMap: Record<string, any> = {};
   nodesJSON: any[] = [];
 
-  // getNodeInstancesMap(): Record<string, INodeType> {
-  //   if (!this.nodes.length) this.registerNode();
-  //   return this.nodes.reduce((acc, cur) => {
-  //     acc[cur.description.name] = cur;
-  //     return acc;
-  //   }, {});
-  // }
-
   getClass(name: string) {
     return this.nodeClassMap[name];
   }
 
   constructor() {
     this.registerNode();
-    // console.log(this.nodes);
   }
 
   registerNode() {
@@ -42,9 +29,6 @@ export class NodeManager {
     //@ts-ignore
     this.nodes = Object.values(this.nodeClassMap).map((i) => new i());
     this.nodesJSON = this.nodes.map((node) => node.toJSON());
-
-    // console.log(this.nodes);
-    // console.log('nodesJSON', this.nodesJSON);
     return this.nodes;
   }
 

src/pages/api/nodes.ts

@@ -1,5 +1,5 @@
 import { NextApiRequest, NextApiResponse } from 'next';
-import { nodeManager } from '../../server/nodes/index';
+import { nodeManager } from '../../lib/nodes/index';
 
 const handler = (req: NextApiRequest, res: NextApiResponse) => {
   try {