1 files changed, 7 insertions, 13 deletions
diff --git a/app/assets/javascripts/pipelines/components/graph/job_item.vue b/app/assets/javascripts/pipelines/components/graph/job_item.vue
index 6584d89d87c..fd40ca0b9c9 100644
--- a/app/assets/javascripts/pipelines/components/graph/job_item.vue
+++ b/app/assets/javascripts/pipelines/components/graph/job_item.vue
@@ -7,8 +7,7 @@ import CiIcon from '~/vue_shared/components/ci_icon.vue';
 import { reportToSentry } from '../../utils';
 import ActionComponent from '../jobs_shared/action_component.vue';
 import JobNameComponent from '../jobs_shared/job_name_component.vue';
-import { accessValue } from './accessors';
-import { REST, SINGLE_JOB } from './constants';
+import { SINGLE_JOB } from './constants';
 
 /**
  * Renders the badge for the pipeline graph and the job's dropdown.
@@ -47,18 +46,13 @@ export default {
     GlTooltip: GlTooltipDirective,
   },
   mixins: [delayedJobMixin],
-  inject: {
-    dataMethod: {
-      default: REST,
-    },
-  },
   props: {
     job: {
       type: Object,
       required: true,
     },
     cssClassJobName: {
-      type: String,
+      type: [String, Array],
       required: false,
       default: '',
     },
@@ -111,10 +105,10 @@ export default {
       return this.pipelineId > -1 ? `${this.job.name}-${this.pipelineId}` : '';
     },
     detailsPath() {
-      return accessValue(this.dataMethod, 'detailsPath', this.status);
+      return this.status.detailsPath;
     },
     hasDetails() {
-      return accessValue(this.dataMethod, 'hasDetails', this.status);
+      return this.status.hasDetails;
     },
     isSingleItem() {
       return this.type === SINGLE_JOB;
@@ -189,7 +183,7 @@ export default {
       if (this.isSingleItem) {
         /*
           This is so the jobDropdown still toggles. Issue to refactor:
-          https://gitlab.com/gitlab-org/gitlab/-/issues/267117 
+          https://gitlab.com/gitlab-org/gitlab/-/issues/267117
         */
         evt.stopPropagation();
       }
@@ -226,11 +220,11 @@ export default {
       <div class="ci-job-name-component gl-display-flex gl-align-items-center">
         <ci-icon :size="24" :status="job.status" class="gl-line-height-0" />
         <div class="gl-pl-3 gl-display-flex gl-flex-direction-column gl-w-full">
-          <div class="gl-text-truncate mw-70p gl-line-height-normal">{{ job.name }}</div>
+          <div class="gl-text-truncate gl-w-70p gl-line-height-normal">{{ job.name }}</div>
           <div
             v-if="showStageName"
             data-testid="stage-name-in-job"
-            class="gl-text-truncate mw-70p gl-font-sm gl-text-gray-500 gl-line-height-normal"
+            class="gl-text-truncate gl-w-70p gl-font-sm gl-text-gray-500 gl-line-height-normal"
           >
             {{ stageName }}
           </div>