- {
- // Displays a warning icon at the left of the node's title (using css float to avoid break line)
- !isReachable && (
-
- alert(`This node is not reachable because there are no edge connected to its entry port.`)}
- />
-
- )
- }
-
{
// Invoke the children as a function, or render the children as a component, if it's not a function
// @ts-ignore
diff --git a/src/components/nodes/EndNode.tsx b/src/components/nodes/EndNode.tsx
new file mode 100644
index 0000000..3719843
--- /dev/null
+++ b/src/components/nodes/EndNode.tsx
@@ -0,0 +1,84 @@
+import { css } from '@emotion/react';
+import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
+import React, { Fragment } from 'react';
+import settings from '../../settings';
+import BaseNodeComponent from '../../types/BaseNodeComponent';
+import { BaseNodeDefaultProps } from '../../types/BaseNodeDefaultProps';
+import BaseNodeProps from '../../types/BaseNodeProps';
+import BasePortData from '../../types/BasePortData';
+import { SpecializedNodeProps } from '../../types/nodes/SpecializedNodeProps';
+import { StartNodeData } from '../../types/nodes/StartNodeData';
+import NodeType from '../../types/NodeType';
+import { createPort } from '../../utils/ports';
+import BaseNode from './BaseNode';
+
+type Props = {} & BaseNodeProps
;
+
+const nodeType: NodeType = 'end';
+const defaultWidth = 100;
+const defaultHeight = 100;
+
+/**
+ * End node.
+ *
+ * Used to define the workflow's finish line.
+ * Is unique, there can be only one EndNode, and it's required and must always be present.
+ *
+ * Displays an end icon.
+ * Has only one west port.
+ */
+const EndNode: BaseNodeComponent = (props) => {
+ return (
+
+ {
+ (nodeProps: SpecializedNodeProps) => {
+ return (
+
+
+
+
+
+ );
+ }
+ }
+
+ );
+};
+
+EndNode.getDefaultPorts = (): BasePortData[] => {
+ return [
+ createPort({
+ height: settings.canvas.ports.radius,
+ width: settings.canvas.ports.radius,
+ alignment: 'CENTER',
+ side: 'WEST',
+ }),
+ ];
+};
+
+EndNode.getDefaultNodeProps = (): BaseNodeDefaultProps => {
+ return {
+ type: nodeType,
+ defaultWidth: defaultWidth,
+ defaultHeight: defaultHeight,
+ // @ts-ignore
+ ports: EndNode.getDefaultPorts(),
+ };
+};
+
+export default EndNode;
diff --git a/src/components/nodes/StartNode.tsx b/src/components/nodes/StartNode.tsx
index eab75b4..ff15d9d 100644
--- a/src/components/nodes/StartNode.tsx
+++ b/src/components/nodes/StartNode.tsx
@@ -42,15 +42,14 @@ const StartNode: BaseNodeComponent = (props) => {
className={`node-content ${nodeType}-content`}
css={css`
svg {
- margin: 10px;
- margin-left: 15px;
- color: lime;
+ margin: 20px;
+ color: #2EC52B;
}
`}
>