summaryrefslogtreecommitdiff
path: root/app/assets
diff options
context:
space:
mode:
Diffstat (limited to 'app/assets')
-rw-r--r--app/assets/javascripts/build_variables.js10
-rw-r--r--app/assets/javascripts/jobs/components/artifacts_block.vue68
-rw-r--r--app/assets/javascripts/jobs/components/commit_block.vue72
-rw-r--r--app/assets/javascripts/jobs/components/sidebar_details_block.vue195
-rw-r--r--app/assets/javascripts/jobs/components/trigger_block.vue28
-rw-r--r--app/assets/javascripts/jobs/job_details_mediator.js2
6 files changed, 187 insertions, 188 deletions
diff --git a/app/assets/javascripts/build_variables.js b/app/assets/javascripts/build_variables.js
deleted file mode 100644
index d398e4a4c83..00000000000
--- a/app/assets/javascripts/build_variables.js
+++ /dev/null
@@ -1,10 +0,0 @@
-import $ from 'jquery';
-
-export default function handleRevealVariables() {
- $('.js-reveal-variables')
- .off('click')
- .on('click', function click() {
- $('.js-build-variables').toggle();
- $(this).hide();
- });
-}
diff --git a/app/assets/javascripts/jobs/components/artifacts_block.vue b/app/assets/javascripts/jobs/components/artifacts_block.vue
index 525c5eec91a..d5866f9b9f1 100644
--- a/app/assets/javascripts/jobs/components/artifacts_block.vue
+++ b/app/assets/javascripts/jobs/components/artifacts_block.vue
@@ -1,40 +1,27 @@
<script>
- import TimeagoTooltiop from '~/vue_shared/components/time_ago_tooltip.vue';
+ import TimeagoTooltip from '~/vue_shared/components/time_ago_tooltip.vue';
+ import timeagoMixin from '~/vue_shared/mixins/timeago';
export default {
components: {
- TimeagoTooltiop,
+ TimeagoTooltip,
},
+ mixins: [
+ timeagoMixin,
+ ],
props: {
- // @build.artifacts_expired?
- haveArtifactsExpired: {
- type: Boolean,
+ artifact: {
+ type: Object,
required: true,
},
- // @build.has_expiring_artifacts?
- willArtifactsExpire: {
- type: Boolean,
- required: true,
- },
- expireAt: {
- type: String,
- required: false,
- default: null,
- },
- keepArtifactsPath: {
- type: String,
- required: false,
- default: null,
- },
- downloadArtifactsPath: {
- type: String,
- required: false,
- default: null,
+ },
+ computed: {
+ isExpired() {
+ return this.artifact.expired;
},
- browseArtifactsPath: {
- type: String,
- required: false,
- default: null,
+ // Only when the key is `false` we can render this block
+ willExpire() {
+ return this.artifact.expired === false;
},
},
};
@@ -46,21 +33,22 @@
</div>
<p
- v-if="haveArtifactsExpired"
+ v-if="isExpired"
class="js-artifacts-removed build-detail-row"
>
{{ s__('Job|The artifacts were removed') }}
</p>
+
<p
- v-else-if="willArtifactsExpire"
+ v-else-if="willExpire"
class="js-artifacts-will-be-removed build-detail-row"
>
- {{ s__('Job|The artifacts will be removed') }}
+ {{ s__('Job|The artifacts will be removed in') }}
</p>
- <timeago-tooltiop
- v-if="expireAt"
- :time="expireAt"
+ <timeago-tooltip
+ v-if="artifact.expire_at"
+ :time="artifact.expire_at"
/>
<div
@@ -68,8 +56,8 @@
role="group"
>
<a
- v-if="keepArtifactsPath"
- :href="keepArtifactsPath"
+ v-if="artifact.keep_path"
+ :href="artifact.keep_path"
class="js-keep-artifacts btn btn-sm btn-default"
data-method="post"
>
@@ -77,8 +65,8 @@
</a>
<a
- v-if="downloadArtifactsPath"
- :href="downloadArtifactsPath"
+ v-if="artifact.download_path"
+ :href="artifact.download_path"
class="js-download-artifacts btn btn-sm btn-default"
download
rel="nofollow"
@@ -87,8 +75,8 @@
</a>
<a
- v-if="browseArtifactsPath"
- :href="browseArtifactsPath"
+ v-if="artifact.browse_path"
+ :href="artifact.browse_path"
class="js-browse-artifacts btn btn-sm btn-default"
>
{{ s__('Job|Browse') }}
diff --git a/app/assets/javascripts/jobs/components/commit_block.vue b/app/assets/javascripts/jobs/components/commit_block.vue
index 7f485295513..39a4ff159e2 100644
--- a/app/assets/javascripts/jobs/components/commit_block.vue
+++ b/app/assets/javascripts/jobs/components/commit_block.vue
@@ -1,64 +1,56 @@
<script>
-import ClipboardButton from '~/vue_shared/components/clipboard_button.vue';
+ import ClipboardButton from '~/vue_shared/components/clipboard_button.vue';
-export default {
- components: {
- ClipboardButton,
- },
- props: {
- pipelineShortSha: {
- type: String,
- required: true,
+ export default {
+ components: {
+ ClipboardButton,
},
- pipelineShaPath: {
- type: String,
- required: true,
+ props: {
+ commit: {
+ type: Object,
+ required: true,
+ },
+ mergeRequest: {
+ type: Object,
+ required: false,
+ default: null,
+ },
+ isLastBlock: {
+ type: Boolean,
+ required: true,
+ },
},
- mergeRequestReference: {
- type: String,
- required: false,
- default: null,
- },
- mergeRequestPath: {
- type: String,
- required: false,
- default: null,
- },
- gitCommitTitlte: {
- type: String,
- required: true,
- },
- },
-};
+ };
</script>
<template>
- <div class="block">
+ <div
+ :class="{
+ 'block-last': isLastBlock,
+ block: !isLastBlock
+ }">
<p>
{{ __('Commit') }}
<a
- :href="pipelineShaPath"
+ :href="commit.commit_path"
class="js-commit-sha commit-sha link-commit"
- >
- {{ pipelineShortSha }}
- </a>
+ >{{ commit.short_id }}</a>
<clipboard-button
- :text="pipelineShortSha"
+ :text="commit.short_id"
:title="__('Copy commit SHA to clipboard')"
+ css-class="btn btn-clipboard btn-transparent"
/>
<a
- v-if="mergeRequestPath && mergeRequestReference"
- :href="mergeRequestPath"
+ v-if="mergeRequest"
+ :href="mergeRequest.path"
class="js-link-commit link-commit"
- >
- {{ mergeRequestReference }}
- </a>
+ >{{ mergeRequest.iid }}</a>
</p>
<p class="build-light-text append-bottom-0">
- {{ gitCommitTitlte }}
+ {{ commit.title }}
</p>
</div>
</template>
diff --git a/app/assets/javascripts/jobs/components/sidebar_details_block.vue b/app/assets/javascripts/jobs/components/sidebar_details_block.vue
index 80c2a5fb48b..a591fcfb482 100644
--- a/app/assets/javascripts/jobs/components/sidebar_details_block.vue
+++ b/app/assets/javascripts/jobs/components/sidebar_details_block.vue
@@ -1,89 +1,113 @@
<script>
-import timeagoMixin from '~/vue_shared/mixins/timeago';
-import { timeIntervalInWords } from '~/lib/utils/datetime_utility';
-import Icon from '~/vue_shared/components/icon.vue';
-import DetailRow from './sidebar_detail_row.vue';
+ import _ from 'underscore';
+ import timeagoMixin from '~/vue_shared/mixins/timeago';
+ import { timeIntervalInWords } from '~/lib/utils/datetime_utility';
+ import Icon from '~/vue_shared/components/icon.vue';
+ import DetailRow from './sidebar_detail_row.vue';
+ import ArtifactsBlock from './artifacts_block.vue';
+ import TriggerBlock from './trigger_block.vue';
+ import CommitBlock from './commit_block.vue';
-export default {
- name: 'SidebarDetailsBlock',
- components: {
- DetailRow,
- Icon,
- },
- mixins: [timeagoMixin],
- props: {
- job: {
- type: Object,
- required: true,
+ export default {
+ name: 'SidebarDetailsBlock',
+ components: {
+ ArtifactsBlock,
+ CommitBlock,
+ DetailRow,
+ Icon,
+ TriggerBlock,
},
- isLoading: {
- type: Boolean,
- required: true,
+ mixins: [timeagoMixin],
+ props: {
+ job: {
+ type: Object,
+ required: true,
+ },
+ isLoading: {
+ type: Boolean,
+ required: true,
+ },
+ runnerHelpUrl: {
+ type: String,
+ required: false,
+ default: '',
+ },
+ terminalPath: {
+ type: String,
+ required: false,
+ default: null,
+ },
},
- runnerHelpUrl: {
- type: String,
- required: false,
- default: '',
- },
- terminalPath: {
- type: String,
- required: false,
- default: null,
- },
- },
- computed: {
- shouldRenderContent() {
- return !this.isLoading && Object.keys(this.job).length > 0;
- },
- coverage() {
- return `${this.job.coverage}%`;
- },
- duration() {
- return timeIntervalInWords(this.job.duration);
- },
- queued() {
- return timeIntervalInWords(this.job.queued);
- },
- runnerId() {
- return `${this.job.runner.description} (#${this.job.runner.id})`;
- },
- retryButtonClass() {
- let className =
- 'js-retry-button float-right btn btn-retry d-none d-md-block d-lg-block d-xl-block';
- className +=
- this.job.status && this.job.recoverable ? ' btn-primary' : ' btn-inverted-secondary';
- return className;
- },
- hasTimeout() {
- return this.job.metadata != null && this.job.metadata.timeout_human_readable !== null;
- },
- timeout() {
- if (this.job.metadata == null) {
- return '';
- }
+ computed: {
+ shouldRenderContent() {
+ return !this.isLoading && Object.keys(this.job).length > 0;
+ },
+ coverage() {
+ return `${this.job.coverage}%`;
+ },
+ duration() {
+ return timeIntervalInWords(this.job.duration);
+ },
+ queued() {
+ return timeIntervalInWords(this.job.queued);
+ },
+ runnerId() {
+ return `${this.job.runner.description} (#${this.job.runner.id})`;
+ },
+ retryButtonClass() {
+ let className =
+ 'js-retry-button float-right btn btn-retry d-none d-md-block d-lg-block d-xl-block';
+ className +=
+ this.job.status && this.job.recoverable ? ' btn-primary' : ' btn-inverted-secondary';
+ return className;
+ },
+ hasTimeout() {
+ return this.job.metadata != null && this.job.metadata.timeout_human_readable !== null;
+ },
+ timeout() {
+ if (this.job.metadata == null) {
+ return '';
+ }
- let t = this.job.metadata.timeout_human_readable;
- if (this.job.metadata.timeout_source !== '') {
- t += ` (from ${this.job.metadata.timeout_source})`;
- }
+ let t = this.job.metadata.timeout_human_readable;
+ if (this.job.metadata.timeout_source !== '') {
+ t += ` (from ${this.job.metadata.timeout_source})`;
+ }
- return t;
- },
- renderBlock() {
- return (
- this.job.merge_request ||
- this.job.duration ||
- this.job.finished_data ||
- this.job.erased_at ||
- this.job.queued ||
- this.job.runner ||
- this.job.coverage ||
- this.job.tags.length ||
- this.job.cancel_path
- );
+ return t;
+ },
+ renderBlock() {
+ return (
+ this.job.merge_request ||
+ this.job.duration ||
+ this.job.finished_data ||
+ this.job.erased_at ||
+ this.job.queued ||
+ this.job.runner ||
+ this.job.coverage ||
+ this.job.tags.length ||
+ this.job.cancel_path
+ );
+ },
+ hasArtifact() {
+ return !_.isEmpty(this.job.artifact);
+ },
+ hasTriggers() {
+ return !_.isEmpty(this.job.trigger);
+ },
+ hasStages() {
+ return (
+ this.job &&
+ this.job.pipeline &&
+ this.job.pipeline.stages &&
+ this.job.pipeline.stages.length > 0
+ ) || false;
+ },
+ commit() {
+ return this.job.pipeline.commit || {};
+ },
},
- },
-};
+ };
</script>
<template>
<div>
@@ -229,6 +253,19 @@ export default {
</a>
</div>
</div>
+ <artifacts-block
+ v-if="hasArtifact"
+ :artifact="job.artifact"
+ />
+ <trigger-block
+ v-if="hasTriggers"
+ :trigger="job.trigger"
+ />
+ <commit-block
+ :is-last-block="hasStages"
+ :commit="commit"
+ :merge-request="job.merge_request"
+ />
</template>
<gl-loading-icon
v-if="isLoading"
diff --git a/app/assets/javascripts/jobs/components/trigger_block.vue b/app/assets/javascripts/jobs/components/trigger_block.vue
index 8a88e5da6aa..d7b3c4fcb5b 100644
--- a/app/assets/javascripts/jobs/components/trigger_block.vue
+++ b/app/assets/javascripts/jobs/components/trigger_block.vue
@@ -1,16 +1,9 @@
<script>
export default {
props: {
- shortToken: {
- type: String,
- required: false,
- default: null,
- },
-
- variables: {
+ trigger: {
type: Object,
- required: false,
- default: () => ({}),
+ required: true,
},
},
data() {
@@ -20,7 +13,7 @@
},
computed: {
hasVariables() {
- return Object.keys(this.variables).length > 0;
+ return this.trigger.variables && this.trigger.variables.length > 0;
},
},
methods: {
@@ -38,17 +31,18 @@
</h4>
<p
- v-if="shortToken"
+ v-if="trigger.short_token"
class="js-short-token"
>
<span class="build-light-text">
{{ __('Token') }}
</span>
- {{ shortToken }}
+ {{ trigger.short_token }}
</p>
<p v-if="hasVariables">
<button
+ v-if="!areVariablesVisible"
type="button"
class="btn btn-default group js-reveal-variables"
@click="revealVariables"
@@ -63,20 +57,20 @@
class="js-build-variables trigger-build-variables"
>
<template
- v-for="(value, key) in variables"
+ v-for="variable in trigger.variables"
>
<dt
- :key="`${key}-variable`"
+ :key="`${variable.key}-variable`"
class="js-build-variable trigger-build-variable"
>
- {{ key }}
+ {{ variable.key }}
</dt>
<dd
- :key="`${key}-value`"
+ :key="`${variable.key}-value`"
class="js-build-value trigger-build-value"
>
- {{ value }}
+ {{ variable.value }}
</dd>
</template>
</dl>
diff --git a/app/assets/javascripts/jobs/job_details_mediator.js b/app/assets/javascripts/jobs/job_details_mediator.js
index 89019da9d1e..073e518baa0 100644
--- a/app/assets/javascripts/jobs/job_details_mediator.js
+++ b/app/assets/javascripts/jobs/job_details_mediator.js
@@ -4,7 +4,6 @@ import Poll from '../lib/utils/poll';
import JobStore from './stores/job_store';
import JobService from './services/job_service';
import Job from '../job';
-import handleRevealVariables from '../build_variables';
export default class JobMediator {
constructor(options = {}) {
@@ -20,7 +19,6 @@ export default class JobMediator {
initBuildClass() {
this.build = new Job();
- handleRevealVariables();
}
fetchJob() {