Workflow graph - Non stage jobs overlap into the stage in the UI

[sagar1312]

What happened:
Non stage jobs are being positioned under stage on the workflow graph in the UI giving a false impression that those jobs are part of the stage.

Example:

Pipeline config (screwdriver.yaml)

shared:
    image: node:20
    steps:
        - init: echo 'init'
jobs:
    triggering-stage:
        requires: [~pr, ~commit]
    non-stage-job-alpha:
        requires: [triggering-stage]
    ci-deploy:
        requires: [ ]
    ci-test-batch-1:
        requires: [ ci-deploy ]
    ci-test-batch-2:
        requires: [ ci-deploy ]
    ci-certify:
        requires: [ ci-test-batch-1, ci-test-batch-2 ]
    triggered-by-stage:
        requires: [ ~stage@integration ]

stages:
    integration:
        requires: [triggering-stage]
        jobs: [ci-deploy, ci-test-batch-1, ci-test-batch-2, ci-certify]
        description: "This stage will deploy the latest application to CI environment and certifies it after the tests are passed."

What you expected to happen:
Non stage jobs should be positioned outside stage jobs

How to reproduce it:
Create a pipeline with above screwdriver.yaml config.

[github-actions]

Similar issues

1. 56% Adjust the border of stage in the workflow graph based on the status #3064
2. 56% Support the workflow graph with stages configuration in the screwdriver UI validator #3041
3. 47% Allow a stage to be declared as an upstream for another stage #3045
4. 44% Skip execution of implicit jobs created for a Stage #3027
5. 44% Remote-join job doesn't wait on downstream jobs during restart #2981
6. 44% Workflow graph not displayed for triggers [~pr, ~pr:foo] #2894
7. 38% Remove associated stages and the builds for the stages when a pipeline is deleted #3025
8. 31% Validator page is overflowing when the workflow graph is long #2971

_{🤖 By issues-similarity-analysis}