SOF-7756-1: Units + ContextProveders Typescript

package.json

@@ -6,9 +6,10 @@
         "test": "nyc --reporter=text mocha --recursive --bail --require @babel/register/lib --require tests/js/setup.js tests/js",
         "lint": "eslint src/js tests/js && prettier --write src/js tests/js",
         "lint:fix": "eslint --fix --cache src/js tests/js && prettier --write src/js tests/js",
-        "transpile": "babel --out-dir dist/js src/js",
+        "transpile": "tsc --project tsconfig.json",
         "prettier": "prettier --check src/js tests/js",
-        "prepare": "husky install || exit 0"
+        "prepare": "husky install || exit 0",
+        "generate-mixins": "ts-node scripts/generate-mixins.ts"
     },
     "repository": {
         "type": "git",
@@ -29,44 +30,46 @@
     "license": "Apache-2.0",
     "homepage": "https://github.com/Exabyte-io/wode",
     "dependencies": {
-        "@babel/cli": "7.16.0",
-        "@babel/core": "7.16.0",
-        "@babel/eslint-parser": "7.16.3",
-        "@babel/plugin-proposal-class-properties": "7.16.0",
-        "@babel/preset-env": "7.16.4",
-        "@babel/preset-react": "7.16.7",
-        "@babel/register": "^7.16.0",
-        "@babel/runtime-corejs3": "7.16.8",
         "@exabyte-io/periodic-table.js": "2022.6.8-0",
+        "@types/json-schema": "^7.0.15",
+        "@types/nunjucks": "^3.2.6",
+        "@types/react-jsonschema-form": "^1.7.13",
         "crypto-js": "^4.2.0",
         "js-yaml": "^4.1.0",
         "lodash": "^4.17.21",
         "mixwith": "^0.1.1",
+        "nunjucks": "^3.2.4",
+        "ts-node": "^10.9.2",
+        "typescript": "^5.6.6",
         "underscore": "^1.13.3",
         "underscore.string": "^3.3.4",
         "v20": "^0.1.0"
     },
     "devDependencies": {
-        "@mat3ra/ade": "2025.11.26-0",
         "@exabyte-io/eslint-config": "2025.5.13-0",
+        "@mat3ra/ade": "git+https://github.com/Exabyte-io/ade#6d494337d83e1b22fe272ff74cc1b6842a7c6561",
+        "@mat3ra/code": "git+https://github.com/Exabyte-io/code.git#cb3fa59e2cc143d744f9019322208d928ff8de88",
+        "@mat3ra/esse": "git+https://github.com/Exabyte-io/esse#b324747a87f4b3363936974f512e75fe255b52a9",
         "@mat3ra/ide": "2025.11.19-0",
+        "@mat3ra/made": "git+https://github.com/Exabyte-io/made.git#47b3e12a859c45fa72079ed4ddd1675a6a32b4fe",
         "@mat3ra/mode": "2025.11.13-0",
-        "@mat3ra/utils": "2025.9.20-0",
-        "@mat3ra/code": "2025.10.24-0",
-        "@mat3ra/esse": "2025.11.26-0",
-        "@mat3ra/made": "2025.7.15-0",
         "@mat3ra/standata": "2026.1.12-0",
+        "@mat3ra/tsconfig": "^2024.6.3-0",
+        "@mat3ra/utils": "2025.9.20-0",
         "chai": "^4.3.4",
-        "eslint": "7.32.0",
-        "eslint-config-airbnb": "19.0.2",
+        "eslint": "^7.32.0",
+        "eslint-config-airbnb": "^19.0.2",
         "eslint-config-prettier": "^8.5.0",
-        "eslint-import-resolver-exports": "^1.0.0-beta.2",
-        "eslint-plugin-import": "2.25.3",
-        "eslint-plugin-jsdoc": "37.1.0",
-        "eslint-plugin-jsx-a11y": "6.5.1",
+        "eslint-import-resolver-exports": "^1.0.0-beta.5",
+        "eslint-import-resolver-meteor": "^0.4.0",
+        "eslint-import-resolver-node": "^0.3.9",
+        "eslint-plugin-import": "^2.25.3",
+        "eslint-plugin-jsdoc": "^37.1.0",
+        "eslint-plugin-jsx-a11y": "^6.5.1",
+        "eslint-plugin-mui-path-imports": "0.0.15",
         "eslint-plugin-prettier": "^4.2.1",
-        "eslint-plugin-react": "7.30.0",
-        "eslint-plugin-simple-import-sort": "7.0.0",
+        "eslint-plugin-react": "^7.30.0",
+        "eslint-plugin-simple-import-sort": "^7.0.0",
         "husky": "^7.0.4",
         "lint-staged": "^12.1.2",
         "mocha": "^9.1.3",
@@ -75,19 +78,25 @@
     },
     "peerDependencies": {
         "@mat3ra/ade": "*",
+        "@mat3ra/code": "*",
+        "@mat3ra/esse": "*",
         "@mat3ra/ide": "*",
+        "@mat3ra/made": "*",
         "@mat3ra/mode": "*",
         "@mat3ra/standata": "*",
-        "@mat3ra/utils": "*",
-        "@mat3ra/code": "*",
-        "@mat3ra/esse": "*",
-        "@mat3ra/made": "*"
+        "@mat3ra/utils": "*"
     },
     "engines": {
         "node": ">=20.0.0"
     },
     "lint-staged": {
-        "src/js/**/*.js": ["eslint --cache --fix", "prettier --write"],
-        "tests/js/**/*.js": ["eslint --cache --fix", "prettier --write"]
+        "src/js/**/*.js": [
+            "eslint --cache --fix",
+            "prettier --write"
+        ],
+        "tests/js/**/*.js": [
+            "eslint --cache --fix",
+            "prettier --write"
+        ]
     }
 }

