@nocobase/plugin-workflow 0.10.1-alpha.1 → 0.11.1-alpha.1

package/src/client/nodes/manual/index.tsx

@@ -0,0 +1,162 @@
+import { BlockInitializers, SchemaInitializerItemOptions, useCollectionManager, useCompile } from '@nocobase/client';
+
+import { CollectionBlockInitializer } from '../../components/CollectionBlockInitializer';
+import { defaultFieldNames, getCollectionFieldOptions } from '../../variable';
+import { NAMESPACE } from '../../locale';
+import { SchemaConfig, SchemaConfigButton } from './SchemaConfig';
+import { ModeConfig } from './ModeConfig';
+import { AssigneesSelect } from './AssigneesSelect';
+
+const MULTIPLE_ASSIGNED_MODE = {
+  SINGLE: Symbol('single'),
+  ALL: Symbol('all'),
+  ANY: Symbol('any'),
+  ALL_PERCENTAGE: Symbol('all percentage'),
+  ANY_PERCENTAGE: Symbol('any percentage'),
+};
+
+// TODO(optimize): change to register way
+const initializerGroup = BlockInitializers.items.find((group) => group.key === 'media');
+if (!initializerGroup.children.find((item) => item.key === 'workflowTodos')) {
+  initializerGroup.children.push({
+    key: 'workflowTodos',
+    type: 'item',
+    title: `{{t("Workflow todos", { ns: "${NAMESPACE}" })}}`,
+    component: 'WorkflowTodoBlockInitializer',
+    icon: 'CheckSquareOutlined',
+  } as any);
+}
+
+export default {
+  title: `{{t("Manual", { ns: "${NAMESPACE}" })}}`,
+  type: 'manual',
+  group: 'manual',
+  description: `{{t("Could be used for manually submitting data, and determine whether to continue or exit. Workflow will generate a todo item for assigned user when it reaches a manual node, and continue processing after user submits the form.", { ns: "${NAMESPACE}" })}}`,
+  fieldset: {
+    assignees: {
+      type: 'array',
+      title: `{{t("Assignees", { ns: "${NAMESPACE}" })}}`,
+      'x-decorator': 'FormItem',
+      'x-component': 'AssigneesSelect',
+      'x-component-props': {
+        // multiple: true,
+      },
+      required: true,
+      default: [],
+    },
+    mode: {
+      type: 'number',
+      title: `{{t("Mode", { ns: "${NAMESPACE}" })}}`,
+      'x-decorator': 'FormItem',
+      'x-component': 'ModeConfig',
+      default: 1,
+      'x-reactions': {
+        dependencies: ['assignees'],
+        fulfill: {
+          state: {
+            visible: '{{$deps[0].length > 1}}',
+          },
+        },
+      },
+    },
+    schema: {
+      type: 'void',
+      title: `{{t("User interface", { ns: "${NAMESPACE}" })}}`,
+      'x-decorator': 'FormItem',
+      'x-component': 'SchemaConfigButton',
+      properties: {
+        schema: {
+          type: 'object',
+          'x-component': 'SchemaConfig',
+          default: null,
+        },
+      },
+    },
+    forms: {
+      type: 'object',
+      default: {},
+    },
+  },
+  view: {},
+  scope: {},
+  components: {
+    SchemaConfigButton,
+    SchemaConfig,
+    ModeConfig,
+    AssigneesSelect,
+  },
+  useVariables({ id, title, config }, { types, fieldNames = defaultFieldNames }) {
+    const compile = useCompile();
+    const { getCollectionFields } = useCollectionManager();
+    const formKeys = Object.keys(config.forms ?? {});
+    if (!formKeys.length) {
+      return null;
+    }
+
+    const options = formKeys
+      .map((formKey) => {
+        const form = config.forms[formKey];
+
+        const fieldsOptions = getCollectionFieldOptions({
+          fields: form.collection?.fields,
+          collection: form.collection,
+          types,
+          compile,
+          getCollectionFields,
+        });
+        const label = compile(form.title) || formKey;
+        return fieldsOptions.length
+          ? {
+              key: formKey,
+              value: formKey,
+              label,
+              title: label,
+              children: fieldsOptions,
+            }
+          : null;
+      })
+      .filter(Boolean);
+
+    return options.length
+      ? {
+          [fieldNames.value]: `${id}`,
+          [fieldNames.label]: title,
+          [fieldNames.children]: options,
+        }
+      : null;
+  },
+  useInitializers(node): SchemaInitializerItemOptions | null {
+    const { getCollection } = useCollectionManager();
+    const formKeys = Object.keys(node.config.forms ?? {});
+    if (!formKeys.length || node.config.mode) {
+      return null;
+    }
+
+    const forms = formKeys
+      .map((formKey) => {
+        const form = node.config.forms[formKey];
+        const { fields = [] } = getCollection(form.collection);
+
+        return fields.length
+          ? ({
+              type: 'item',
+              title: form.title ?? formKey,
+              component: CollectionBlockInitializer,
+              collection: form.collection,
+              dataSource: `{{$jobsMapByNodeId.${node.id}.${formKey}}}`,
+            } as SchemaInitializerItemOptions)
+          : null;
+      })
+      .filter(Boolean);
+
+    return forms.length
+      ? {
+          key: 'forms',
+          type: 'subMenu',
+          title: node.title,
+          children: forms,
+        }
+      : null;
+  },
+  initializers: {},
+};

