diff --git a/app/assets/javascripts/dirty_submit/dirty_submit_form.js b/app/assets/javascripts/dirty_submit/dirty_submit_form.js index db13daf0799..83dd4b0a124 100644 --- a/app/assets/javascripts/dirty_submit/dirty_submit_form.js +++ b/app/assets/javascripts/dirty_submit/dirty_submit_form.js @@ -1,11 +1,13 @@ import $ from 'jquery'; import { memoize, throttle } from 'lodash'; +import createEventHub from '~/helpers/event_hub_factory'; class DirtySubmitForm { constructor(form) { this.form = form; this.dirtyInputs = []; this.isDisabled = true; + this.events = createEventHub(); this.init(); } @@ -36,11 +38,21 @@ class DirtySubmitForm { this.form.addEventListener('submit', (event) => this.formSubmit(event)); } + addInputsListener(callback) { + this.events.$on('input', callback); + } + + removeInputsListener(callback) { + this.events.$off('input', callback); + } + updateDirtyInput(event) { const { target } = event; if (!target.dataset.isDirtySubmitInput) return; + this.events.$emit('input', event); + this.updateDirtyInputs(target); this.toggleSubmission(); } diff --git a/app/assets/javascripts/pipelines/components/graph/graph_component.vue b/app/assets/javascripts/pipelines/components/graph/graph_component.vue index 015f0519c72..adb9f8604ff 100644 --- a/app/assets/javascripts/pipelines/components/graph/graph_component.vue +++ b/app/assets/javascripts/pipelines/components/graph/graph_component.vue @@ -92,6 +92,9 @@ export default { hasUpstreamPipelines() { return Boolean(this.pipeline?.upstream?.length > 0); }, + isMultiProjectVizAvailable() { + return Boolean(this.pipeline?.user?.namespace?.crossProjectPipelineAvailable); + }, isStageView() { return this.viewType === STAGE_VIEW; }, @@ -178,6 +181,7 @@ export default { -import { GlBadge, GlButton, GlLink, GlLoadingIcon, GlTooltipDirective } from '@gitlab/ui'; +import { + GlBadge, + GlButton, + GlLink, + GlLoadingIcon, + GlPopover, + GlSprintf, + GlTooltipDirective, +} from '@gitlab/ui'; +import TierBadge from '~/vue_shared/components/tier_badge.vue'; import { BV_HIDE_TOOLTIP } from '~/lib/utils/constants'; -import { __, sprintf } from '~/locale'; +import { __, s__, sprintf } from '~/locale'; import CiStatus from '~/vue_shared/components/ci_icon.vue'; import { reportToSentry } from '../../utils'; import { DOWNSTREAM, UPSTREAM } from './constants'; export default { + i18n: { + popover: { + title: s__('Pipelines|Multi-project pipeline graphs'), + description: s__( + 'Pipelines|Gitlab Premium users have access to the multi-project pipeline graph to improve the visualization of these pipelines. %{linkStart}Learn More%{linkEnd}', + ), + }, + }, directives: { GlTooltip: GlTooltipDirective, }, @@ -16,7 +33,11 @@ export default { GlButton, GlLink, GlLoadingIcon, + GlPopover, + GlSprintf, + TierBadge, }, + inject: ['multiProjectHelpPath'], props: { columnTitle: { type: String, @@ -26,6 +47,10 @@ export default { type: Boolean, required: true, }, + isMultiProjectVizAvailable: { + type: Boolean, + required: true, + }, isLoading: { type: Boolean, required: true, @@ -90,6 +115,9 @@ export default { pipelineStatus() { return this.pipeline.status; }, + popoverContainerId() { + return `popoverContainer-${this.pipeline.id}`; + }, projectName() { return this.pipeline.project.name; }, @@ -128,16 +156,21 @@ export default { diff --git a/app/assets/javascripts/pipelines/components/graph/linked_pipelines_column.vue b/app/assets/javascripts/pipelines/components/graph/linked_pipelines_column.vue index 3c1208afbf0..2f444eebbd5 100644 --- a/app/assets/javascripts/pipelines/components/graph/linked_pipelines_column.vue +++ b/app/assets/javascripts/pipelines/components/graph/linked_pipelines_column.vue @@ -28,6 +28,10 @@ export default { required: true, validator: validateConfigPaths, }, + isMultiProjectVizAvailable: { + type: Boolean, + required: true, + }, linkedPipelines: { type: Array, required: true, @@ -208,6 +212,7 @@ export default {
-
+
@@ -118,7 +127,7 @@ export default { - +
diff --git a/app/assets/javascripts/pipelines/components/pipelines_list/pipeline_url.vue b/app/assets/javascripts/pipelines/components/pipelines_list/pipeline_url.vue index 2fb5e3c536a..54bd42cbf22 100644 --- a/app/assets/javascripts/pipelines/components/pipelines_list/pipeline_url.vue +++ b/app/assets/javascripts/pipelines/components/pipelines_list/pipeline_url.vue @@ -1,8 +1,7 @@ - - - - diff --git a/app/assets/javascripts/pipelines/components/pipelines_list/time_ago.vue b/app/assets/javascripts/pipelines/components/pipelines_list/time_ago.vue index c45e3f24567..cde963e4051 100644 --- a/app/assets/javascripts/pipelines/components/pipelines_list/time_ago.vue +++ b/app/assets/javascripts/pipelines/components/pipelines_list/time_ago.vue @@ -1,6 +1,5 @@