scripts/generate-mixins.ts

@@ -0,0 +1,46 @@
+#!/usr/bin/env node
+
+/**
+ * Script to generate mixin properties from JSON schema
+ *
+ * This script generates mixin functions for property/holder, property/meta_holder,
+ * and property/proto_holder schemas automatically.
+ *
+ * Usage:
+ *   npx ts-node scripts/generate-mixin-properties.ts
+ */
+
+import generateSchemaMixin from "@mat3ra/code/dist/js/generateSchemaMixin";
+import allSchemas from "@mat3ra/esse/dist/js/schemas.json";
+import type { JSONSchema7 } from "json-schema";
+
+/**
+ * Output file paths for each schema
+ */
+const OUTPUT_PATHS = {
+    "workflow/unit/mixins/base": "src/js/generated/BaseUnitSchemaMixin.ts",
+    "system/status": "src/js/generated/StatusSchemaMixin.ts",
+    "workflow/unit/mixins/assertion": "src/js/generated/AssertionUnitSchemaMixin.ts",
+    "workflow/unit/mixins/assignment": "src/js/generated/AssignmentUnitSchemaMixin.ts",
+    "workflow/unit/mixins/condition": "src/js/generated/ConditionUnitSchemaMixin.ts",
+    "workflow/unit/mixins/execution": "src/js/generated/ExecutionUnitSchemaMixin.ts",
+    "workflow/unit/mixins/io": "src/js/generated/IOUnitSchemaMixin.ts",
+    "workflow/unit/mixins/map": "src/js/generated/MapUnitSchemaMixin.ts",
+    "workflow/unit/mixins/processing": "src/js/generated/ProcessingUnitSchemaMixin.ts",
+    "workflow/unit/mixins/reduce": "src/js/generated/ReduceUnitSchemaMixin.ts",
+    "workflow/unit/mixins/subworkflow": "src/js/generated/SubworkflowUnitSchemaMixin.ts",
+    "workflow/unit/input/-inputItem": "src/js/generated/ExecutionUnitInputSchemaMixin.ts",
+    "workflow/subworkflow/mixin": "src/js/generated/SubworkflowSchemaMixin.ts",
+};
+
+function main() {
+    // Type assertion to handle schema compatibility - the schemas from esse may have slightly different types
+    const result = generateSchemaMixin(allSchemas as JSONSchema7[], OUTPUT_PATHS);
+
+    if (result.errorCount > 0) {
+        process.exit(1);
+    }
+}
+
+// Run the script if it's executed directly
+main();

