diff options
author | GitLab Bot <gitlab-bot@gitlab.com> | 2020-09-19 01:45:44 +0000 |
---|---|---|
committer | GitLab Bot <gitlab-bot@gitlab.com> | 2020-09-19 01:45:44 +0000 |
commit | 85dc423f7090da0a52c73eb66faf22ddb20efff9 (patch) | |
tree | 9160f299afd8c80c038f08e1545be119f5e3f1e1 /app/assets/javascripts/jobs/components | |
parent | 15c2c8c66dbe422588e5411eee7e68f1fa440bb8 (diff) | |
download | gitlab-ce-85dc423f7090da0a52c73eb66faf22ddb20efff9.tar.gz |
Add latest changes from gitlab-org/gitlab@13-4-stable-ee
Diffstat (limited to 'app/assets/javascripts/jobs/components')
9 files changed, 83 insertions, 53 deletions
diff --git a/app/assets/javascripts/jobs/components/artifacts_block.vue b/app/assets/javascripts/jobs/components/artifacts_block.vue index 6183779acd4..2850a8e86fd 100644 --- a/app/assets/javascripts/jobs/components/artifacts_block.vue +++ b/app/assets/javascripts/jobs/components/artifacts_block.vue @@ -1,11 +1,12 @@ <script> -import { GlLink } from '@gitlab/ui'; +import { GlIcon, GlLink } from '@gitlab/ui'; import TimeagoTooltip from '~/vue_shared/components/time_ago_tooltip.vue'; import timeagoMixin from '~/vue_shared/mixins/timeago'; export default { components: { TimeagoTooltip, + GlIcon, GlLink, }, mixins: [timeagoMixin], @@ -14,6 +15,10 @@ export default { type: Object, required: true, }, + helpUrl: { + type: String, + required: true, + }, }, computed: { isExpired() { @@ -40,6 +45,14 @@ export default { <span v-if="isExpired">{{ s__('Job|The artifacts were removed') }}</span> <span v-if="willExpire">{{ s__('Job|The artifacts will be removed') }}</span> <timeago-tooltip v-if="artifact.expire_at" :time="artifact.expire_at" /> + <gl-link + :href="helpUrl" + target="_blank" + rel="noopener noreferrer nofollow" + data-testid="artifact-expired-help-link" + > + <gl-icon name="question" /> + </gl-link> </p> <p v-else-if="isLocked" class="build-detail-row"> <span data-testid="job-locked-message">{{ @@ -71,6 +84,7 @@ export default { :href="artifact.browse_path" class="btn btn-sm btn-default" data-testid="browse-artifacts" + data-qa-selector="browse_artifacts_button" >{{ s__('Job|Browse') }}</gl-link > </div> diff --git a/app/assets/javascripts/jobs/components/job_app.vue b/app/assets/javascripts/jobs/components/job_app.vue index e760706c97e..00ff3fb939d 100644 --- a/app/assets/javascripts/jobs/components/job_app.vue +++ b/app/assets/javascripts/jobs/components/job_app.vue @@ -1,13 +1,13 @@ <script> +/* eslint-disable vue/no-v-html */ import { throttle, isEmpty } from 'lodash'; import { mapGetters, mapState, mapActions } from 'vuex'; -import { GlLoadingIcon } from '@gitlab/ui'; +import { GlLoadingIcon, GlIcon } from '@gitlab/ui'; import { GlBreakpointInstance as bp } from '@gitlab/ui/dist/utils'; import { isScrolledToBottom } from '~/lib/utils/scroll_utils'; import { polyfillSticky } from '~/lib/utils/sticky'; import CiHeader from '~/vue_shared/components/header_ci_component.vue'; import Callout from '~/vue_shared/components/callout.vue'; -import Icon from '~/vue_shared/components/icon.vue'; import EmptyState from './empty_state.vue'; import EnvironmentsBlock from './environments_block.vue'; import ErasedBlock from './erased_block.vue'; @@ -27,7 +27,7 @@ export default { EmptyState, EnvironmentsBlock, ErasedBlock, - Icon, + GlIcon, Log, LogTopBar, StuckBlock, @@ -38,6 +38,11 @@ export default { }, mixins: [delayedJobMixin], props: { + artifactHelpUrl: { + type: String, + required: false, + default: '', + }, runnerSettingsUrl: { type: String, required: false, @@ -266,7 +271,7 @@ export default { :class="{ 'sticky-top border-bottom-0': hasTrace }" data-testid="archived-job" > - <icon name="lock" class="align-text-bottom" /> + <gl-icon name="lock" class="align-text-bottom" /> {{ __('This job is archived. Only the complete pipeline can be retried.') }} </div> <!-- job log --> @@ -319,6 +324,7 @@ export default { 'right-sidebar-expanded': isSidebarOpen, 'right-sidebar-collapsed': !isSidebarOpen, }" + :artifact-help-url="artifactHelpUrl" :runner-help-url="runnerHelpUrl" data-testid="job-sidebar" /> diff --git a/app/assets/javascripts/jobs/components/job_container_item.vue b/app/assets/javascripts/jobs/components/job_container_item.vue index 7bd299bcfa0..79e6623eca8 100644 --- a/app/assets/javascripts/jobs/components/job_container_item.vue +++ b/app/assets/javascripts/jobs/components/job_container_item.vue @@ -1,15 +1,14 @@ <script> -import { GlLink } from '@gitlab/ui'; +import { GlLink, GlIcon } from '@gitlab/ui'; import tooltip from '~/vue_shared/directives/tooltip'; import CiIcon from '~/vue_shared/components/ci_icon.vue'; -import Icon from '~/vue_shared/components/icon.vue'; import delayedJobMixin from '~/jobs/mixins/delayed_job_mixin'; import { sprintf } from '~/locale'; export default { components: { CiIcon, - Icon, + GlIcon, GlLink, }, directives: { @@ -56,7 +55,7 @@ export default { data-boundary="viewport" class="js-job-link d-flex" > - <icon + <gl-icon v-if="isActive" name="arrow-right" class="js-arrow-right icon-arrow-right position-absolute d-block" @@ -66,7 +65,7 @@ export default { <span class="text-truncate w-100">{{ job.name ? job.name : job.id }}</span> - <icon v-if="job.retried" name="retry" class="js-retry-icon" /> + <gl-icon v-if="job.retried" name="retry" class="js-retry-icon" /> </gl-link> </div> </template> diff --git a/app/assets/javascripts/jobs/components/job_log_controllers.vue b/app/assets/javascripts/jobs/components/job_log_controllers.vue index 4d314eaa106..7e7d9a0549b 100644 --- a/app/assets/javascripts/jobs/components/job_log_controllers.vue +++ b/app/assets/javascripts/jobs/components/job_log_controllers.vue @@ -1,16 +1,15 @@ <script> -import { GlTooltipDirective, GlLink, GlDeprecatedButton } from '@gitlab/ui'; +/* eslint-disable vue/no-v-html */ +import { GlTooltipDirective, GlLink, GlButton } from '@gitlab/ui'; import { polyfillSticky } from '~/lib/utils/sticky'; -import Icon from '~/vue_shared/components/icon.vue'; import { numberToHumanSize } from '~/lib/utils/number_utils'; import { __, sprintf } from '~/locale'; import scrollDown from '../svg/scroll_down.svg'; export default { components: { - Icon, GlLink, - GlDeprecatedButton, + GlButton, }, directives: { GlTooltip: GlTooltipDirective, @@ -87,18 +86,17 @@ export default { <div class="controllers float-right"> <!-- links --> - <gl-link + <gl-button v-if="rawPath" v-gl-tooltip.body :title="s__('Job|Show complete raw')" :href="rawPath" class="controllers-buttons" data-testid="job-raw-link-controller" - > - <icon name="doc-text" /> - </gl-link> + icon="doc-text" + /> - <gl-link + <gl-button v-if="erasePath" v-gl-tooltip.body :title="s__('Job|Erase job log')" @@ -107,30 +105,28 @@ export default { class="controllers-buttons" data-testid="job-log-erase-link" data-method="post" - > - <icon name="remove" /> - </gl-link> + icon="remove" + /> <!-- eo links --> <!-- scroll buttons --> <div v-gl-tooltip :title="s__('Job|Scroll to top')" class="controllers-buttons"> - <gl-deprecated-button + <gl-button :disabled="isScrollTopDisabled" - type="button" class="btn-scroll btn-transparent btn-blank" data-testid="job-controller-scroll-top" + icon="scroll_up" @click="handleScrollToTop" - > - <icon name="scroll_up" /> - </gl-deprecated-button> + /> </div> <div v-gl-tooltip :title="s__('Job|Scroll to bottom')" class="controllers-buttons"> - <gl-deprecated-button + <gl-button :disabled="isScrollBottomDisabled" class="js-scroll-bottom btn-scroll btn-transparent btn-blank" - :class="{ animate: isScrollingDown }" data-testid="job-controller-scroll-bottom" + icon="scroll_down" + :class="{ animate: isScrollingDown }" @click="handleScrollToBottom" v-html="$options.scrollDown" /> diff --git a/app/assets/javascripts/jobs/components/log/line.vue b/app/assets/javascripts/jobs/components/log/line.vue index 48f669ae8ed..e68d5b8eda4 100644 --- a/app/assets/javascripts/jobs/components/log/line.vue +++ b/app/assets/javascripts/jobs/components/log/line.vue @@ -20,7 +20,7 @@ export default { return h( 'span', { - class: ['ws-pre-wrap', content.style], + class: ['gl-white-space-pre-wrap', content.style], }, content.text, ); diff --git a/app/assets/javascripts/jobs/components/log/line_header.vue b/app/assets/javascripts/jobs/components/log/line_header.vue index 85ccd5996b5..4c1c00cb2a7 100644 --- a/app/assets/javascripts/jobs/components/log/line_header.vue +++ b/app/assets/javascripts/jobs/components/log/line_header.vue @@ -1,11 +1,11 @@ <script> -import Icon from '~/vue_shared/components/icon.vue'; +import { GlIcon } from '@gitlab/ui'; import LineNumber from './line_number.vue'; import DurationBadge from './duration_badge.vue'; export default { components: { - Icon, + GlIcon, LineNumber, DurationBadge, }, @@ -47,12 +47,12 @@ export default { role="button" @click="handleOnClick" > - <icon :name="iconName" class="arrow position-absolute" /> + <gl-icon :name="iconName" class="arrow position-absolute" /> <line-number :line-number="line.lineNumber" :path="path" /> <span v-for="(content, i) in line.content" :key="i" - class="line-text w-100 ws-pre-wrap" + class="line-text w-100 gl-white-space-pre-wrap" :class="content.style" >{{ content.text }}</span > diff --git a/app/assets/javascripts/jobs/components/manual_variables_form.vue b/app/assets/javascripts/jobs/components/manual_variables_form.vue index 9236624a191..bf1930c9a37 100644 --- a/app/assets/javascripts/jobs/components/manual_variables_form.vue +++ b/app/assets/javascripts/jobs/components/manual_variables_form.vue @@ -1,15 +1,14 @@ <script> +/* eslint-disable vue/no-v-html */ import { uniqueId } from 'lodash'; import { mapActions } from 'vuex'; -import { GlDeprecatedButton } from '@gitlab/ui'; +import { GlButton } from '@gitlab/ui'; import { s__, sprintf } from '~/locale'; -import Icon from '~/vue_shared/components/icon.vue'; export default { name: 'ManualVariablesForm', components: { - GlDeprecatedButton, - Icon, + GlButton, }, props: { action: { @@ -137,12 +136,12 @@ export default { <div class="table-section section-10"> <div class="table-mobile-header" role="rowheader"></div> <div class="table-mobile-content justify-content-end"> - <gl-deprecated-button - class="btn-transparent btn-blank w-25" + <gl-button + category="tertiary" + icon="clear" + :aria-label="__('Delete variable')" @click="deleteVariable(variable.id)" - > - <icon name="clear" /> - </gl-deprecated-button> + /> </div> </div> </div> @@ -176,9 +175,14 @@ export default { <p class="text-muted" v-html="helpText"></p> </div> <div class="d-flex justify-content-center"> - <gl-deprecated-button variant="primary" @click="triggerManualJob(variables)"> + <gl-button + variant="info" + category="primary" + :aria-label="__('Trigger manual job')" + @click="triggerManualJob(variables)" + > {{ action.button_title }} - </gl-deprecated-button> + </gl-button> </div> </div> </template> diff --git a/app/assets/javascripts/jobs/components/sidebar.vue b/app/assets/javascripts/jobs/components/sidebar.vue index 517da16dcf8..aa589989e8a 100644 --- a/app/assets/javascripts/jobs/components/sidebar.vue +++ b/app/assets/javascripts/jobs/components/sidebar.vue @@ -1,11 +1,11 @@ <script> import { isEmpty } from 'lodash'; import { mapActions, mapState } from 'vuex'; -import { GlLink, GlDeprecatedButton } from '@gitlab/ui'; +import { GlLink, GlDeprecatedButton, GlIcon } from '@gitlab/ui'; import { __, sprintf } from '~/locale'; import timeagoMixin from '~/vue_shared/mixins/timeago'; +import TooltipOnTruncate from '~/vue_shared/components/tooltip_on_truncate.vue'; 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'; @@ -19,15 +19,21 @@ export default { ArtifactsBlock, CommitBlock, DetailRow, - Icon, + GlIcon, TriggerBlock, StagesDropdown, JobsContainer, GlLink, GlDeprecatedButton, + TooltipOnTruncate, }, mixins: [timeagoMixin], props: { + artifactHelpUrl: { + type: String, + required: false, + default: '', + }, runnerHelpUrl: { type: String, required: false, @@ -112,7 +118,11 @@ export default { <div class="sidebar-container"> <div class="blocks-container"> <div class="block d-flex flex-nowrap align-items-center"> - <h4 class="my-0 mr-2 text-break-word">{{ job.name }}</h4> + <tooltip-on-truncate :title="job.name" truncate-target="child" + ><h4 class="my-0 mr-2 gl-text-truncate"> + {{ job.name }} + </h4> + </tooltip-on-truncate> <div class="flex-grow-1 flex-shrink-0 text-right"> <gl-link v-if="job.retry_path" @@ -157,7 +167,7 @@ export default { class="js-terminal-link btn btn-primary btn-inverted visible-md-block visible-lg-block float-left" target="_blank" > - {{ __('Debug') }} <icon name="external-link" :size="14" /> + {{ __('Debug') }} <gl-icon name="external-link" :size="14" /> </gl-link> </div> @@ -203,7 +213,7 @@ export default { </p> </div> - <artifacts-block v-if="hasArtifact" :artifact="job.artifact" /> + <artifacts-block v-if="hasArtifact" :artifact="job.artifact" :help-url="artifactHelpUrl" /> <trigger-block v-if="hasTriggers" :trigger="job.trigger" /> <commit-block :is-last-block="hasStages" diff --git a/app/assets/javascripts/jobs/components/sidebar_detail_row.vue b/app/assets/javascripts/jobs/components/sidebar_detail_row.vue index b826007ec2c..7d541f93bad 100644 --- a/app/assets/javascripts/jobs/components/sidebar_detail_row.vue +++ b/app/assets/javascripts/jobs/components/sidebar_detail_row.vue @@ -1,9 +1,10 @@ <script> -import { GlLink } from '@gitlab/ui'; +import { GlIcon, GlLink } from '@gitlab/ui'; export default { name: 'SidebarDetailRow', components: { + GlIcon, GlLink, }, props: { @@ -37,7 +38,7 @@ export default { <span v-if="hasTitle" class="font-weight-bold">{{ title }}:</span> {{ value }} <span v-if="hasHelpURL" class="help-button float-right"> <gl-link :href="helpUrl" target="_blank" rel="noopener noreferrer nofollow"> - <i class="fa fa-question-circle" aria-hidden="true"></i> + <gl-icon name="question-o" /> </gl-link> </span> </p> |