package/src/client/nodes/manual/utils.ts

@@ -0,0 +1,28 @@
+export function traverseSchema(schema, fn) {
+  fn(schema);
+  if (schema.properties) {
+    Object.keys(schema.properties).forEach((key) => {
+      traverseSchema(schema.properties[key], fn);
+    });
+  }
+}
+
+export function findSchema(schema, filter, onlyLeaf = false) {
+  const result = [];
+
+  if (!schema) {
+    return result;
+  }
+
+  if (filter(schema) && (!onlyLeaf || !schema.properties)) {
+    result.push(schema);
+    return result;
+  }
+
+  if (schema.properties) {
+    Object.keys(schema.properties).forEach((key) => {
+      result.push(...findSchema(schema.properties[key], filter));
+    });
+  }
+  return result;
+}

package/src/client/nodes/parallel.tsx

@@ -0,0 +1,138 @@
+import { PlusOutlined } from '@ant-design/icons';
+import { css, cx } from '@nocobase/client';
+import { Button, Tooltip } from 'antd';
+import React, { useState } from 'react';
+import { NodeDefaultView } from '.';
+import { Branch } from '../Branch';
+import { useFlowContext } from '../FlowContext';
+import { RadioWithTooltip } from '../components/RadioWithTooltip';
+import { NAMESPACE, lang } from '../locale';
+import useStyles from '../style';
+
+export default {
+  title: `{{t("Parallel branch", { ns: "${NAMESPACE}" })}}`,
+  type: 'parallel',
+  group: 'control',
+  description: `{{t("Run multiple branch processes in parallel.", { ns: "${NAMESPACE}" })}}`,
+  fieldset: {
+    mode: {
+      type: 'string',
+      title: `{{t("Mode", { ns: "${NAMESPACE}" })}}`,
+      'x-decorator': 'FormItem',
+      'x-component': 'RadioWithTooltip',
+      'x-component-props': {
+        options: [
+          {
+            value: 'all',
+            label: `{{t('All succeeded', { ns: "${NAMESPACE}" })}}`,
+            tooltip: `{{t('Continue after all branches succeeded', { ns: "${NAMESPACE}" })}}`,
+          },
+          {
+            value: 'any',
+            label: `{{t('Any succeeded', { ns: "${NAMESPACE}" })}}`,
+            tooltip: `{{t('Continue after any branch succeeded', { ns: "${NAMESPACE}" })}}`,
+          },
+          {
+            value: 'race',
+            label: `{{t('Any succeeded or failed', { ns: "${NAMESPACE}" })}}`,
+            tooltip: `{{t('Continue after any branch succeeded, or exit after any branch failed.', { ns: "${NAMESPACE}" })}}`,
+          },
+        ],
+      },
+      default: 'all',
+    },
+  },
+  view: {},
+  component: function Component({ data }) {
+    const { styles } = useStyles();
+    const {
+      id,
+      config: { mode },
+    } = data;
+    const { workflow, nodes } = useFlowContext();
+    const branches = nodes
+      .reduce((result, node) => {
+        if (node.upstreamId === id && node.branchIndex != null) {
+          return result.concat(node);
+        }
+        return result;
+      }, [])
+      .sort((a, b) => a.branchIndex - b.branchIndex);
+    const [branchCount, setBranchCount] = useState(Math.max(2, branches.length));
+
+    const tempBranches = Array(Math.max(0, branchCount - branches.length)).fill(null);
+    const lastBranchHead = branches[branches.length - 1];
+
+    return (
+      <NodeDefaultView data={data}>
+        <div className={cx(styles.nodeSubtreeClass)}>
+          <div className={cx(styles.branchBlockClass)}>
+            {branches.map((branch) => (
+              <Branch key={branch.id} from={data} entry={branch} branchIndex={branch.branchIndex} />
+            ))}
+            {tempBranches.map((_, i) => (
+              <Branch
+                key={`temp_${branches.length + i}`}
+                from={data}
+                branchIndex={(lastBranchHead ? lastBranchHead.branchIndex : 0) + i + 1}
+                controller={
+                  branches.length + i > 1 ? (
+                    <div
+                      className={css`
+                        padding-top: 2em;
+
+                        > button {
+                          .anticon {
+                            transform: rotate(45deg);
+                          }
+                        }
+                      `}
+                    >
+                      <Button
+                        shape="circle"
+                        icon={<PlusOutlined />}
+                        onClick={() => setBranchCount(branchCount - 1)}
+                        disabled={workflow.executed}
+                      />
+                    </div>
+                  ) : null
+                }
+              />
+            ))}
+          </div>
+          <div
+            className={css`
+              position: relative;
+              height: 2em;
+            `}
+          >
+            <Tooltip
+              title={lang('Add branch')}
+              className={css`
+                visibility: ${workflow.executed ? 'hidden' : 'visible'};
+              `}
+            >
+              <Button
+                icon={<PlusOutlined />}
+                className={css`
+                  position: absolute;
+                  top: calc(50% - 1px);
+                  transform: translateX(-50%) rotate(45deg);
+
+                  .anticon {
+                    transform: rotate(-45deg);
+                  }
+                `}
+                onClick={() => setBranchCount(branchCount + 1)}
+                disabled={workflow.executed}
+              />
+            </Tooltip>
+          </div>
+        </div>
+      </NodeDefaultView>
+    );
+  },
+  components: {
+    RadioWithTooltip,
+  },
+};

