Skip to content

feat:integrate orkes-workflow-visualizer #290

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom
Merged
merged 3 commits into from
Nov 25, 2024
Merged

feat:integrate orkes-workflow-visualizer #290

merged 3 commits into from
Nov 25, 2024

Conversation

najeebkp
Copy link
Contributor

Pull Request type

  • Bugfix
  • Feature
  • Refactoring (no functional changes, no api changes)
  • Build related changes
  • WHOSUSING.md
  • Other (please describe):

NOTE: Please remember to run ./gradlew spotlessApply to fix any format violations.

Changes in this PR

Describe the new behavior from this PR, and why it's needed

  • Upgraded react version to v18.3.1
  • Integrated orkes-workflow-visualizer library to render the workflow definition and execution diagrams.

Screenshots
Screenshot 2024-10-16 at 10 58 17 AM
Screenshot 2024-10-16 at 10 58 37 AM

Alternatives considered

Describe alternative implementation you have considered

@Sudakatux
Copy link
Contributor

found a bug.
create a workflow with the following definition:

{
  "ownerApp": "",
  "createTime": 1732033317471,
  "updateTime": 1732033317849,
  "status": "COMPLETED",
  "endTime": 1732033317849,
  "workflowId": "becec3ac-6e56-4446-8e57-dbcaa433ea2b",
  "tasks": [
    {
      "taskType": "INLINE",
      "status": "COMPLETED",
      "inputData": {
        "evaluatorType": "javascript",
        "expression": "(function () {\n  return $.value1 + $.value2;\n})();",
        "value2": 2,
        "value1": 2
      },
      "referenceTaskName": "inline_ref_1",
      "retryCount": 0,
      "seq": 1,
      "pollCount": 0,
      "taskDefName": "inline_2",
      "scheduledTime": 1732033317482,
      "startTime": 1732033317482,
      "endTime": 1732033317770,
      "updateTime": 1732033317483,
      "startDelayInSeconds": 0,
      "retried": false,
      "executed": true,
      "callbackFromWorker": true,
      "responseTimeoutSeconds": 0,
      "workflowInstanceId": "becec3ac-6e56-4446-8e57-dbcaa433ea2b",
      "workflowType": "http_asdasd",
      "taskId": "7b2d6dc8-b04e-4af2-a31a-1654e8ad6a8f",
      "callbackAfterSeconds": 0,
      "outputData": {
        "result": 4
      },
      "workflowTask": {
        "name": "inline_2",
        "taskReferenceName": "inline_ref_1",
        "inputParameters": {
          "expression": "(function () {\n  return $.value1 + $.value2;\n})();",
          "evaluatorType": "javascript",
          "value1": 2,
          "value2": 2
        },
        "type": "INLINE",
        "decisionCases": {},
        "defaultCase": [],
        "forkTasks": [],
        "startDelay": 0,
        "joinOn": [],
        "optional": false,
        "defaultExclusiveJoinTask": [],
        "asyncComplete": false,
        "loopOver": [],
        "onStateChange": {},
        "permissive": false
      },
      "rateLimitPerFrequency": 0,
      "rateLimitFrequencyInSeconds": 0,
      "workflowPriority": 0,
      "iteration": 0,
      "subworkflowChanged": false,
      "loopOverTask": false,
      "queueWaitTime": 0,
      "taskDefinition": null
    },
    {
      "taskType": "DO_WHILE",
      "status": "COMPLETED",
      "inputData": {
        "myArray": [
          {
            "name": "Orkes"
          },
          {
            "year": 2024
          }
        ]
      },
      "referenceTaskName": "do_while_ref",
      "retryCount": 0,
      "seq": 2,
      "pollCount": 0,
      "taskDefName": "do_while",
      "scheduledTime": 1732033317778,
      "startTime": 1732033317778,
      "endTime": 1732033317843,
      "updateTime": 1732033317828,
      "startDelayInSeconds": 0,
      "retried": false,
      "executed": false,
      "callbackFromWorker": true,
      "responseTimeoutSeconds": 0,
      "workflowInstanceId": "becec3ac-6e56-4446-8e57-dbcaa433ea2b",
      "workflowType": "http_asdasd",
      "taskId": "27645cc5-867b-48c5-8402-dfa160bfa9e0",
      "callbackAfterSeconds": 0,
      "outputData": {
        "1": {
          "inline_ref": {
            "result": 3
          }
        },
        "2": {
          "inline_ref": {
            "result": 3
          }
        },
        "iteration": 2
      },
      "workflowTask": {
        "name": "do_while",
        "taskReferenceName": "do_while_ref",
        "inputParameters": {
          "myArray": [
            {
              "name": "Orkes"
            },
            {
              "year": 2024
            }
          ]
        },
        "type": "DO_WHILE",
        "decisionCases": {},
        "defaultCase": [],
        "forkTasks": [],
        "startDelay": 0,
        "joinOn": [],
        "optional": false,
        "defaultExclusiveJoinTask": [],
        "asyncComplete": false,
        "loopCondition": "(function () {\n  if ($.do_while_ref['iteration'] < $.myArray.length) {\n    return true;\n  }\n  return false;\n})();",
        "loopOver": [
          {
            "name": "inline",
            "taskReferenceName": "inline_ref",
            "inputParameters": {
              "expression": "(function () {\n  return $.value1 + $.value2;\n})();",
              "evaluatorType": "javascript",
              "value1": 1,
              "value2": 2
            },
            "type": "INLINE",
            "decisionCases": {},
            "defaultCase": [],
            "forkTasks": [],
            "startDelay": 0,
            "joinOn": [],
            "optional": false,
            "defaultExclusiveJoinTask": [],
            "asyncComplete": false,
            "loopOver": [],
            "onStateChange": {},
            "permissive": false
          }
        ],
        "evaluatorType": "graaljs",
        "onStateChange": {},
        "permissive": false
      },
      "rateLimitPerFrequency": 0,
      "rateLimitFrequencyInSeconds": 1,
      "workflowPriority": 0,
      "iteration": 2,
      "subworkflowChanged": false,
      "loopOverTask": true,
      "queueWaitTime": 0,
      "taskDefinition": null
    },
    {
      "taskType": "INLINE",
      "status": "COMPLETED",
      "inputData": {
        "evaluatorType": "javascript",
        "expression": "(function () {\n  return $.value1 + $.value2;\n})();",
        "value2": 2,
        "value1": 1
      },
      "referenceTaskName": "inline_ref__1",
      "retryCount": 0,
      "seq": 3,
      "pollCount": 0,
      "taskDefName": "inline",
      "scheduledTime": 1732033317785,
      "startTime": 1732033317785,
      "endTime": 1732033317801,
      "updateTime": 1732033317786,
      "startDelayInSeconds": 0,
      "retried": false,
      "executed": true,
      "callbackFromWorker": true,
      "responseTimeoutSeconds": 0,
      "workflowInstanceId": "becec3ac-6e56-4446-8e57-dbcaa433ea2b",
      "workflowType": "http_asdasd",
      "taskId": "8e86cddf-8ca1-4917-b6c2-247f278abad4",
      "callbackAfterSeconds": 0,
      "outputData": {
        "result": 3
      },
      "workflowTask": {
        "name": "inline",
        "taskReferenceName": "inline_ref",
        "inputParameters": {
          "expression": "(function () {\n  return $.value1 + $.value2;\n})();",
          "evaluatorType": "javascript",
          "value1": 1,
          "value2": 2
        },
        "type": "INLINE",
        "decisionCases": {},
        "defaultCase": [],
        "forkTasks": [],
        "startDelay": 0,
        "joinOn": [],
        "optional": false,
        "defaultExclusiveJoinTask": [],
        "asyncComplete": false,
        "loopOver": [],
        "onStateChange": {},
        "permissive": false
      },
      "rateLimitPerFrequency": 0,
      "rateLimitFrequencyInSeconds": 0,
      "workflowPriority": 0,
      "iteration": 1,
      "subworkflowChanged": false,
      "loopOverTask": true,
      "queueWaitTime": 0,
      "taskDefinition": null
    },
    {
      "taskType": "INLINE",
      "status": "COMPLETED",
      "inputData": {
        "evaluatorType": "javascript",
        "expression": "(function () {\n  return $.value1 + $.value2;\n})();",
        "value2": 2,
        "value1": 1
      },
      "referenceTaskName": "inline_ref__2",
      "retryCount": 0,
      "seq": 4,
      "pollCount": 0,
      "taskDefName": "inline",
      "scheduledTime": 1732033317818,
      "startTime": 1732033317818,
      "endTime": 1732033317834,
      "updateTime": 1732033317818,
      "startDelayInSeconds": 0,
      "retried": false,
      "executed": true,
      "callbackFromWorker": true,
      "responseTimeoutSeconds": 0,
      "workflowInstanceId": "becec3ac-6e56-4446-8e57-dbcaa433ea2b",
      "workflowType": "http_asdasd",
      "taskId": "44ffb76d-0850-4704-a2b2-fed0963923ba",
      "callbackAfterSeconds": 0,
      "outputData": {
        "result": 3
      },
      "workflowTask": {
        "name": "inline",
        "taskReferenceName": "inline_ref",
        "inputParameters": {
          "expression": "(function () {\n  return $.value1 + $.value2;\n})();",
          "evaluatorType": "javascript",
          "value1": 1,
          "value2": 2
        },
        "type": "INLINE",
        "decisionCases": {},
        "defaultCase": [],
        "forkTasks": [],
        "startDelay": 0,
        "joinOn": [],
        "optional": false,
        "defaultExclusiveJoinTask": [],
        "asyncComplete": false,
        "loopOver": [],
        "onStateChange": {},
        "permissive": false
      },
      "rateLimitPerFrequency": 0,
      "rateLimitFrequencyInSeconds": 0,
      "workflowPriority": 0,
      "iteration": 2,
      "subworkflowChanged": false,
      "loopOverTask": true,
      "queueWaitTime": 0,
      "taskDefinition": null
    }
  ],
  "input": {},
  "output": {
    "result": 3
  },
  "taskToDomain": {},
  "failedReferenceTaskNames": [],
  "workflowDefinition": {
    "createTime": 1732033182842,
    "updateTime": 1732033307187,
    "name": "http_asdasd",
    "description": "asdasdasd",
    "version": 3,
    "tasks": [
      {
        "name": "inline_2",
        "taskReferenceName": "inline_ref_1",
        "inputParameters": {
          "expression": "(function () {\n  return $.value1 + $.value2;\n})();",
          "evaluatorType": "javascript",
          "value1": 2,
          "value2": 2
        },
        "type": "INLINE",
        "decisionCases": {},
        "defaultCase": [],
        "forkTasks": [],
        "startDelay": 0,
        "joinOn": [],
        "optional": false,
        "defaultExclusiveJoinTask": [],
        "asyncComplete": false,
        "loopOver": [],
        "onStateChange": {},
        "permissive": false
      },
      {
        "name": "do_while",
        "taskReferenceName": "do_while_ref",
        "inputParameters": {
          "myArray": [
            {
              "name": "Orkes"
            },
            {
              "year": 2024
            }
          ]
        },
        "type": "DO_WHILE",
        "decisionCases": {},
        "defaultCase": [],
        "forkTasks": [],
        "startDelay": 0,
        "joinOn": [],
        "optional": false,
        "defaultExclusiveJoinTask": [],
        "asyncComplete": false,
        "loopCondition": "(function () {\n  if ($.do_while_ref['iteration'] < $.myArray.length) {\n    return true;\n  }\n  return false;\n})();",
        "loopOver": [
          {
            "name": "inline",
            "taskReferenceName": "inline_ref",
            "inputParameters": {
              "expression": "(function () {\n  return $.value1 + $.value2;\n})();",
              "evaluatorType": "javascript",
              "value1": 1,
              "value2": 2
            },
            "type": "INLINE",
            "decisionCases": {},
            "defaultCase": [],
            "forkTasks": [],
            "startDelay": 0,
            "joinOn": [],
            "optional": false,
            "defaultExclusiveJoinTask": [],
            "asyncComplete": false,
            "loopOver": [],
            "onStateChange": {},
            "permissive": false
          }
        ],
        "evaluatorType": "graaljs",
        "onStateChange": {},
        "permissive": false
      }
    ],
    "inputParameters": [],
    "outputParameters": {},
    "failureWorkflow": "aaa_jeu",
    "schemaVersion": 2,
    "restartable": true,
    "workflowStatusListenerEnabled": false,
    "ownerEmail": "james.stuart@orkes.io",
    "timeoutPolicy": "ALERT_ONLY",
    "timeoutSeconds": 0,
    "variables": {},
    "inputTemplate": {},
    "enforceSchema": true
  },
  "priority": 0,
  "variables": {},
  "lastRetriedTime": 0,
  "failedTaskNames": [],
  "history": [],
  "rateLimited": false,
  "workflowName": "http_asdasd",
  "startTime": 1732033317471,
  "workflowVersion": 3
}

Run the workflow. it will render ok. BUT clicking on the do-while task will crash the app

@Sudakatux
Copy link
Contributor

LGTM

@v1r3n v1r3n merged commit e9fbfaa into conductor-oss:main Nov 25, 2024
2 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers

@v1r3n v1r3n v1r3n approved these changes

Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.
3 participants
@najeebkp @Sudakatux @v1r3n