Inject entry/exit actions for state plugins (#141)

* chore(version control): init commit for wip pr

* feat(package.json): added rimraf and a clean command for the build directory

* feat(package.json): now running pnpm clean before pnpm build

* fix(rollup.config.ts): removed the dts plugin from esm and cjs configs

otherwise there's no index.js in the output

* refactor(statecharts.ts): removed previous implementation of statePlugins

* fix(statecharts.ts): entry/exit actions injection now uses a set to avoid duplicates

* feat(statecharts.ts): added the ability to pass actions from outside into createMachine

now statePlugins are injected to a state's exit/entry as an array with unique values

* chore(changesets): added a changeset for latest changes

* ci(vite timestamp): removed vite.config.ts.timestamp file from remote

.changeset/afraid-jokes-matter.md

@@ -0,0 +1,5 @@
+---
+'@ballerine/workflow-core': patch
+---
+
+fixed entry/exit plugins outputting duplicate actions

.changeset/red-boats-do.md

@@ -0,0 +1,5 @@
+---
+'@ballerine/workflow-core': patch
+---
+
+removed previous implementation of statePlugins

.changeset/yellow-onions-cross.md

@@ -0,0 +1,5 @@
+---
+'@ballerine/workflow-core': patch
+---
+
+added state plugins, actions which runs on exit or entry of a state

packages/workflow-core/package.json

@@ -18,8 +18,10 @@
   "license": "Apache-2.0",
   "keywords": [],
   "scripts": {
-    "bundle": "rollup --config rollup.config.js",
-    "build:main": "tsc -p tsconf.dev.json",
+    "clean": "rimraf ./build",
+    "build": "pnpm clean && rollup --config rollup.config.js",
+    "watch": "tsc -w",
+    "dev": "concurrently --kill-others \"pnpm build -w\" \"pnpm watch\"",
     "test": "vitest run"
   },
   "engines": {
@@ -45,6 +47,7 @@
     "@typescript-eslint/eslint-plugin": "^5.48.1",
     "@typescript-eslint/parser": "^5.48.1",
     "@vitest/coverage-istanbul": "^0.28.4",
+    "concurrently": "^7.6.0",
     "cz-conventional-changelog": "^3.3.0",
     "eslint": "^8.32.0",
     "eslint-config-prettier": "^6.11.0",
@@ -55,6 +58,7 @@
     "plugin-babel": "link:@types/@rollup/plugin-babel",
     "plugin-terser": "link:@types/@rollup/plugin-terser",
     "prettier": "^2.1.1",
+    "rimraf": "^4.1.2",
     "rollup": "2.70.2",
     "rollup-plugin-dts": "4.2.2",
     "rollup-plugin-size": "0.2.2",
@@ -64,4 +68,4 @@
     "vite": "^4.1.1",
     "vitest": "^0.28.4"
   }
-}
+}

packages/workflow-core/rollup.config.ts

@@ -100,7 +100,7 @@ function esm({ input, packageDir, external, banner }: Options): RollupOptions {
       banner,
       preserveModules: true,
     },
-    plugins: [babelPlugin, nodeResolve({ extensions: ['.ts'] }), dts()],
+    plugins: [babelPlugin, nodeResolve({ extensions: ['.ts'] })],
   };
 }
 
@@ -117,7 +117,7 @@ function cjs({ input, external, packageDir, banner }: Options): RollupOptions {
       exports: 'named',
       banner,
     },
-    plugins: [babelPlugin, commonjs(), nodeResolve({ extensions: ['.ts'] }),dts()],
+    plugins: [babelPlugin, commonjs(), nodeResolve({ extensions: ['.ts'] })],
   };
 }
 
@@ -144,7 +144,6 @@ function umdDev({
       commonjs(),
       nodeResolve({ extensions: ['.ts'] }),
       umdDevPlugin('development'),
-      dts()
     ],
   };
 }

packages/workflow-core/src/index.ts

@@ -1,4 +1,4 @@
-import { MachineConfig } from 'xstate';
+import {MachineConfig, MachineOptions} from 'xstate';
 import { WorkflowRunner } from './lib/statecharts';
 
 export * from './lib/statecharts';
@@ -26,7 +26,20 @@ interface WorkflowPlugin {
   }) => Promise<void>;
 }
 