package/src/client/nodes/query.tsx

@@ -0,0 +1,88 @@
+import { SchemaInitializerItemOptions, useCollectionDataSource, useCollectionManager, useCompile } from '@nocobase/client';
+
+import { appends, collection, filter } from '../schemas/collection';
+import { NAMESPACE } from '../locale';
+import { CollectionBlockInitializer } from '../components/CollectionBlockInitializer';
+import { FilterDynamicComponent } from '../components/FilterDynamicComponent';
+import { getCollectionFieldOptions } from '../variable';
+import { FieldsSelect } from '../components/FieldsSelect';
+
+export default {
+  title: `{{t("Query record", { ns: "${NAMESPACE}" })}}`,
+  type: 'query',
+  group: 'collection',
+  description: `{{t("Query records from a collection. You can use variables from upstream nodes as query conditions.", { ns: "${NAMESPACE}" })}}`,
+  fieldset: {
+    collection,
+    multiple: {
+      type: 'boolean',
+      title: `{{t("Allow multiple records as result", { ns: "${NAMESPACE}" })}}`,
+      'x-decorator': 'FormItem',
+      'x-component': 'Checkbox',
+      description: `{{t("If checked, when there are multiple records in the query result, an array will be returned as the result, which can be operated on one by one using a loop node. Otherwise, only one record will be returned.", { ns: "${NAMESPACE}" })}}`,
+    },
+    params: {
+      type: 'object',
+      properties: {
+        filter,
+        appends,
+      },
+    },
+    failOnEmpty: {
+      type: 'boolean',
+      title: `{{t("Exit when query result is null", { ns: "${NAMESPACE}" })}}`,
+      'x-decorator': 'FormItem',
+      'x-component': 'Checkbox',
+    },
+  },
+  view: {},
+  scope: {
+    useCollectionDataSource,
+  },
+  components: {
+    FilterDynamicComponent,
+  },
+  useVariables({ id, title, config }, options) {
+    const compile = useCompile();
+    const { getCollectionFields } = useCollectionManager();
+    // const depth = config?.params?.appends?.length
+    //   ? config?.params?.appends.reduce((max, item) => Math.max(max, item.split('.').length), 1)
+    //   : 0;
+    const name = `${id}`;
+    const [result] = getCollectionFieldOptions({
+      // collection: config.collection,
+      ...options,
+      fields: [
+        {
+          collectionName: config.collection,
+          name,
+          type: 'hasOne',
+          target: config.collection,
+          uiSchema: {
+            title,
+          },
+        },
+      ],
+      // depth: options?.depth ?? depth,
+      appends: [name, ...(config.params?.appends?.map((item) => `${name}.${item}`) || [])],
+      compile,
+      getCollectionFields,
+    });
+
+    return result;
+  },
+  useInitializers(node): SchemaInitializerItemOptions | null {
+    if (!node.config.collection || node.config.multiple) {
+      return null;
+    }
+
+    return {
+      type: 'item',
+      title: node.title ?? `#${node.id}`,
+      component: CollectionBlockInitializer,
+      collection: node.config.collection,
+      dataSource: `{{$jobsMapByNodeId.${node.id}}}`,
+    };
+  },
+  initializers: {},
+};