src/js/ExecutionUnitInput.ts

@@ -0,0 +1,89 @@
+import { Template } from "@mat3ra/ade";
+import { InMemoryEntity } from "@mat3ra/code/dist/js/entity";
+import type { Constructor } from "@mat3ra/code/dist/js/utils/types";
+import JSONSchemasInterface from "@mat3ra/esse/dist/js/esse/JSONSchemasInterface";
+import type { AnyObject } from "@mat3ra/esse/dist/js/esse/types";
+import type { TemplateSchema } from "@mat3ra/esse/dist/js/types";
+import nunjucks from "nunjucks";
+
+import { providers } from "./context/providers";
+import type { ContextItem, ContextProviderConfig } from "./context/providers/base/ContextProvider";
+import type ContextProvider from "./context/providers/base/ContextProvider";
+import type { ExecutionUnitInputSchemaMixin } from "./generated/ExecutionUnitInputSchemaMixin";
+
+type Schema = ExecutionUnitInputSchemaMixin;
+
+type Base = typeof InMemoryEntity & Constructor<ExecutionUnitInputSchemaMixin>;
+
+type ConstructorConfig = Schema | (Omit<Schema, "template"> & { template: Template });
+
+export default class ExecutionUnitInput extends (InMemoryEntity as Base) implements Schema {
+    declare _json: Schema & AnyObject;
+
+    declare toJSON: () => Schema & AnyObject;
+
+    declare toJSONQuick: () => Schema & AnyObject;
+
+    static get jsonSchema() {
+        return JSONSchemasInterface.getSchemaById("workflow/unit/input/-inputItem");
+    }
+
+    contextProvidersInstances: ContextProvider[] = [];
+
+    readonly templateInstance: Template;
+
+    static createFromTemplate(template: Template | TemplateSchema) {
+        return new ExecutionUnitInput({
+            template,
+            rendered: template.content,
+            isManuallyChanged: false,
+        });
+    }
+
+    constructor(config: ConstructorConfig) {
+        const { template } = config;
+        const templateInstance = template instanceof Template ? template : new Template(template);
+
+        super({ ...config, template: templateInstance.toJSON() });
+
+        this.templateInstance = templateInstance;
+    }
+
+    setContext(context: ContextItem[]) {
+        this.contextProvidersInstances = this.template.contextProviders.map(({ name }) => {
+            if (!providers) {
+                throw new Error("Providers config not set");
+            }
+
+            const ContextProvider = providers[name as keyof typeof providers];
+            const contextItem = context.find((c) => c.name === name);
+
+            if (!contextItem) {
+                throw new Error(`Context item for provider ${name} not found`);
+            }
+
+            return new ContextProvider(contextItem);
+        });
+
+        return this;
+    }
+
+    render() {
+        if (this.isManuallyChanged) {
+            return this;
+        }
+
+        const fullContext = this.getFullContext();
+        const rendered = nunjucks.compile(this.template.content).render(fullContext);
+
+        this.rendered = rendered || this.template.content;
+
+        return this;
+    }
+
+    getFullContext() {
+        return this.contextProvidersInstances.map((contextProvider) => {
+            return contextProvider.getContextItem();
+        });
+    }
+}

src/js/RuntimeItemsUILogicMixin.ts