-interface StatePlugin extends WorkflowPlugin {
+interface StatePlugin extends Omit<WorkflowPlugin, 'when'> {
+  /**
+   * The actions key to inject an action function into.
+   * E.g. { actions: { [plugin.name]: plugin.action  } }
+   */
+  name: string;
+  /**
+   * entry - fire an action when transitioning into a specified state
+   * exit  - fire an action when transitioning out of a specified state
+   */
+  when: 'entry' | 'exit';
+  /**
+   * States already defined in the statechart
+   */
   stateNames: Array<string>;
 }
 
@@ -53,6 +66,7 @@ export interface WorkflowExtensions {
 export interface WorkflowOptions {
   workflowDefinitionType: 'statechart-json' | 'bpmn-json';
   workflowDefinition: MachineConfig<any, any, any>;
+  workflowActions?: MachineOptions<any, any>['actions'];
   context?: WorkflowContext;
   extensions?: WorkflowExtensions;
 }
@@ -61,10 +75,12 @@ type TCreateWorkflow = (options: WorkflowOptions) => Workflow;
 
 export const createWorkflow: TCreateWorkflow = ({
   workflowDefinition,
+  workflowActions,
   extensions,
 }) =>
   new WorkflowRunner({
     workflowDefinition,
+    workflowActions,
     context: {},
     extensions,
   });

packages/workflow-core/src/lib/statecharts.spec.ts

@@ -37,8 +37,9 @@ test('Basic workflow sanity test', async () => {
     extensions: {
       statePlugins: [
         {
+          name: 'activeAction',
           stateNames: ['active'],
-          when: 'pre',
+          when: 'exit',
           // import: '@ballerine/plugins/core/validate@0.2.34',
           // import: '@ballerine/plugins/browser/validate@0.2.34',
           // import: '@ballerine/plugins/node/validate@0.2.34',
@@ -48,8 +49,9 @@ test('Basic workflow sanity test', async () => {
           },
         },
         {
+          name: 'inactiveAction',
           stateNames: ['inactive'],
-          when: 'post',
+          when: 'exit',
           action: ({context, event, currentState}) => {
             console.log('state post action');
             return Promise.resolve();

packages/workflow-core/src/lib/statecharts.ts

@@ -1,4 +1,11 @@
-import {createMachine, interpret, MachineConfig, StateMachine} from 'xstate';
+import {
+  ActionFunction,
+  createMachine,
+  interpret,
+  MachineConfig,
+  MachineOptions,
+  StateMachine
+} from 'xstate';
 import * as jsonLogic from 'json-logic-js';
 
 import {
@@ -9,6 +16,7 @@ import {
 
 interface WorkflowRunnerArgs {
   workflowDefinition: MachineConfig<any, any, any>;
+  workflowActions?: MachineOptions<any, any>['actions'];
   context: any;
   state?: string;
   extensions?: WorkflowExtensions;
@@ -33,10 +41,20 @@ export class WorkflowRunner {
   }
 
   constructor(
-    {workflowDefinition, context = {}, state, extensions}: WorkflowRunnerArgs,
+    {
+      workflowDefinition,
+      workflowActions,
+      context = {},
+      state,
+      extensions
+    }: WorkflowRunnerArgs,
     debugMode = true
   ) {
-    this.#__workflow = this.#__extendedWorkflow(workflowDefinition);
+    this.#__workflow = this.#__extendedWorkflow({
+      workflow: workflowDefinition,
+      workflowActions,
+      extensions
+    });
 
     // use initial context or provided context
     this.#__context = Object.keys(context).length
@@ -51,32 +69,74 @@ export class WorkflowRunner {
     this.#__debugMode = debugMode;
   }
 
-  #__extendedWorkflow(workflow: any) {
+  #__extendedWorkflow({
+                        workflow,
+                        workflowActions,
+                        extensions = {
+                          statePlugins: [],
+                          globalPlugins: [],
+                        }
+                      }: {
+    workflow: any;
+    workflowActions?: WorkflowRunnerArgs['workflowActions'];
+    extensions?: WorkflowExtensions;
+  }) {
     const extended = workflow;
     const onEnter = ['ping'];
     const onExit = ['pong'];
+    const stateActions: Record<string, ActionFunction<any, any>> = {};
 
     for (const state in extended.states) {
-      extended.states[state].entry = onEnter.concat(
-        workflow.states[state].entry || [],
-        onEnter
+
+      extended.states[state].entry = Array.from(
+        new Set([
+          ...(workflow.states[state].entry ?? []),
+          ...onEnter
+        ])
       );
-      extended.states[state].exit = onExit.concat(
-        workflow.states[state].exit || [],
-        onExit
+
+      extended.states[state].exit = Array.from(
+        new Set([
+          ...(workflow.states[state].exit ?? []),
+          ...onExit
+        ])
       );
+
+
     }
 
-    const actions = {
+    for (const statePlugin of extensions.statePlugins) {
+
+      for (const stateName of statePlugin.stateNames) {
+
+        // E.g { state: { entry: [...,plugin.name] } }
+        extended.states[stateName][statePlugin.when] = Array.from(
+          new Set(
+            [
+              ...extended.states[stateName][statePlugin.when],
+              statePlugin.name
+            ]
+          ));
+
+        // { actions: { persist: action } }
+        stateActions[statePlugin.name] = statePlugin.action;
+      }
+
+    }
+
+    const actions: MachineOptions<any, any>['actions'] = {
+      ...workflowActions,
+      ...stateActions,
       ping: (...rest: any[]) => {
         console.log('Global state entry handler');
       },
       pong: (...rest: any[]) => {
         console.log('Global state exit handler');
       },
     };
-    const guards = {
-      'json-rule': (ctx: any, {payload}: any, {cond}: any) => {
+
+    const guards: MachineOptions<any, any>['guards'] = {
+      'json-rule': (ctx, {payload}, {cond}) => {
         const data = {...ctx, ...payload};
         return jsonLogic.apply(
           cond.name, // Rule
@@ -123,19 +183,6 @@ export class WorkflowRunner {
     // all sends() will be deferred until the workflow is started
     service.start();
 
-    for (const ext of this.#__extensions.statePlugins) {
-      if (
-        ext.when !== 'pre' ||
-        !ext.stateNames?.includes(this.#__currentState)
-      ) continue;
-
-      await ext.action({
-        context: service.getSnapshot().context,
-        event,
-        currentState: this.#__currentStateNode
-      });
-    }
-
     for (const ext of this.#__extensions.globalPlugins) {
       if (ext.when == 'pre') {
         await ext.action({
@@ -151,19 +198,6 @@ export class WorkflowRunner {
       console.log('context:', this.#__context);
     }
 
-    for (const ext of this.#__extensions.statePlugins) {
-      if (
-        ext.when !== 'post' ||
-        !ext.stateNames?.includes(this.#__currentState)
-      ) continue;
-
-      await ext.action({
-        context: service.getSnapshot().context,
-        event,
-        currentState: this.#__currentStateNode
-      });
-    }
-
     for (const ext of this.#__extensions.globalPlugins) {
       if (ext.when == 'post') {
         await ext.action({