package/src/client/nodes/request.tsx

@@ -0,0 +1,185 @@
+import { ArrayItems } from '@formily/antd-v5';
+import React from 'react';
+
+import { Variable } from '@nocobase/client';
+import { NAMESPACE } from '../locale';
+import { useWorkflowVariableOptions } from '../variable';
+
+export default {
+  title: `{{t("HTTP request", { ns: "${NAMESPACE}" })}}`,
+  type: 'request',
+  group: 'extended',
+  description: `{{t("Send HTTP request to a URL. You can use the variables in the upstream nodes as request headers, parameters and request body.", { ns: "${NAMESPACE}" })}}`,
+  fieldset: {
+    method: {
+      type: 'string',
+      required: true,
+      title: `{{t("HTTP method", { ns: "${NAMESPACE}" })}}`,
+      'x-decorator': 'FormItem',
+      'x-component': 'Select',
+      'x-component-props': {
+        showSearch: false,
+        allowClear: false,
+      },
+      enum: [
+        { label: 'GET', value: 'GET' },
+        { label: 'POST', value: 'POST' },
+        { label: 'PUT', value: 'PUT' },
+        { label: 'PATCH', value: 'PATCH' },
+        { label: 'DELETE', value: 'DELETE' },
+      ],
+      default: 'POST',
+    },
+    url: {
+      type: 'string',
+      required: true,
+      title: `{{t("URL", { ns: "${NAMESPACE}" })}}`,
+      'x-decorator': 'FormItem',
+      'x-decorator-props': {},
+      'x-component': 'Input',
+      'x-component-props': {
+        placeholder: 'https://www.nocobase.com',
+        className: 'full-width',
+      },
+    },
+    headers: {
+      type: 'array',
+      'x-component': 'ArrayItems',
+      'x-decorator': 'FormItem',
+      title: `{{t("Headers", { ns: "${NAMESPACE}" })}}`,
+      description: `{{t('"Content-Type" only support "application/json", and no need to specify', { ns: "${NAMESPACE}" })}}`,
+      items: {
+        type: 'object',
+        properties: {
+          space: {
+            type: 'void',
+            'x-component': 'Space',
+            properties: {
+              name: {
+                type: 'string',
+                'x-decorator': 'FormItem',
+                'x-component': 'Input',
+                'x-component-props': {
+                  placeholder: `{{t("Name")}}`,
+                },
+              },
+              value: {
+                type: 'string',
+                'x-decorator': 'FormItem',
+                'x-component': 'Variable.Input',
+                'x-component-props': {
+                  scope: '{{useWorkflowVariableOptions()}}',
+                  useTypedConstant: true,
+                },
+              },
+              remove: {
+                type: 'void',
+                'x-decorator': 'FormItem',
+                'x-component': 'ArrayItems.Remove',
+              },
+            },
+          },
+        },
+      },
+      properties: {
+        add: {
+          type: 'void',
+          title: `{{t("Add request header", { ns: "${NAMESPACE}" })}}`,
+          'x-component': 'ArrayItems.Addition',
+        },
+      },
+    },
+    params: {
+      type: 'array',
+      'x-component': 'ArrayItems',
+      'x-decorator': 'FormItem',
+      title: `{{t("Parameters", { ns: "${NAMESPACE}" })}}`,
+      items: {
+        type: 'object',
+        properties: {
+          space: {
+            type: 'void',
+            'x-component': 'Space',
+            properties: {
+              name: {
+                type: 'string',
+                'x-decorator': 'FormItem',
+                'x-component': 'Input',
+                'x-component-props': {
+                  placeholder: `{{t("Name")}}`,
+                },
+              },
+              value: {
+                type: 'string',
+                'x-decorator': 'FormItem',
+                'x-component': 'Variable.Input',
+                'x-component-props': {
+                  scope: '{{useWorkflowVariableOptions()}}',
+                  useTypedConstant: true,
+                },
+              },
+              remove: {
+                type: 'void',
+                'x-decorator': 'FormItem',
+                'x-component': 'ArrayItems.Remove',
+              },
+            },
+          },
+        },
+      },
+      properties: {
+        add: {
+          type: 'void',
+          title: `{{t("Add parameter", { ns: "${NAMESPACE}" })}}`,
+          'x-component': 'ArrayItems.Addition',
+        },
+      },
+    },
+    data: {
+      type: 'string',
+      title: `{{t("Body", { ns: "${NAMESPACE}" })}}`,
+      'x-decorator': 'FormItem',
+      'x-decorator-props': {},
+      'x-component': 'RequestBody',
+      'x-component-props': {
+        changeOnSelect: true,
+        autoSize: {
+          minRows: 10,
+        },
+        placeholder: `{{t("Input request data", { ns: "${NAMESPACE}" })}}`,
+        className: 'full-width',
+      },
+      description: `{{t("Only support standard JSON data", { ns: "${NAMESPACE}" })}}`,
+    },
+    timeout: {
+      type: 'number',
+      title: `{{t("Timeout config", { ns: "${NAMESPACE}" })}}`,
+      'x-decorator': 'FormItem',
+      'x-decorator-props': {},
+      'x-component': 'InputNumber',
+      'x-component-props': {
+        addonAfter: `{{t("ms", { ns: "${NAMESPACE}" })}}`,
+        min: 1,
+        step: 1000,
+        defaultValue: 5000,
+      },
+    },
+    ignoreFail: {
+      type: 'boolean',
+      title: `{{t("Ignore fail request and continue workflow", { ns: "${NAMESPACE}" })}}`,
+      'x-decorator': 'FormItem',
+      'x-component': 'Checkbox',
+    },
+  },
+  view: {},
+  scope: {
+    useWorkflowVariableOptions,
+  },
+  components: {
+    ArrayItems,
+    RequestBody(props) {
+      const scope = useWorkflowVariableOptions();
+      return <Variable.JSON scope={scope} {...props} />;
+    },
+  },
+};

package/src/client/nodes/sql.tsx

@@ -0,0 +1,37 @@
+import React from 'react';
+
+import { Variable, css } from '@nocobase/client';
+
+import { NAMESPACE } from '../locale';
+import { useWorkflowVariableOptions } from '../variable';
+
+export default {
+  title: `{{t("SQL action", { ns: "${NAMESPACE}" })}}`,
+  type: 'sql',
+  group: 'extended',
+  description: `{{t("Execute a SQL statement in database.", { ns: "${NAMESPACE}" })}}`,
+  fieldset: {
+    sql: {
+      type: 'string',
+      required: true,
+      title: 'SQL',
+      description: `{{t("Usage of SQL query result is not supported yet.", { ns: "${NAMESPACE}" })}}`,
+      'x-decorator': 'FormItem',
+      'x-component': 'SQLInput',
+      'x-component-props': {
+        rows: 20,
+        className: css`
+          font-size: 80%;
+          font-family: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace;
+        `,
+      },
+    },
+  },
+  scope: {},
+  components: {
+    SQLInput(props) {
+      const scope = useWorkflowVariableOptions();
+      return <Variable.RawTextArea scope={scope} {...props} />;
+    },
+  },
+};