@@ -0,0 +1,87 @@
+import type { InMemoryEntity } from "@mat3ra/code/dist/js/entity";
+import type { RuntimeItems } from "@mat3ra/code/dist/js/entity/mixins/RuntimeItemsMixin";
+import type { NameResultSchema } from "@mat3ra/code/dist/js/utils/object";
+import type { RuntimeItemsSchema } from "@mat3ra/esse/dist/js/types";
+
+type ItemKey = "results" | "monitors" | "preProcessors" | "postProcessors";
+
+export type RuntimeItemsUILogic = {
+    setRuntimeItemsToDefaultValues(): void;
+    _initRuntimeItems(config?: Partial<RuntimeItemsSchema>): void;
+    toggleRuntimeItem(key: ItemKey, data: NameResultSchema, isAdding: boolean): void;
+    toggleResult(data: NameResultSchema, isAdding: boolean): void;
+    toggleMonitor(data: NameResultSchema, isAdding: boolean): void;
+    togglePreProcessor(data: NameResultSchema, isAdding: boolean): void;
+    togglePostProcessor(data: NameResultSchema, isAdding: boolean): void;
+    getResultByName(name: string): NameResultSchema | undefined;
+    get resultNames(): string[];
+    get monitorNames(): string[];
+    get postProcessorNames(): string[];
+    get preProcessorNames(): string[];
+};
+
+type RuntimeItemsUILogicPrivate = {
+    toggleRuntimeItem(key: ItemKey, data: NameResultSchema, isAdding: boolean): void;
+};
+
+type Base = InMemoryEntity &
+    RuntimeItems & {
+        defaultResults: NameResultSchema[];
+        defaultMonitors: NameResultSchema[];
+        defaultPreProcessors: NameResultSchema[];
+        defaultPostProcessors: NameResultSchema[];
+    };
+
+// @ts-expect-error
+const propertiesMixn: Base & RuntimeItemsUILogic & RuntimeItemsUILogicPrivate = {
+    setRuntimeItemsToDefaultValues() {
+        this.results = this.defaultResults;
+        this.monitors = this.defaultMonitors;
+        this.preProcessors = this.defaultPreProcessors;
+        this.postProcessors = this.defaultPostProcessors;
+    },
+    _initRuntimeItems(config) {
+        this.results = config?.results || this.defaultResults;
+        this.monitors = config?.monitors || this.defaultMonitors;
+        this.preProcessors = config?.preProcessors || this.defaultPreProcessors;
+        this.postProcessors = config?.postProcessors || this.defaultPostProcessors;
+    },
+    toggleRuntimeItem(key: ItemKey, data: NameResultSchema, isAdding: boolean) {
+        if (isAdding) {
+            this[key] = [...this[key], data];
+        } else {
+            this[key] = this[key].filter((x) => x.name !== data.name);
+        }
+    },
+    toggleResult(data: NameResultSchema, isAdding: boolean) {
+        this.toggleRuntimeItem("results", data, isAdding);
+    },
+    toggleMonitor(data: NameResultSchema, isAdding: boolean) {
+        this.toggleRuntimeItem("monitors", data, isAdding);
+    },
+    togglePreProcessor(data: NameResultSchema, isAdding: boolean) {
+        this.toggleRuntimeItem("preProcessors", data, isAdding);
+    },
+    togglePostProcessor(data: NameResultSchema, isAdding: boolean) {
+        this.toggleRuntimeItem("postProcessors", data, isAdding);
+    },
+    get resultNames() {
+        return this.results.map((r) => r.name);
+    },
+    get monitorNames() {
+        return this.monitors.map((r) => r?.name);
+    },
+    get postProcessorNames() {
+        return this.postProcessors.map((r) => r.name);
+    },
+    get preProcessorNames() {
+        return this.preProcessors.map((r) => r.name);
+    },
+    getResultByName(name: string) {
+        return this.results.find((r) => r.name === name);
+    },
+};
+
+export function runtimeItemsUILogicMixin<T extends Base>(item: T) {
+    Object.defineProperties(item, Object.getOwnPropertyDescriptors(propertiesMixn));
+}