Show if a Pipeline was Run in a Fork

Only present if a pipeline is viewed from the merge request page. Checks
to see if the pipeline ran in the context of merge request source, and
if the source and target are different projects (ergo, a fork).

app/assets/javascripts/merge_request_tabs.js

@@ -369,6 +369,9 @@ export default class MergeRequestTabs {
         projectId: pipelineTableViewEl.dataset.projectId,
         mergeRequestId: mrWidgetData ? mrWidgetData.iid : null,
       },
+      provide: {
+        targetProjectFullPath: mrWidgetData?.target_project_full_path || '',
+      },
     }).$mount();
 
     // $mount(el) replaces the el with the new rendered component. We need it in order to mount

app/assets/javascripts/pipelines/components/pipelines_list/pipeline_url.vue

@@ -25,6 +25,11 @@ export default {
       required: true,
     },
   },
+  inject: {
+    targetProjectFullPath: {
+      default: '',
+    },
+  },
   computed: {
     user() {
       return this.pipeline.user;
@@ -32,6 +37,12 @@ export default {
     isScheduled() {
       return this.pipeline.source === SCHEDULE_ORIGIN;
     },
+    isInFork() {
+      return Boolean(
+        this.targetProjectFullPath &&
+          this.pipeline?.project?.full_path !== `/${this.targetProjectFullPath}`,
+      );
+    },
   },
 };
 </script>
@@ -52,9 +63,8 @@ export default {
           :title="__('This pipeline was triggered by a schedule.')"
           class="badge badge-info"
           data-testid="pipeline-url-scheduled"
+          >{{ __('Scheduled') }}</span
         >
-          {{ __('Scheduled') }}
-        </span>
       </gl-link>
       <span
         v-if="pipeline.flags.latest"
@@ -62,27 +72,24 @@ export default {
         :title="__('Latest pipeline for the most recent commit on this branch')"
         class="js-pipeline-url-latest badge badge-success"
         data-testid="pipeline-url-latest"
+        >{{ __('latest') }}</span
       >
-        {{ __('latest') }}
-      </span>
       <span
         v-if="pipeline.flags.yaml_errors"
         v-gl-tooltip
         :title="pipeline.yaml_errors"
         class="js-pipeline-url-yaml badge badge-danger"
         data-testid="pipeline-url-yaml"
+        >{{ __('yaml invalid') }}</span
       >
-        {{ __('yaml invalid') }}
-      </span>
       <span
         v-if="pipeline.flags.failure_reason"
         v-gl-tooltip
         :title="pipeline.failure_reason"
         class="js-pipeline-url-failure badge badge-danger"
         data-testid="pipeline-url-failure"
+        >{{ __('error') }}</span
       >
-        {{ __('error') }}
-      </span>
       <gl-link
         v-if="pipeline.flags.auto_devops"
         :id="`pipeline-url-autodevops-${pipeline.id}`"
@@ -112,17 +119,16 @@ export default {
             </gl-sprintf>
           </div>
         </template>
-        <gl-link :href="autoDevopsHelpPath" target="_blank" rel="noopener noreferrer nofollow">
-          {{ __('Learn more about Auto DevOps') }}
-        </gl-link>
+        <gl-link :href="autoDevopsHelpPath" target="_blank" rel="noopener noreferrer nofollow">{{
+          __('Learn more about Auto DevOps')
+        }}</gl-link>
       </gl-popover>
       <span
         v-if="pipeline.flags.stuck"
         class="js-pipeline-url-stuck badge badge-warning"
         data-testid="pipeline-url-stuck"
+        >{{ __('stuck') }}</span
       >
-        {{ __('stuck') }}
-      </span>
       <span
         v-if="pipeline.flags.detached_merge_request_pipeline"
         v-gl-tooltip
@@ -133,9 +139,16 @@ export default {
         "
         class="js-pipeline-url-detached badge badge-info"
         data-testid="pipeline-url-detached"
+        >{{ __('detached') }}</span
+      >
+      <span
+        v-if="isInFork"
+        v-gl-tooltip
+        :title="__('Pipeline ran in fork of project')"
+        class="badge badge-info"
+        data-testid="pipeline-url-fork"
+        >{{ __('fork') }}</span
       >
-        {{ __('detached') }}
-      </span>
     </div>
   </div>
 </template>

changelogs/unreleased/add-forked-pipeline-indicator.yml

+---
+title: Show if a Pipeline was Ran in a Fork
+merge_request: 48517
+author:
+type: added

locale/gitlab.pot

@@ -19878,6 +19878,9 @@ msgstr ""
 msgid "Pipeline minutes quota"
 msgstr ""
 
+msgid "Pipeline ran in fork of project"
+msgstr ""
+
 msgid "Pipeline subscriptions"
 msgstr ""
 
@@ -32259,6 +32262,9 @@ msgstr ""
 msgid "for this project"
 msgstr ""
 
+msgid "fork"
+msgstr ""
+
 msgid "fork this project"
 msgstr ""
 

spec/frontend/pipelines/pipeline_url_spec.js

@@ -16,6 +16,7 @@ describe('Pipeline Url Component', () => {
   const findAutoDevopsTag = () => wrapper.find('[data-testid="pipeline-url-autodevops"]');
   const findStuckTag = () => wrapper.find('[data-testid="pipeline-url-stuck"]');
   const findDetachedTag = () => wrapper.find('[data-testid="pipeline-url-detached"]');
+  const findForkTag = () => wrapper.find('[data-testid="pipeline-url-fork"]');
 
   const defaultProps = {
     pipeline: {
@@ -30,6 +31,9 @@ describe('Pipeline Url Component', () => {
   const createComponent = props => {
     wrapper = shallowMount(PipelineUrlComponent, {
       propsData: { ...defaultProps, ...props },
+      provide: {
+        targetProjectFullPath: 'test/test',
+      },
     });
   };
 
@@ -137,4 +141,15 @@ describe('Pipeline Url Component', () => {
     expect(findScheduledTag().exists()).toBe(true);
     expect(findScheduledTag().text()).toContain('Scheduled');
   });
+  it('should render the fork badge when the pipeline was run in a fork', () => {
+    createComponent({
+      pipeline: {
+        flags: {},
+        project: { fullPath: 'test/forked' },
+      },
+    });
+
+    expect(findForkTag().exists()).toBe(true);
+    expect(findForkTag().text()).toBe('fork');
+  });
 });