Commit 647a4d6a authored by Filipa Lacerda's avatar Filipa Lacerda

Updates eslint vue plugin version

parent 8cd6ffab
......@@ -72,11 +72,11 @@ export default {
rel="noopener noreferrer"
>
<img
class="project-badge"
:src="imageUrlWithRetries"
class="project-badge"
aria-hidden="true"
@load="onLoad"
@error="onError"
aria-hidden="true"
/>
</a>
......@@ -91,9 +91,9 @@ export default {
>
<div class="btn btn-default btn-sm disabled">
<icon
:size="16"
class="prepend-left-8 append-right-8"
name="doc_image"
:size="16"
aria-hidden="true"
/>
</div>
......@@ -105,16 +105,16 @@ export default {
</div>
<button
v-tooltip
v-show="hasError"
:title="s__('Badges|Reload badge image')"
class="btn btn-transparent btn-sm text-primary"
type="button"
v-tooltip
:title="s__('Badges|Reload badge image')"
@click="reloadImage"
>
<icon
name="retry"
:size="16"
name="retry"
/>
</button>
</div>
......
......@@ -153,10 +153,10 @@ export default {
<label for="badge-link-url">{{ s__('Badges|Link') }}</label>
<input
id="badge-link-url"
type="text"
class="form-control"
v-model="linkUrl"
:placeholder="$options.badgeLinkUrlPlaceholder"
type="text"
class="form-control"
@input="debouncedPreview"
/>
<span
......@@ -169,10 +169,10 @@ export default {
<label for="badge-image-url">{{ s__('Badges|Badge image URL') }}</label>
<input
id="badge-image-url"
type="text"
class="form-control"
v-model="imageUrl"
:placeholder="$options.badgeImageUrlPlaceholder"
type="text"
class="form-control"
@input="debouncedPreview"
/>
<span
......@@ -184,8 +184,8 @@ export default {
<div class="form-group">
<label for="badge-preview">{{ s__('Badges|Badge image preview') }}</label>
<badge
id="badge-preview"
v-show="renderedBadge && !isRendering"
id="badge-preview"
:image-url="renderedImageUrl"
:link-url="renderedLinkUrl"
/>
......@@ -202,16 +202,16 @@ export default {
<div class="row-content-block">
<loading-button
type="submit"
container-class="btn btn-success"
:disabled="!canSubmit"
:loading="isSaving"
:label="submitButtonLabel"
type="submit"
container-class="btn btn-success"
/>
<button
v-if="isEditing"
class="btn btn-cancel"
type="button"
v-if="isEditing"
@click="onCancel"
>{{ __('Cancel') }}</button>
</div>
......
......@@ -41,9 +41,9 @@ export default {
<template>
<div class="gl-responsive-table-row-layout gl-responsive-table-row">
<badge
class="table-section section-30"
:image-url="badge.renderedImageUrl"
:link-url="badge.renderedLinkUrl"
class="table-section section-30"
/>
<span class="table-section section-50 str-truncated">{{ badge.linkUrl }}</span>
<div class="table-section section-10">
......@@ -54,29 +54,29 @@ export default {
v-if="canEditBadge"
class="table-action-buttons">
<button
:disabled="badge.isDeleting"
class="btn btn-default append-right-8"
type="button"
:disabled="badge.isDeleting"
@click="editBadge(badge)"
>
<icon
name="pencil"
:size="16"
:aria-label="__('Edit')"
name="pencil"
/>
</button>
<button
:disabled="badge.isDeleting"
class="btn btn-danger"
type="button"
data-toggle="modal"
data-target="#delete-badge-modal"
:disabled="badge.isDeleting"
@click="updateBadgeInModal(badge)"
>
<icon
name="remove"
:size="16"
:aria-label="__('Delete')"
name="remove"
/>
</button>
<loading-icon
......
......@@ -44,8 +44,8 @@ export default {
<gl-modal
id="delete-badge-modal"
:header-title-text="s__('Badges|Delete badge?')"
footer-primary-button-variant="danger"
:footer-primary-button-text="s__('Badges|Delete badge')"
footer-primary-button-variant="danger"
@submit="onSubmitModal">
<div class="well">
<badge
......
......@@ -14,17 +14,28 @@ window.gl = window.gl || {};
window.gl.issueBoards = window.gl.issueBoards || {};
gl.issueBoards.Board = Vue.extend({
template: '#js-board-template',
components: {
boardList,
'board-delete': gl.issueBoards.BoardDelete,
BoardBlankState,
},
props: {
list: Object,
disabled: Boolean,
issueLinkBase: String,
rootPath: String,
list: {
type: Object,
default: () => ({}),
},
disabled: {
type: Boolean,
required: true,
},
issueLinkBase: {
type: String,
required: true,
},
rootPath: {
type: String,
required: true,
},
boardId: {
type: String,
required: true,
......@@ -82,20 +93,6 @@ gl.issueBoards.Board = Vue.extend({
deep: true
}
},
methods: {
showNewIssueForm() {
this.$refs['board-list'].showIssueForm = !this.$refs['board-list'].showIssueForm;
},
toggleExpanded(e) {
if (this.list.isExpandable && !e.target.classList.contains('js-no-trigger-collapse')) {
this.list.isExpanded = !this.list.isExpanded;
if (AccessorUtilities.isLocalStorageAccessSafe()) {
localStorage.setItem(`boards.${this.boardId}.${this.list.type}.expanded`, this.list.isExpanded);
}
}
},
},
mounted () {
this.sortableOptions = gl.issueBoards.getBoardSortableDefaultOptions({
disabled: this.disabled,
......@@ -125,4 +122,19 @@ gl.issueBoards.Board = Vue.extend({
this.list.isExpanded = !isCollapsed;
}
},
methods: {
showNewIssueForm() {
this.$refs['board-list'].showIssueForm = !this.$refs['board-list'].showIssueForm;
},
toggleExpanded(e) {
if (this.list.isExpandable && !e.target.classList.contains('js-no-trigger-collapse')) {
this.list.isExpanded = !this.list.isExpanded;
if (AccessorUtilities.isLocalStorageAccessSafe()) {
localStorage.setItem(`boards.${this.boardId}.${this.list.type}.expanded`, this.list.isExpanded);
}
}
},
},
template: '#js-board-template',
});
......@@ -72,8 +72,8 @@ export default {
:key="index"
>
<span
class="label-color"
:style="{ backgroundColor: label.color }">
:style="{ backgroundColor: label.color }"
class="label-color">
</span>
{{ label.title }}
</li>
......
......@@ -77,7 +77,6 @@ export default {
<template>
<li
class="board-card"
:class="{
'user-can-drag': !disabled && issue.id,
'is-disabled': disabled || !issue.id,
......@@ -85,6 +84,7 @@ export default {
}"
:index="index"
:data-issue-id="issue.id"
class="board-card"
@mousedown="mouseDown"
@mousemove="mouseMove"
@mouseup="showIssue($event)">
......
......@@ -8,7 +8,10 @@ window.gl.issueBoards = window.gl.issueBoards || {};
gl.issueBoards.BoardDelete = Vue.extend({
props: {
list: Object
list: {
type: Object,
default: () => ({}),
},
},
methods: {
deleteBoard () {
......
......@@ -205,22 +205,22 @@ export default {
<template>
<div class="board-list-component">
<div
v-if="loading"
class="board-list-loading text-center"
aria-label="Loading issues"
v-if="loading">
aria-label="Loading issues">
<loading-icon />
</div>
<board-new-issue
v-if="list.type !== 'closed' && showIssueForm"
:group-id="groupId"
:list="list"
v-if="list.type !== 'closed' && showIssueForm"/>
:list="list"/>
<ul
class="board-list js-board-list"
v-show="!loading"
ref="list"
:data-board="list.id"
:data-board-type="list.type"
:class="{ 'is-smaller': showIssueForm }">
:class="{ 'is-smaller': showIssueForm }"
class="board-list js-board-list">
<board-card
v-for="(issue, index) in issues"
ref="issue"
......@@ -233,8 +233,8 @@ export default {
:disabled="disabled"
:key="issue.id" />
<li
class="board-list-count text-center"
v-if="showCount"
class="board-list-count text-center"
data-issue-id="-1">
<loading-icon
v-show="list.loadingMore"
......
......@@ -96,26 +96,26 @@ export default {
<div class="board-card">
<form @submit="submit($event)">
<div
class="flash-container"
v-if="error"
class="flash-container"
>
<div class="flash-alert">
An error occurred. Please try again.
</div>
</div>
<label
class="label-light"
:for="list.id + '-title'"
class="label-light"
>
Title
</label>
<input
ref="input"
v-model="title"
:id="list.id + '-title'"
class="form-control"
type="text"
v-model="title"
ref="input"
autocomplete="off"
:id="list.id + '-title'"
/>
<project-select
v-if="groupId"
......@@ -123,10 +123,10 @@ export default {
/>
<div class="clearfix prepend-top-10">
<button
ref="submit-button"
:disabled="disabled"
class="btn btn-success float-left"
type="submit"
:disabled="disabled"
ref="submit-button"
>
Submit issue
</button>
......
......@@ -21,8 +21,17 @@ window.gl = window.gl || {};
window.gl.issueBoards = window.gl.issueBoards || {};
gl.issueBoards.BoardSidebar = Vue.extend({
components: {
assigneeTitle,
assignees,
removeBtn: gl.issueBoards.RemoveIssueBtn,
subscriptions,
},
props: {
currentUser: Object
currentUser: {
type: Object,
default: () => ({}),
},
},
data() {
return {
......@@ -64,6 +73,26 @@ gl.issueBoards.BoardSidebar = Vue.extend({
deep: true
},
},
created () {
// Get events from glDropdown
eventHub.$on('sidebar.removeAssignee', this.removeAssignee);
eventHub.$on('sidebar.addAssignee', this.addAssignee);
eventHub.$on('sidebar.removeAllAssignees', this.removeAllAssignees);
eventHub.$on('sidebar.saveAssignees', this.saveAssignees);
},
beforeDestroy() {
eventHub.$off('sidebar.removeAssignee', this.removeAssignee);
eventHub.$off('sidebar.addAssignee', this.addAssignee);
eventHub.$off('sidebar.removeAllAssignees', this.removeAllAssignees);
eventHub.$off('sidebar.saveAssignees', this.saveAssignees);
},
mounted () {
new IssuableContext(this.currentUser);
new MilestoneSelect();
new DueDateSelectors();
new LabelsSelect();
new Sidebar();
},
methods: {
closeSidebar () {
this.detail.issue = {};
......@@ -97,30 +126,4 @@ gl.issueBoards.BoardSidebar = Vue.extend({
});
},
},
created () {
// Get events from glDropdown
eventHub.$on('sidebar.removeAssignee', this.removeAssignee);
eventHub.$on('sidebar.addAssignee', this.addAssignee);
eventHub.$on('sidebar.removeAllAssignees', this.removeAllAssignees);
eventHub.$on('sidebar.saveAssignees', this.saveAssignees);
},
beforeDestroy() {
eventHub.$off('sidebar.removeAssignee', this.removeAssignee);
eventHub.$off('sidebar.addAssignee', this.addAssignee);
eventHub.$off('sidebar.removeAllAssignees', this.removeAllAssignees);
eventHub.$off('sidebar.saveAssignees', this.saveAssignees);
},
mounted () {
new IssuableContext(this.currentUser);
new MilestoneSelect();
new DueDateSelectors();
new LabelsSelect();
new Sidebar();
},
components: {
assigneeTitle,
assignees,
removeBtn: gl.issueBoards.RemoveIssueBtn,
subscriptions,
},
});
......@@ -9,6 +9,9 @@ window.gl = window.gl || {};
window.gl.issueBoards = window.gl.issueBoards || {};
gl.issueBoards.IssueCardInner = Vue.extend({
components: {
UserAvatarLink,
},
props: {
issue: {
type: Object,
......@@ -35,6 +38,7 @@ gl.issueBoards.IssueCardInner = Vue.extend({
groupId: {
type: Number,
required: false,
default: null,
},
},
data() {
......@@ -44,9 +48,6 @@ gl.issueBoards.IssueCardInner = Vue.extend({
maxCounter: 99,
};
},
components: {
UserAvatarLink,
},
computed: {
numberOverLimit() {
return this.issue.assignees.length - this.limitBeforeCounter;
......
......@@ -4,9 +4,6 @@ import modalMixin from '../../mixins/modal_mixins';
gl.issueBoards.ModalEmptyState = Vue.extend({
mixins: [modalMixin],
data() {
return ModalStore.store;
},
props: {
newIssuePath: {
type: String,
......@@ -17,6 +14,9 @@ gl.issueBoards.ModalEmptyState = Vue.extend({
required: true,
},
},
data() {
return ModalStore.store;
},
computed: {
contents() {
const obj = {
......
......@@ -7,6 +7,9 @@ import ModalStore from '../../stores/modal_store';
import modalMixin from '../../mixins/modal_mixins';
gl.issueBoards.ModalFooter = Vue.extend({
components: {
'lists-dropdown': gl.issueBoards.ModalFooterListsDropdown,
},
mixins: [modalMixin],
data() {
return {
......@@ -52,9 +55,6 @@ gl.issueBoards.ModalFooter = Vue.extend({
this.toggleModal(false);
},
},
components: {
'lists-dropdown': gl.issueBoards.ModalFooterListsDropdown,
},
template: `
<footer
class="form-actions add-issues-footer">
......
......@@ -5,6 +5,10 @@ import ModalStore from '../../stores/modal_store';
import modalMixin from '../../mixins/modal_mixins';
gl.issueBoards.ModalHeader = Vue.extend({
components: {
'modal-tabs': gl.issueBoards.ModalTabs,
modalFilters,
},
mixins: [modalMixin],
props: {
projectId: {
......@@ -42,10 +46,6 @@ gl.issueBoards.ModalHeader = Vue.extend({
ModalStore.toggleAll();
},
},
components: {
'modal-tabs': gl.issueBoards.ModalTabs,
modalFilters,
},
template: `
<div>
<header class="add-issues-header form-actions">
......
......@@ -10,6 +10,13 @@ import './empty_state';
import ModalStore from '../../stores/modal_store';
gl.issueBoards.IssuesModal = Vue.extend({
components: {
'modal-header': gl.issueBoards.ModalHeader,
'modal-list': gl.issueBoards.ModalList,
'modal-footer': gl.issueBoards.ModalFooter,
'empty-state': gl.issueBoards.ModalEmptyState,
loadingIcon,
},
props: {
newIssuePath: {
type: String,
......@@ -43,6 +50,22 @@ gl.issueBoards.IssuesModal = Vue.extend({
data() {
return ModalStore.store;
},
computed: {
showList() {
if (this.activeTab === 'selected') {
return this.selectedIssues.length > 0;
}
return this.issuesCount > 0;
},
showEmptyState() {
if (!this.loading && this.issuesCount === 0) {
return true;
}
return this.activeTab === 'selected' && this.selectedIssues.length === 0;
},
},
watch: {
page() {
this.loadIssues();
......@@ -80,6 +103,9 @@ gl.issueBoards.IssuesModal = Vue.extend({
deep: true,
},
},
created() {
this.page = 1;
},
methods: {
loadIssues(clearIssues = false) {
if (!this.showAddIssuesModal) return false;
......@@ -112,32 +138,6 @@ gl.issueBoards.IssuesModal = Vue.extend({
});
},
},
computed: {
showList() {
if (this.activeTab === 'selected') {
return this.selectedIssues.length > 0;
}
return this.issuesCount > 0;
},
showEmptyState() {
if (!this.loading && this.issuesCount === 0) {
return true;
}
return this.activeTab === 'selected' && this.selectedIssues.length === 0;
},
},
created() {
this.page = 1;
},
components: {
'modal-header': gl.issueBoards.ModalHeader,
'modal-list': gl.issueBoards.ModalList,
'modal-footer': gl.issueBoards.ModalFooter,
'empty-state': gl.issueBoards.ModalEmptyState,
loadingIcon,
},
template: `
<div
class="add-issues-modal"
......
......@@ -3,6 +3,9 @@ import bp from '../../../breakpoints';
import ModalStore from '../../stores/modal_store';
gl.issueBoards.ModalList = Vue.extend({
components: {
'issue-card-inner': gl.issueBoards.IssueCardInner,
},
props: {
issueLinkBase: {
type: String,
......@@ -20,13 +23,6 @@ gl.issueBoards.ModalList = Vue.extend({
data() {
return ModalStore.store;
},
watch: {
activeTab() {
if (this.activeTab === 'all') {
ModalStore.purgeUnselectedIssues();
}
},
},
computed: {
loopIssues() {
if (this.activeTab === 'all') {
......@@ -50,6 +46,25 @@ gl.issueBoards.ModalList = Vue.extend({
return groups;
},
},
watch: {
activeTab() {
if (this.activeTab === 'all') {
ModalStore.purgeUnselectedIssues();
}
},
},
mounted() {
this.scrollHandlerWrapper = this.scrollHandler.bind(this);
this.setColumnCountWrapper = this.setColumnCount.bind(this);
this.setColumnCount();
this.$refs.list.addEventListener('scroll', this.scrollHandlerWrapper);
window.addEventListener('resize', this.setColumnCountWrapper);
},
beforeDestroy() {
this.$refs.list.removeEventListener('scroll', this.scrollHandlerWrapper);
window.removeEventListener('resize', this.setColumnCountWrapper);
},
methods: {
scrollHandler() {
const currentPage = Math.floor(this.issues.length / this.perPage);
......@@ -96,21 +111,6 @@ gl.issueBoards.ModalList = Vue.extend({
}
},
},
mounted() {
this.scrollHandlerWrapper = this.scrollHandler.bind(this);
this.setColumnCountWrapper = this.setColumnCount.bind(this);
this.setColumnCount();
this.$refs.list.addEventListener('scroll', this.scrollHandlerWrapper);
window.addEventListener('resize', this.setColumnCountWrapper);
},
beforeDestroy() {
this.$refs.list.removeEventListener('scroll', this.scrollHandlerWrapper);
window.removeEventListener('resize', this.setColumnCountWrapper);
},
components: {
'issue-card-inner': gl.issueBoards.IssueCardInner,
},
template: `
<section
class="add-issues-list add-issues-list-columns"
......
......@@ -125,8 +125,8 @@
<template>
<div
class="gl-responsive-table-row gl-responsive-table-row-col-span"
:class="rowJsClass"
class="gl-responsive-table-row gl-responsive-table-row-col-span"
>
<div
class="gl-responsive-table-row-layout"
......@@ -155,8 +155,8 @@
<slot name="description"></slot>
</div>
<div
class="table-section table-button-footer section-align-top"
:class="{ 'section-20': showManageButton, 'section-15': !showManageButton }"
class="table-section table-button-footer section-align-top"
role="gridcell"
>
<div
......@@ -164,18 +164,18 @@
class="btn-group table-action-buttons"
>
<a
class="btn"
:href="manageLink"
class="btn"
>
{{ manageButtonLabel }}
</a>
</div>
<div class="btn-group table-action-buttons">
<loading-button
class="js-cluster-application-install-button"
:loading="installButtonLoading"
:disabled="installButtonDisabled"
:label="installButtonLabel"
class="js-cluster-application-install-button"
@click="installClicked"
/>
</div>
......
......@@ -152,11 +152,11 @@ export default {
<application-row
id="helm"
:title="applications.helm.title"
title-link="https://docs.helm.sh/"
:status="applications.helm.status"
:status-reason="applications.helm.statusReason"
:request-status="applications.helm.requestStatus"
:request-reason="applications.helm.requestReason"
title-link="https://docs.helm.sh/"
>
<div slot="description">
{{ s__(`ClusterIntegration|Helm streamlines installing
......@@ -168,11 +168,11 @@ export default {
<application-row
:id="ingressId"
:title="applications.ingress.title"
title-link="https://kubernetes.io/docs/concepts/services-networking/ingress/"
:status="applications.ingress.status"
:status-reason="applications.ingress.statusReason"
:request-status="applications.ingress.requestStatus"
:request-reason="applications.ingress.requestReason"
title-link="https://kubernetes.io/docs/concepts/services-networking/ingress/"
>
<div slot="description">
<p>
......@@ -191,10 +191,10 @@ export default {
class="input-group"
>
<input
type="text"
id="ingress-ip-address"
class="form-control js-ip-address"
:value="ingressExternalIp"
type="text"
class="form-control js-ip-address"
readonly
/>
<span class="input-group-append">
......@@ -255,12 +255,12 @@ export default {
<application-row
id="prometheus"
:title="applications.prometheus.title"
title-link="https://prometheus.io/docs/introduction/overview/"
:manage-link="managePrometheusPath"
:status="applications.prometheus.status"
:status-reason="applications.prometheus.statusReason"
:request-status="applications.prometheus.requestStatus"
:request-reason="applications.prometheus.requestReason"
title-link="https://prometheus.io/docs/introduction/overview/"
>
<div
slot="description"
......@@ -271,11 +271,11 @@ export default {
<application-row
id="runner"
:title="applications.runner.title"
title-link="https://docs.gitlab.com/runner/"
:status="applications.runner.status"
:status-reason="applications.runner.statusReason"
:request-status="applications.runner.requestStatus"
:request-reason="applications.runner.requestReason"
title-link="https://docs.gitlab.com/runner/"
>
<div slot="description">
{{ s__(`ClusterIntegration|GitLab Runner connects to this
......@@ -287,12 +287,12 @@ export default {
<application-row
id="jupyter"
:title="applications.jupyter.title"
title-link="https://jupyterhub.readthedocs.io/en/stable/"
:status="applications.jupyter.status"
:status-reason="applications.jupyter.statusReason"
:request-status="applications.jupyter.requestStatus"
:request-reason="applications.jupyter.requestReason"
:install-application-request-params="{ hostname: applications.jupyter.hostname }"
title-link="https://jupyterhub.readthedocs.io/en/stable/"
>
<div slot="description">
<p>
......@@ -311,10 +311,10 @@ export default {
<div class="input-group">
<input
type="text"
class="form-control js-hostname"
v-model="applications.jupyter.hostname"
:readonly="jupyterInstalled"
type="text"
class="form-control js-hostname"
/>
<span
class="input-group-btn"
......
......@@ -77,9 +77,9 @@
<div class="content-list pipelines">
<loading-icon
v-if="isLoading"
:label="s__('Pipelines|Loading Pipelines')"
size="3"
v-if="isLoading"
class="prepend-top-20"
/>
......@@ -91,8 +91,8 @@
/>
<div
class="table-holder"
v-else-if="shouldRenderTable"
class="table-holder"
>
<pipelines-table-component
:pipelines="state.pipelines"
......
......@@ -23,9 +23,9 @@
<template>
<div class="landing content-block">
<button
:aria-label="__('Dismiss Cycle Analytics introduction box')"
class="js-ca-dismiss-button dismiss-button"
type="button"
:aria-label="__('Dismiss Cycle Analytics introduction box')"
@click="dismissOverviewDialog"
>
<i
......
......@@ -19,14 +19,14 @@
class="events-info float-right"
>
<i
class="fa fa-warning"
v-tooltip
aria-hidden="true"
:title="n__(
'Limited to showing %d event at most',
'Limited to showing %d events at most',
50
)"
class="fa fa-warning"
aria-hidden="true"
data-placement="top"
>
</i>
......
......@@ -38,8 +38,8 @@
<user-avatar-image :img-src="issue.author.avatarUrl"/>
<h5 class="item-title issue-title">
<a
class="issue-title"
:href="issue.url"
class="issue-title"
>
{{ issue.title }}
</a>
......
......@@ -74,12 +74,12 @@
</template>
<template v-else>
<span
class="merge-request-branch"
v-if="mergeRequest.branch"
class="merge-request-branch"
>
<icon
name="fork"
:size="16"
name="fork"
/>
<a :href="mergeRequest.branch.url">
{{ mergeRequest.branch.name }}
......
......@@ -38,8 +38,8 @@
<ul class="stage-event-list">
<li
v-for="(build, i) in items"
class="stage-event-item item-build-component"
:key="i"
class="stage-event-item item-build-component"
>
<div class="item-details">
<!-- FIXME: Pass an alt attribute here for accessibility -->
......@@ -52,8 +52,8 @@
#{{ build.id }}
</a>
<icon
name="fork"
:size="16"
name="fork"
/>
<a
:href="build.branch.url"
......
......@@ -64,8 +64,8 @@
#{{ build.id }}
</a>
<icon
name="fork"
:size="16"
name="fork"
/>
<a
:href="build.branch.url"
......
......@@ -40,9 +40,9 @@ export default {
<template>
<button
class="btn"
:class="[{ disabled: isLoading }, btnCssClass]"
:disabled="isLoading"
class="btn"
@click="doAction">
<slot></slot>
<loading-icon
......
......@@ -116,8 +116,8 @@ export default {
<div class="append-bottom-default deploy-keys">
<loading-icon
v-if="isLoading && !hasKeys"
size="2"
:label="s__('DeployKeys|Loading deploy keys')"
size="2"
/>
<template v-else-if="hasKeys">
<div class="top-area scrolling-tabs-container inner-page-scroll-tabs">
......@@ -138,16 +138,16 @@ export default {
<navigation-tabs
:tabs="tabs"
@onChangeTab="onChangeTab"
scope="deployKeys"
@onChangeTab="onChangeTab"
/>
</div>
<keys-panel
class="qa-project-deploy-keys"
:project-id="projectId"
:keys="keys[currentTab]"
:store="store"
:endpoint="endpoint"
class="qa-project-deploy-keys"
/>
</template>
</div>
......
......@@ -135,9 +135,9 @@ export default {
<div class="table-mobile-content deploy-project-list">
<template v-if="projects.length > 0">
<a
class="label deploy-project-label"
:title="projectTooltipTitle(firstProject)"
v-tooltip
:title="projectTooltipTitle(firstProject)"
class="label deploy-project-label"
>
<span>
{{ firstProject.project.full_name }}
......@@ -145,22 +145,22 @@ export default {
<icon :name="firstProject.can_push ? 'lock-open' : 'lock'"/>
</a>
<a
v-tooltip
v-if="isExpandable"
:title="restProjectsTooltip"
class="label deploy-project-label"
@click="toggleExpanded"
:title="restProjectsTooltip"
v-tooltip
>
<span>{{ restProjectsLabel }}</span>
</a>
<a
v-else-if="isExpanded"
v-tooltip
v-for="deployKeysProject in restProjects"
v-else-if="isExpanded"
:key="deployKeysProject.project.full_path"
class="label deploy-project-label"
:href="deployKeysProject.project.full_path"
:title="projectTooltipTitle(deployKeysProject)"
v-tooltip
class="label deploy-project-label"
>
<span>
{{ deployKeysProject.project.full_name }}
......@@ -181,8 +181,8 @@ export default {
</div>
<div class="table-mobile-content text-secondary key-created-at">
<span
:title="tooltipTitle(deployKey.created_at)"
v-tooltip>
v-tooltip
:title="tooltipTitle(deployKey.created_at)">
<icon name="calendar"/>
<span>{{ timeFormated(deployKey.created_at) }}</span>
</span>
......@@ -198,34 +198,34 @@ export default {
{{ __('Enable') }}
</action-btn>
<a
v-tooltip
v-if="deployKey.can_edit"
class="btn btn-default text-secondary"
:href="editDeployKeyPath"
:title="__('Edit')"
class="btn btn-default text-secondary"
data-container="body"
v-tooltip
>
<icon name="pencil"/>
</a>
<action-btn
v-tooltip
v-if="isRemovable"
:deploy-key="deployKey"
:title="__('Remove')"
btn-css-class="btn-danger"
type="remove"
:title="__('Remove')"
data-container="body"
v-tooltip
>
<icon name="remove"/>
</action-btn>
<action-btn
v-tooltip
v-else-if="isEnabled"
:deploy-key="deployKey"
:title="__('Disable')"
btn-css-class="btn-warning"
type="disable"
:title="__('Disable')"
data-container="body"
v-tooltip
>
<icon name="cancel"/>
</action-btn>
......
......@@ -59,8 +59,8 @@ export default {
/>
</template>
<div
class="settings-message text-center"
v-else
class="settings-message text-center"
>
{{ s__('DeployKeys|No deploy keys found. Create one with the form above.') }}
</div>
......
......@@ -6,7 +6,10 @@ import Vue from 'vue';
const CommentAndResolveBtn = Vue.extend({
props: {
discussionId: String,
discussionId: {
type: String,
required: true,
},
},
data() {
return {
......
......@@ -7,7 +7,15 @@ import Notes from '../../notes';
import userAvatarImage from '../../vue_shared/components/user_avatar/user_avatar_image.vue';
const DiffNoteAvatars = Vue.extend({
props: ['discussionId'],
components: {
userAvatarImage,
},
props: {
discussionId: {
type: String,
required: true,
},
},
data() {
return {
isVisible: false,
......@@ -17,77 +25,6 @@ const DiffNoteAvatars = Vue.extend({
collapseIcon,
};
},
components: {
userAvatarImage,
},
template: `
<div class="diff-comment-avatar-holders"
:class="discussionClassName"
v-show="notesCount !== 0">
<div v-if="!isVisible">
<!-- FIXME: Pass an alt attribute here for accessibility -->
<user-avatar-image
v-for="note in notesSubset"
:key="note.id"
class="diff-comment-avatar js-diff-comment-avatar"
@click.native="clickedAvatar($event)"
:img-src="note.authorAvatar"
:tooltip-text="getTooltipText(note)"
:data-line-type="lineType"
:size="19"
data-html="true"
/>
<span v-if="notesCount > shownAvatars"
class="diff-comments-more-count has-tooltip js-diff-comment-avatar"
data-container="body"
data-placement="top"
ref="extraComments"
role="button"
:data-line-type="lineType"
:title="extraNotesTitle"
@click="clickedAvatar($event)">{{ moreText }}</span>
</div>
<button class="diff-notes-collapse js-diff-comment-avatar"
type="button"
aria-label="Show comments"
:data-line-type="lineType"
@click="clickedAvatar($event)"
v-if="isVisible"
v-html="collapseIcon">
</button>
</div>
`,
mounted() {
this.$nextTick(() => {
this.addNoCommentClass();
this.setDiscussionVisible();
this.lineType = $(this.$el).closest('.diff-line-num').hasClass('old_line') ? 'old' : 'new';
});
$(document).on('toggle.comments', () => {
this.$nextTick(() => {
this.setDiscussionVisible();
});
});
},
beforeDestroy() {
this.addNoCommentClass();
$(document).off('toggle.comments');
},
watch: {
storeState: {
handler() {
this.$nextTick(() => {
$('.has-tooltip', this.$el).tooltip('_fixTitle');
// We need to add/remove a class to an element that is outside the Vue instance
this.addNoCommentClass();
});
},
deep: true,
},
},
computed: {
discussionClassName() {
return `js-diff-avatars-${this.discussionId}`;
......@@ -128,6 +65,37 @@ const DiffNoteAvatars = Vue.extend({
return `${plusSign}${this.notesCount - this.shownAvatars}`;
},
},
watch: {
storeState: {
handler() {
this.$nextTick(() => {
$('.has-tooltip', this.$el).tooltip('_fixTitle');
// We need to add/remove a class to an element that is outside the Vue instance
this.addNoCommentClass();
});
},
deep: true,
},
},
mounted() {
this.$nextTick(() => {
this.addNoCommentClass();
this.setDiscussionVisible();
this.lineType = $(this.$el).closest('.diff-line-num').hasClass('old_line') ? 'old' : 'new';
});
$(document).on('toggle.comments', () => {
this.$nextTick(() => {
this.setDiscussionVisible();
});
});
},
beforeDestroy() {
this.addNoCommentClass();
$(document).off('toggle.comments');
},
methods: {
clickedAvatar(e) {
Notes.instance.onAddDiffNote(e);
......@@ -164,6 +132,43 @@ const DiffNoteAvatars = Vue.extend({
return `${note.authorName}: ${note.noteTruncated}`;
},
},
template: `
<div class="diff-comment-avatar-holders"
:class="discussionClassName"
v-show="notesCount !== 0">
<div v-if="!isVisible">
<!-- FIXME: Pass an alt attribute here for accessibility -->
<user-avatar-image
v-for="note in notesSubset"
:key="note.id"
class="diff-comment-avatar js-diff-comment-avatar"
@click.native="clickedAvatar($event)"
:img-src="note.authorAvatar"
:tooltip-text="getTooltipText(note)"
:data-line-type="lineType"
:size="19"
data-html="true"
/>
<span v-if="notesCount > shownAvatars"
class="diff-comments-more-count has-tooltip js-diff-comment-avatar"
data-container="body"
data-placement="top"
ref="extraComments"
role="button"
:data-line-type="lineType"
:title="extraNotesTitle"
@click="clickedAvatar($event)">{{ moreText }}</span>
</div>
<button class="diff-notes-collapse js-diff-comment-avatar"
type="button"
aria-label="Show comments"
:data-line-type="lineType"
@click="clickedAvatar($event)"
v-if="isVisible"
v-html="collapseIcon">
</button>
</div>
`,
});
Vue.component('diff-note-avatars', DiffNoteAvatars);
......@@ -10,7 +10,10 @@ import '../mixins/discussion';
const JumpToDiscussion = Vue.extend({
mixins: [DiscussionMixins],
props: {
discussionId: String
discussionId: {
type: String,
required: true,
},
},
data: function () {
return {
......@@ -52,6 +55,9 @@ const JumpToDiscussion = Vue.extend({
return lastId;
}
},
created() {
this.discussion = this.discussions[this.discussionId];
},
methods: {
jumpToNextUnresolvedDiscussion: function () {
let discussionsSelector;
......@@ -202,9 +208,6 @@ const JumpToDiscussion = Vue.extend({
});
}
},
created() {
this.discussion = this.discussions[this.discussionId];
},
});
Vue.component('jump-to-discussion', JumpToDiscussion);
......@@ -8,14 +8,38 @@ import Flash from '../../flash';
const ResolveBtn = Vue.extend({
props: {
noteId: Number,
discussionId: String,
resolved: Boolean,
canResolve: Boolean,
resolvedBy: String,
authorName: String,
authorAvatar: String,
noteTruncated: String,
noteId: {
type: Number,
required: true,
},
discussionId: {
type: String,
required: true,
},
resolved: {
type: Boolean,
required: true,
},
canResolve: {
type: Boolean,
required: true,
},
resolvedBy: {
type: String,
required: true,
},
authorName: {
type: String,
required: true,
},
authorAvatar: {
type: String,
required: true,
},
noteTruncated: {
type: String,
required: true,
},
},
data: function () {
return {
......@@ -23,12 +47,6 @@ const ResolveBtn = Vue.extend({
loading: false
};
},
watch: {
'discussions': {
handler: 'updateTooltip',
deep: true
}
},
computed: {
discussion: function () {
return this.discussions[this.discussionId];
......@@ -56,6 +74,32 @@ const ResolveBtn = Vue.extend({
return this.note.resolved_by;
},
},
watch: {
'discussions': {
handler: 'updateTooltip',
deep: true
}
},
mounted: function () {
$(this.$refs.button).tooltip({
container: 'body'
});
},
beforeDestroy: function () {
CommentsStore.delete(this.discussionId, this.noteId);
},
created: function () {
CommentsStore.create({
discussionId: this.discussionId,
noteId: this.noteId,
canResolve: this.canResolve,
resolved: this.resolved,
resolvedBy: this.resolvedBy,
authorName: this.authorName,
authorAvatar: this.authorAvatar,
noteTruncated: this.noteTruncated,
});
},
methods: {
updateTooltip: function () {
this.$nextTick(() => {
......@@ -95,26 +139,6 @@ const ResolveBtn = Vue.extend({
.catch(() => new Flash('An error occurred when trying to resolve a comment. Please try again.'));
}
},
mounted: function () {
$(this.$refs.button).tooltip({
container: 'body'
});
},
beforeDestroy: function () {
CommentsStore.delete(this.discussionId, this.noteId);
},
created: function () {
CommentsStore.create({
discussionId: this.discussionId,
noteId: this.noteId,
canResolve: this.canResolve,
resolved: this.resolved,
resolvedBy: this.resolvedBy,
authorName: this.authorName,
authorAvatar: this.authorAvatar,
noteTruncated: this.noteTruncated,
});
}
});
Vue.component('resolve-btn', ResolveBtn);
......@@ -9,7 +9,10 @@ import '../mixins/discussion';
window.ResolveCount = Vue.extend({
mixins: [DiscussionMixins],
props: {
loggedOut: Boolean
loggedOut: {
type: Boolean,
required: true,
},
},
data: function () {
return {
......
......@@ -6,9 +6,18 @@ import Vue from 'vue';
const ResolveDiscussionBtn = Vue.extend({
props: {
discussionId: String,
mergeRequestId: Number,
canResolve: Boolean,
discussionId: {
type: String,
required: true,
},
mergeRequestId: {
type: Number,
required: true,
},
canResolve: {
type: Boolean,
required: true,
},
},
data: function() {
return {
......@@ -45,16 +54,16 @@ const ResolveDiscussionBtn = Vue.extend({
}
}
},
methods: {
resolve: function () {
ResolveService.toggleResolveForDiscussion(this.mergeRequestId, this.discussionId);
}
},
created: function () {
CommentsStore.createDiscussion(this.discussionId, this.canResolve);
this.discussion = CommentsStore.state[this.discussionId];
},
methods: {
resolve: function () {
ResolveService.toggleResolveForDiscussion(this.mergeRequestId, this.discussionId);
}
},
});
Vue.component('resolve-discussion-btn', ResolveDiscussionBtn);
......@@ -43,17 +43,17 @@
<div class="environments-container">
<loading-icon
v-if="isLoading"
class="prepend-top-default"
label="Loading environments"
v-if="isLoading"
size="3"
/>
<slot name="emptyState"></slot>
<div
class="table-holder"
v-if="!isLoading && environments.length > 0">
v-if="!isLoading && environments.length > 0"
class="table-holder">
<environment-table
:environments="environments"
......
......@@ -52,18 +52,18 @@
role="group">
<button
v-tooltip
:title="title"
:aria-label="title"
:disabled="isLoading"
type="button"
class="dropdown btn btn-default dropdown-new js-dropdown-play-icon-container"
data-container="body"
data-toggle="dropdown"
:title="title"
:aria-label="title"
:disabled="isLoading"
>
<span>
<icon
name="play"
:size="12"
name="play"
/>
<i
class="fa fa-caret-down"
......@@ -79,15 +79,15 @@
v-for="(action, i) in actions"
:key="i">
<button
:class="{ disabled: isActionDisabled(action) }"
:disabled="isActionDisabled(action)"
type="button"
class="js-manual-action-link no-btn btn"
@click="onClickAction(action.play_path)"
:class="{ disabled: isActionDisabled(action) }"
:disabled="isActionDisabled(action)"
>
<icon
name="play"
:size="12"
name="play"
/>
<span>
{{ action.name }}
......
......@@ -29,17 +29,17 @@
<template>
<a
v-tooltip
:title="title"
:aria-label="title"
:href="externalUrl"
class="btn external-url"
data-container="body"
target="_blank"
rel="noopener noreferrer nofollow"
:title="title"
:aria-label="title"
:href="externalUrl"
>
<icon
name="external-link"
:size="12"
name="external-link"
/>
</a>
</template>
......@@ -427,11 +427,11 @@
</script>
<template>
<div
class="gl-responsive-table-row"
:class="{
'js-child-row environment-child-row': model.isChildren,
'folder-row': model.isFolder,
}"
class="gl-responsive-table-row"
role="row">
<div
class="table-section section-10"
......@@ -446,19 +446,19 @@
</div>
<a
v-if="!model.isFolder"
class="environment-name flex-truncate-parent table-mobile-content"
:href="environmentPath">
:href="environmentPath"
class="environment-name flex-truncate-parent table-mobile-content">
<span
class="flex-truncate-child"
v-tooltip
:title="model.name"
class="flex-truncate-child"
>{{ model.name }}</span>
</a>
<span
v-else
class="folder-name"
@click="onClickFolder"
role="button">
role="button"
@click="onClickFolder">
<span class="folder-icon">
<i
......@@ -503,11 +503,11 @@
<span v-if="!model.isFolder && deploymentHasUser">
by
<user-avatar-link
class="js-deploy-user-container"
:link-href="deploymentUser.web_url"
:img-src="deploymentUser.avatar_url"
:img-alt="userImageAltDescription"
:tooltip-text="deploymentUser.username"
class="js-deploy-user-container"
/>
</span>
</div>
......@@ -518,8 +518,8 @@
>
<a
v-if="shouldRenderBuildName"
class="build-link flex-truncate-parent"
:href="buildPath"
class="build-link flex-truncate-parent"
>
<span class="flex-truncate-child">{{ buildName }}</span>
</a>
......
......@@ -28,16 +28,16 @@
<template>
<a
v-tooltip
class="btn monitoring-url d-none d-sm-none d-md-block"
data-container="body"
rel="noopener noreferrer nofollow"
:href="monitoringUrl"
:title="title"
:aria-label="title"
class="btn monitoring-url d-none d-sm-none d-md-block"
data-container="body"
rel="noopener noreferrer nofollow"
>
<icon
name="chart"
:size="12"
name="chart"
/>
</a>
</template>
......@@ -39,10 +39,10 @@
</script>
<template>
<button
:disabled="isLoading"
type="button"
class="btn d-none d-sm-none d-md-block"
@click="onClick"
:disabled="isLoading"
>
<span v-if="isLastDeployment">
......
......@@ -54,13 +54,13 @@
<template>
<button
v-tooltip
:disabled="isLoading"
:title="title"
:aria-label="title"
type="button"
class="btn stop-env-link d-none d-sm-none d-md-block"
data-container="body"
@click="onClick"
:disabled="isLoading"
:title="title"
:aria-label="title"
>
<i
class="fa fa-stop stop-env-icon"
......
......@@ -30,15 +30,15 @@
<template>
<a
v-tooltip
class="btn terminal-button d-none d-sm-none d-md-block"
data-container="body"
:title="title"
:aria-label="title"
:href="terminalPath"
class="btn terminal-button d-none d-sm-none d-md-block"
data-container="body"
>
<icon
name="terminal"
:size="12"
name="terminal"
/>
</a>
</template>
......@@ -93,8 +93,8 @@
<div class="top-area">
<tabs
:tabs="tabs"
@onChangeTab="onChangeTab"
scope="environments"
@onChangeTab="onChangeTab"
/>
<div
......@@ -119,8 +119,8 @@
@onChangePage="onChangePage"
>
<empty-state
slot="emptyState"
v-if="!isLoading && state.environments.length === 0"
slot="emptyState"
:new-path="newEnvironmentPath"
:help-path="helpPagePath"
:can-create-environment="canCreateEnvironment"
......
......@@ -39,8 +39,8 @@
<template>
<div :class="cssContainerClass">
<div
class="top-area"
v-if="!isLoading"
class="top-area"
>
<h4 class="js-folder-name environments-folder-name">
......@@ -49,8 +49,8 @@
<tabs
:tabs="tabs"
@onChangeTab="onChangeTab"
scope="environments"
@onChangeTab="onChangeTab"
/>
</div>
......
......@@ -72,9 +72,9 @@ export default {
@click="onItemActivated(item.text)">
<span>
<span
class="filtered-search-history-dropdown-token"
v-for="(token, index) in item.tokens"
:key="`dropdown-token-${index}`"
class="filtered-search-history-dropdown-token"
>
<span class="name">{{ token.prefix }}</span>
<span class="value">{{ token.suffix }}</span>
......
......@@ -216,10 +216,10 @@ export default {
<template>
<div>
<loading-icon
class="loading-animation prepend-top-20"
size="2"
v-if="isLoading"
:label="s__('GroupsTree|Loading groups')"
class="loading-animation prepend-top-20"
size="2"
/>
<groups-component
v-if="!isLoading"
......@@ -230,10 +230,10 @@ export default {
/>
<deprecated-modal
v-show="showModal"
kind="warning"
:primary-button-label="__('Leave')"
:title="__('Are you sure?')"
:text="groupLeaveConfirmationMessage"
kind="warning"
@cancel="hideLeaveGroupModal"
@submit="leaveGroup"
/>
......
......@@ -71,14 +71,14 @@ export default {
<template>
<li
@click.stop="onClickRowGroup"
:id="groupDomId"
:class="rowClass"
class="group-row"
@click.stop="onClickRowGroup"
>
<div
class="group-row-contents"
:class="{ 'project-row-contents': !isGroup }">
:class="{ 'project-row-contents': !isGroup }"
class="group-row-contents">
<item-actions
v-if="isGroup"
:group="group"
......@@ -99,8 +99,8 @@ export default {
/>
</div>
<div
class="avatar-container prepend-top-8 prepend-left-5 s24 d-none d-sm-block"
:class="{ 'content-loading': group.isChildrenLoading }"
class="avatar-container prepend-top-8 prepend-left-5 s24 d-none d-sm-block"
>
<a
:href="group.relativePath"
......@@ -108,14 +108,14 @@ export default {
>
<img
v-if="hasAvatar"
class="avatar s24"
:src="group.avatarUrl"
class="avatar s24"
/>
<identicon
v-else
size-class="s24"
:entity-id="group.id"
:entity-name="group.name"
size-class="s24"
/>
</a>
</div>
......
......@@ -54,13 +54,13 @@ export default {
<a
v-tooltip
v-if="group.canLeave"
@click.prevent="onLeaveGroup"
:href="group.leavePath"
:title="leaveBtnTitle"
:aria-label="leaveBtnTitle"
data-container="body"
data-placement="bottom"
class="leave-group btn no-expand">
class="leave-group btn no-expand"
@click.prevent="onLeaveGroup">
<icon name="leave"/>
</a>
</div>
......
......@@ -45,44 +45,44 @@
<div class="stats">
<item-stats-value
v-if="isGroup"
css-class="number-subgroups"
icon-name="folder"
:title="__('Subgroups')"
:value="item.subgroupCount"
css-class="number-subgroups"
icon-name="folder"
/>
<item-stats-value
v-if="isGroup"
css-class="number-projects"
icon-name="bookmark"
:title="__('Projects')"
:value="item.projectCount"
css-class="number-projects"
icon-name="bookmark"
/>
<item-stats-value
v-if="isGroup"
css-class="number-users"
icon-name="users"
:title="__('Members')"
:value="item.memberCount"
css-class="number-users"
icon-name="users"
/>
<item-stats-value
v-if="isProject"
:value="item.starCount"
css-class="project-stars"
icon-name="star"
:value="item.starCount"
/>
<item-stats-value
css-class="item-visibility"
tooltip-placement="left"
:icon-name="visibilityIcon"
:title="visibilityTooltip"
css-class="item-visibility"
tooltip-placement="left"
/>
<div
class="last-updated"
v-if="isProject"
class="last-updated"
>
<time-ago-tooltip
tooltip-placement="bottom"
:time="item.updatedAt"
tooltip-placement="bottom"
/>
</div>
</div>
......
......@@ -52,10 +52,10 @@
<template>
<span
v-tooltip
data-container="body"
:data-placement="tooltipPlacement"
:class="cssClass"
:title="title"
data-container="body"
>
<icon :name="iconName" />
<span
......
......@@ -39,12 +39,12 @@ export default {
<li v-once>
<a
v-tooltip
data-container="body"
data-placement="right"
:href="goBackUrl"
class="ide-sidebar-link"
:title="s__('IDE|Go back')"
:aria-label="s__('IDE|Go back')"
data-container="body"
data-placement="right"
class="ide-sidebar-link"
>
<icon
:size="16"
......@@ -55,16 +55,16 @@ export default {
<li>
<button
v-tooltip
data-container="body"
data-placement="right"
type="button"
class="ide-sidebar-link js-ide-edit-mode"
:class="{
active: currentActivityView === $options.activityBarViews.edit
}"
@click.prevent="changedActivityView($event, $options.activityBarViews.edit)"
:title="s__('IDE|Edit')"
:aria-label="s__('IDE|Edit')"
data-container="body"
data-placement="right"
type="button"
class="ide-sidebar-link js-ide-edit-mode"
@click.prevent="changedActivityView($event, $options.activityBarViews.edit)"
>
<icon
name="code"
......@@ -74,16 +74,16 @@ export default {
<li>
<button
v-tooltip
data-container="body"
data-placement="right"
type="button"
class="ide-sidebar-link js-ide-review-mode"
:class="{
active: currentActivityView === $options.activityBarViews.review
}"
@click.prevent="changedActivityView($event, $options.activityBarViews.review)"
:title="s__('IDE|Review')"
:aria-label="s__('IDE|Review')"
data-container="body"
data-placement="right"
type="button"
class="ide-sidebar-link js-ide-review-mode"
@click.prevent="changedActivityView($event, $options.activityBarViews.review)"
>
<icon
name="file-modified"
......@@ -93,16 +93,16 @@ export default {
<li v-show="hasChanges">
<button
v-tooltip
data-container="body"
data-placement="right"
type="button"
class="ide-sidebar-link js-ide-commit-mode"
:class="{
active: currentActivityView === $options.activityBarViews.commit
}"
@click.prevent="changedActivityView($event, $options.activityBarViews.commit)"
:title="s__('IDE|Commit')"
:aria-label="s__('IDE|Commit')"
data-container="body"
data-placement="right"
type="button"
class="ide-sidebar-link js-ide-commit-mode"
@click.prevent="changedActivityView($event, $options.activityBarViews.commit)"
>
<icon
name="commit"
......
......@@ -91,7 +91,6 @@ export default {
<template>
<div
class="multi-file-commit-form"
:class="{
'is-compact': isCompact,
'is-full': !isCompact
......@@ -99,6 +98,7 @@ export default {
:style="{
height: componentHeight ? `${componentHeight}px` : null,
}"
class="multi-file-commit-form"
>
<transition
name="commit-form-slide-up"
......@@ -108,12 +108,12 @@ export default {
>
<div
v-if="isCompact"
class="commit-form-compact"
ref="compactEl"
class="commit-form-compact"
>
<button
type="button"
:disabled="!hasChanges"
type="button"
class="btn btn-primary btn-sm btn-block"
@click="toggleIsSmall"
>
......@@ -126,8 +126,8 @@ export default {
</div>
<form
v-if="!isCompact"
@submit.prevent.stop="commitChanges"
ref="formEl"
@submit.prevent.stop="commitChanges"
>
<transition name="fade">
<success-message
......@@ -143,8 +143,8 @@ export default {
<loading-button
:loading="submitCommitLoading"
:disabled="commitButtonDisabled"
container-class="btn btn-success btn-sm float-left"
:label="__('Commit')"
container-class="btn btn-success btn-sm float-left"
@click="commitChanges"
/>
<button
......
......@@ -66,10 +66,10 @@ export default {
<template>
<fieldset class="common-note-form ide-commit-message-field">
<div
class="md-area"
:class="{
'is-focused': isFocused
}"
class="md-area"
>
<div
v-once
......@@ -92,10 +92,10 @@ export default {
<div class="ide-commit-message-textarea-container">
<div class="ide-commit-message-highlights-container">
<div
class="note-textarea highlights monospace"
:style="{
transform: `translate3d(0, ${-scrollTop}px, 0)`
}"
class="note-textarea highlights monospace"
>
<div
v-for="(line, index) in allLines"
......@@ -113,15 +113,15 @@ export default {
</div>
</div>
<textarea
class="note-textarea ide-commit-message-textarea"
name="commit-message"
ref="textarea"
:placeholder="__('Write a commit message...')"
:value="text"
class="note-textarea ide-commit-message-textarea"
name="commit-message"
@scroll="handleScroll"
@input="onInput"
@focus="updateIsFocused(true)"
@blur="updateIsFocused(false)"
ref="textarea"
>
</textarea>
</div>
......
......@@ -58,12 +58,12 @@ export default {
}"
>
<input
type="radio"
name="commit-action"
:value="value"
@change="updateCommitAction($event.target.value)"
:checked="commitAction === value"
:disabled="disabled"
type="radio"
name="commit-action"
@change="updateCommitAction($event.target.value)"
/>
<span class="prepend-left-10">
<span
......@@ -80,9 +80,9 @@ export default {
class="ide-commit-new-branch"
>
<input
:placeholder="newBranchName"
type="text"
class="form-control monospace"
:placeholder="newBranchName"
@input="updateBranchName($event.target.value)"
/>
</div>
......
......@@ -29,30 +29,30 @@ export default {
>
<button
v-tooltip
type="button"
class="btn btn-blank append-right-5"
:aria-label="__('Stage changes')"
:title="__('Stage changes')"
type="button"
class="btn btn-blank append-right-5"
data-container="body"
@click.stop="stageChange(path)"
>
<icon
name="mobile-issue-close"
:size="12"
name="mobile-issue-close"
/>
</button>
<button
v-tooltip
type="button"
class="btn btn-blank"
:aria-label="__('Discard changes')"
:title="__('Discard changes')"
type="button"
class="btn btn-blank"
data-container="body"
@click.stop="discardFileChanges(path)"
>
<icon
name="remove"
:size="12"
name="remove"
/>
</button>
</div>
......
......@@ -29,16 +29,16 @@ export default {
>
<button
v-tooltip
type="button"
class="btn btn-blank"
:aria-label="__('Unstage changes')"
:title="__('Unstage changes')"
type="button"
class="btn btn-blank"
data-container="body"
@click="unstageChange(path)"
>
<icon
name="history"
:size="12"
name="history"
/>
</button>
</div>
......
......@@ -44,11 +44,11 @@ export default {
<ul>
<li>
<a
href="#"
@click.prevent="changeMode($options.viewerTypes.mr)"
:class="{
'is-active': viewer === $options.viewerTypes.mr,
}"
href="#"
@click.prevent="changeMode($options.viewerTypes.mr)"
>
<strong class="dropdown-menu-inner-title">
{{ mergeReviewLine }}
......@@ -60,11 +60,11 @@ export default {
</li>
<li>
<a
href="#"
@click.prevent="changeMode($options.viewerTypes.diff)"
:class="{
'is-active': viewer === $options.viewerTypes.diff,
}"
href="#"
@click.prevent="changeMode($options.viewerTypes.diff)"
>
<strong class="dropdown-menu-inner-title">{{ __('Reviewing') }}</strong>
<span class="dropdown-menu-inner-content">
......
......@@ -26,15 +26,15 @@ export default {
>
<a
:href="file.permalink"
target="_blank"
:title="s__('IDE|Open in file view')"
target="_blank"
rel="noopener noreferrer"
>
<span class="vertical-align-middle">Open in file view</span>
<icon
:size="16"
name="external-link"
css-classes="vertical-align-middle space-right"
:size="16"
/>
</a>
</div>
......
......@@ -173,38 +173,38 @@ export default {
>
<div class="dropdown-input">
<input
ref="searchInput"
:placeholder="__('Search files')"
v-model="searchText"
type="search"
class="dropdown-input-field"
:placeholder="__('Search files')"
autocomplete="off"
v-model="searchText"
ref="searchInput"
@keydown="onKeydown($event)"
@keyup="onKeyup($event)"
/>
<i
aria-hidden="true"
class="fa fa-search dropdown-input-search"
:class="{
hidden: showClearInputButton
}"
aria-hidden="true"
class="fa fa-search dropdown-input-search"
></i>
<i
role="button"
:aria-label="__('Clear search input')"
class="fa fa-times dropdown-input-clear"
:class="{
show: showClearInputButton
}"
role="button"
class="fa fa-times dropdown-input-clear"
@click="clearSearchInput"
></i>
</div>
<div>
<virtual-list
ref="virtualScrollList"
:size="listHeight"
:remain="listShowCount"
wtag="ul"
ref="virtualScrollList"
>
<template v-if="filteredBlobsLength">
<li
......@@ -212,11 +212,11 @@ export default {
:key="file.key"
>
<item
class="disable-hover"
:file="file"
:search-text="searchText"
:focused="index === focusedIndex"
:index="index"
class="disable-hover"
@click="openFile"
@mouseover="onMouseOver"
@mousemove="onMouseMove"
......
......@@ -59,11 +59,11 @@ export default {
<template>
<button
type="button"
class="diff-changed-file"
:class="{
'is-focused': focused,
}"
type="button"
class="diff-changed-file"
@click.prevent="clickRow"
@mouseover="mouseOverRow"
@mousemove="mouseMove"
......
......@@ -93,8 +93,8 @@ export default {
:merge-request-id="currentMergeRequestId"
/>
<repo-editor
class="multi-file-edit-pane-content"
:file="activeFile"
class="multi-file-edit-pane-content"
/>
</template>
<template
......
......@@ -36,8 +36,8 @@ export default {
<template>
<ide-tree-list
:viewer-type="viewer"
header-class="ide-review-header"
:disable-action-dropdown="true"
header-class="ide-review-header"
>
<template
slot="header"
......
......@@ -115,17 +115,17 @@ export default {
<div class="multi-file-commit-panel-inner">
<template v-if="loading">
<div
class="multi-file-loading-container"
v-for="n in 3"
:key="n"
class="multi-file-loading-container"
>
<skeleton-loading-container />
</div>
</template>
<template v-else>
<div
class="context-header ide-context-header dropdown"
ref="mergeRequestDropdown"
class="context-header ide-context-header dropdown"
>
<button
type="button"
......@@ -136,18 +136,18 @@ export default {
class="avatar-container s40 project-avatar"
>
<project-avatar-image
class="avatar-container project-avatar"
:link-href="currentProject.path"
:img-src="currentProject.avatar_url"
:img-alt="currentProject.name"
:img-size="40"
class="avatar-container project-avatar"
/>
</div>
<identicon
v-else
size-class="s40"
:entity-id="currentProject.id"
:entity-name="currentProject.name"
size-class="s40"
/>
<div class="ide-sidebar-project-title">
<div class="sidebar-context-title">
......@@ -155,11 +155,11 @@ export default {
</div>
<div class="d-flex">
<div
v-tooltip
v-if="currentBranchId"
class="sidebar-context-title ide-sidebar-branch-title"
ref="branchId"
v-tooltip
:title="branchTooltipTitle"
class="sidebar-context-title ide-sidebar-branch-title"
>
<icon
name="branch"
......@@ -168,10 +168,10 @@ export default {
</div>
<div
v-if="currentMergeRequestId"
class="sidebar-context-title ide-sidebar-branch-title"
:class="{
'prepend-left-8': currentBranchId
}"
class="sidebar-context-title ide-sidebar-branch-title"
>
<icon
name="git-merge"
......
......@@ -75,22 +75,22 @@ export default {
<template>
<footer class="ide-status-bar">
<div
class="ide-status-branch"
v-if="lastCommit && lastCommitFormatedAge"
class="ide-status-branch"
>
<span
class="ide-status-pipeline"
v-if="latestPipeline && latestPipeline.details"
class="ide-status-pipeline"
>
<ci-icon
:status="latestPipeline.details.status"
v-tooltip
:status="latestPipeline.details.status"
:title="latestPipeline.details.status.text"
/>
Pipeline
<a
class="monospace"
:href="latestPipeline.details.status.details_path">#{{ latestPipeline.id }}</a>
:href="latestPipeline.details.status.details_path"
class="monospace">#{{ latestPipeline.id }}</a>
{{ latestPipeline.details.status.text }}
for
</span>
......@@ -100,18 +100,18 @@ export default {
/>
<a
v-tooltip
class="commit-sha"
:title="lastCommit.message"
:href="getCommitPath(lastCommit.short_id)"
class="commit-sha"
>{{ lastCommit.short_id }}</a>
by
{{ lastCommit.author_name }}
<time
v-tooltip
data-placement="top"
data-container="body"
:datetime="lastCommit.committed_date"
:title="tooltipTitle(lastCommit.committed_date)"
data-placement="top"
data-container="body"
>
{{ lastCommitFormatedAge }}
</time>
......@@ -129,8 +129,8 @@ export default {
{{ file.eol }}
</div>
<div
class="ide-status-file"
v-if="file && !file.binary">
v-if="file && !file.binary"
class="ide-status-file">
{{ file.editorRow }}:{{ file.editorColumn }}
</div>
<div
......
......@@ -50,17 +50,17 @@ export default {
>
<template v-if="showLoading">
<div
class="multi-file-loading-container"
v-for="n in 3"
:key="n"
class="multi-file-loading-container"
>
<skeleton-loading-container />
</div>
</template>
<template v-else>
<header
class="ide-tree-header"
:class="headerClass"
class="ide-tree-header"
>
<slot name="header"></slot>
</header>
......
......@@ -93,10 +93,10 @@ export default {
<a
v-tooltip
:title="__('Show complete raw log')"
:href="detailJob.rawPath"
data-placement="top"
data-container="body"
class="controllers-buttons"
:href="detailJob.rawPath"
target="_blank"
>
<i
......@@ -105,20 +105,20 @@ export default {
></i>
</a>
<scroll-button
direction="up"
:disabled="isScrolledToTop"
direction="up"
@click="scrollUp"
/>
<scroll-button
direction="down"
:disabled="isScrolledToBottom"
direction="down"
@click="scrollDown"
/>
</div>
</div>
<pre
class="build-trace mb-0 h-100"
ref="buildTrace"
class="build-trace mb-0 h-100"
@scroll="scrollBuildLog"
>
<code
......
......@@ -24,10 +24,10 @@ export default {
<template>
<div class="d-flex align-items-center">
<ci-icon
class="d-flex"
:status="job.status"
:borderless="true"
:size="24"
class="d-flex"
/>
<span class="prepend-left-8">
{{ job.name }}
......@@ -38,8 +38,8 @@ export default {
>
{{ jobId }}
<icon
name="external-link"
:size="12"
name="external-link"
/>
</a>
</span>
......
......@@ -47,15 +47,15 @@ export default {
<template>
<div
v-tooltip
:title="tooltipTitle"
class="controllers-buttons"
data-container="body"
data-placement="top"
:title="tooltipTitle"
>
<button
:disabled="disabled"
class="btn-scroll btn-transparent btn-blank"
type="button"
:disabled="disabled"
@click="clickedScroll"
>
<icon
......
......@@ -27,8 +27,8 @@ export default {
<template>
<div class="ide-job-item">
<job-description
class="append-right-default"
:job="job"
class="append-right-default"
/>
<div class="ml-auto align-self-center">
<button
......
......@@ -60,10 +60,10 @@ export default {
class="ide-stage card prepend-top-default"
>
<div
class="card-header"
:class="{
'border-bottom-0': stage.isCollapsed
}"
class="card-header"
@click="toggleCollapsed"
>
<ci-icon
......@@ -72,10 +72,10 @@ export default {
/>
<strong
v-tooltip="showTooltip"
ref="stageTitle"
:title="showTooltip ? stage.name : null"
data-container="body"
class="prepend-left-8 ide-stage-title"
ref="stageTitle"
>
{{ stage.name }}
</strong>
......@@ -93,8 +93,8 @@ export default {
/>
</div>
<div
class="card-body"
v-show="!stage.isCollapsed"
class="card-body"
>
<loading-icon
v-if="showLoadingIcon"
......
......@@ -42,8 +42,8 @@ export default {
</span>
</template>
<list
type="created"
:empty-text="__('You have not created any merge requests')"
type="created"
/>
</tab>
<tab>
......@@ -54,8 +54,8 @@ export default {
</span>
</template>
<list
type="assigned"
:empty-text="__('You do not have any assigned merge requests')"
type="assigned"
/>
</tab>
</tabs>
......
......@@ -47,8 +47,8 @@ export default {
<span class="d-flex append-right-default ide-merge-request-current-icon">
<icon
v-if="isActive"
name="mobile-issue-close"
:size="18"
name="mobile-issue-close"
/>
</span>
<span>
......
......@@ -80,12 +80,12 @@ export default {
<div>
<div class="dropdown-input mt-3 pb-3 mb-0 border-bottom">
<input
type="search"
class="dropdown-input-field"
ref="searchInput"
:placeholder="__('Search merge requests')"
v-model="search"
type="search"
class="dropdown-input-field"
@input="searchMergeRequests"
ref="searchInput"
/>
<i
aria-hidden="true"
......@@ -94,8 +94,8 @@ export default {
</div>
<div class="dropdown-content ide-merge-requests-dropdown-content d-flex">
<loading-icon
class="mt-3 mb-3 align-self-center ml-auto mr-auto"
v-if="isLoading"
class="mt-3 mb-3 align-self-center ml-auto mr-auto"
size="2"
/>
<ul
......
......@@ -14,10 +14,10 @@ export default {
<template>
<icon
name="git-merge"
v-tooltip
:title="__('Part of merge request changes')"
css-classes="append-right-8"
:size="12"
name="git-merge"
css-classes="append-right-8"
/>
</template>
......@@ -55,10 +55,10 @@ export default {
<template>
<div class="ide-new-btn">
<div
class="dropdown"
:class="{
show: dropdownOpen,
}"
class="dropdown"
>
<button
type="button"
......@@ -67,19 +67,19 @@ export default {
@click.stop="openDropdown()"
>
<icon
name="plus"
:size="12"
name="plus"
css-classes="float-left"
/>
<icon
name="arrow-down"
:size="12"
name="arrow-down"
css-classes="float-left"
/>
</button>
<ul
class="dropdown-menu dropdown-menu-right"
ref="dropdownMenu"
class="dropdown-menu dropdown-menu-right"
>
<li>
<a
......
......@@ -71,18 +71,18 @@ export default {
>
<form
slot="body"
@submit.prevent="createEntryInStore"
class="form-group row"
@submit.prevent="createEntryInStore"
>
<label class="label-light col-form-label col-sm-3">
{{ __('Name') }}
</label>
<div class="col-sm-9">
<input
ref="fieldName"
v-model="entryName"
type="text"
class="form-control"
v-model="entryName"
ref="fieldName"
/>
</div>
</form>
......
......@@ -67,9 +67,9 @@
</a>
<input
id="file-upload"
ref="fileUpload"
type="file"
class="hidden"
ref="fileUpload"
/>
</div>
</template>
......@@ -44,10 +44,10 @@ export default {
>
<resizable-panel
v-if="rightPane"
class="multi-file-commit-panel-inner"
:collapsible="false"
:initial-width="350"
:min-size="350"
class="multi-file-commit-panel-inner"
side="right"
>
<component :is="rightPane" />
......@@ -57,13 +57,13 @@ export default {
<li>
<button
v-tooltip
data-container="body"
data-placement="left"
:title="__('Pipelines')"
class="ide-sidebar-link is-right"
:class="{
active: pipelinesActive
}"
data-container="body"
data-placement="left"
class="ide-sidebar-link is-right"
type="button"
@click="clickTab($event, $options.rightSidebarViews.pipelines)"
>
......
......@@ -75,8 +75,8 @@ export default {
>
#{{ latestPipeline.id }}
<icon
name="external-link"
:size="12"
name="external-link"
/>
</a>
</span>
......
......@@ -72,8 +72,8 @@ export default {
<deprecated-modal
id="ide-create-branch-modal"
:primary-button-label="__('Create new branch')"
kind="success"
:title="__('Branch has changed')"
kind="success"
@submit="forceCreateNewBranch"
>
<template slot="body">
......@@ -85,22 +85,22 @@ export default {
v-if="showStageUnstageArea"
>
<commit-files-list
class="is-first"
icon-name="unstaged"
:title="__('Unstaged')"
:file-list="changedFiles"
action="stageAllChanges"
:action-btn-text="__('Stage all')"
class="is-first"
icon-name="unstaged"
action="stageAllChanges"
item-action-component="stage-button"
/>
<commit-files-list
icon-name="staged"
:title="__('Staged')"
:file-list="stagedFiles"
action="unstageAllChanges"
:action-btn-text="__('Unstage all')"
item-action-component="unstage-button"
:staged-list="true"
icon-name="staged"
action="unstageAllChanges"
item-action-component="unstage-button"
/>
</template>
<empty-state
......
......@@ -190,8 +190,8 @@ export default {
>
<div class="ide-mode-tabs clearfix" >
<ul
class="nav-links float-left"
v-if="!shouldHideEditor && isEditModeActive"
class="nav-links float-left"
>
<li :class="editTabCSS">
<a
......@@ -224,10 +224,10 @@ export default {
<div
v-show="!shouldHideEditor && file.viewMode === 'edit'"
ref="editor"
class="multi-file-editor-holder"
:class="{
'is-readonly': isCommitModeActive,
}"
class="multi-file-editor-holder"
>
</div>
<content-viewer
......
......@@ -120,17 +120,17 @@ export default {
<template>
<div>
<div
class="file"
:class="fileClass"
@click="clickFile"
class="file"
role="button"
@click="clickFile"
>
<div
class="file-name"
>
<span
class="ide-file-name str-truncated"
:style="levelIndentation"
class="ide-file-name str-truncated"
>
<file-icon
:file-name="file.name"
......@@ -156,10 +156,10 @@ export default {
<icon
v-tooltip
:title="folderChangesTooltip"
:size="12"
data-container="body"
data-placement="right"
name="file-modified"
:size="12"
css-classes="prepend-left-5 multi-file-modified"
/>
</span>
......
......@@ -26,8 +26,8 @@ export default {
<template>
<span
v-if="file.file_lock"
v-tooltip
v-if="file.file_lock"
:title="lockTooltip"
data-container="body"
>
......
......@@ -33,8 +33,8 @@
<td class="d-none d-sm-block">
<skeleton-loading-container
class="animation-container-right"
:small="true"
class="animation-container-right"
/>
</td>
</template>
......
......@@ -76,8 +76,8 @@ export default {
@mouseout="mouseOutTab"
>
<div
class="multi-file-tab"
:title="tab.url"
class="multi-file-tab"
>
<file-icon
:file-name="tab.name"
......@@ -89,16 +89,16 @@ export default {
/>
</div>
<button
:aria-label="closeLabel"
:disabled="tab.pending"
type="button"
class="multi-file-tab-close"
@click.stop.prevent="closeFile(tab)"
:aria-label="closeLabel"
:disabled="tab.pending"
>
<icon
v-if="!showChangedIcon"
name="close"
:size="12"
name="close"
/>
<changed-file-icon
v-else
......
......@@ -52,8 +52,8 @@ export default {
<template>
<div class="multi-file-tabs">
<ul
class="list-unstyled append-bottom-0"
ref="tabsScroller"
class="list-unstyled append-bottom-0"
>
<repo-tab
v-for="tab in files"
......
......@@ -63,11 +63,11 @@ export default {
<template>
<div
class="multi-file-commit-panel"
:class="{
'is-collapsed': collapsed && collapsible,
}"
:style="panelStyle"
class="multi-file-commit-panel"
@click="toggleFullbarCollapsed"
>
<slot></slot>
......@@ -77,9 +77,9 @@ export default {
:start-size="initialWidth"
:min-size="minSize"
:max-size="$options.maxSize"
:side="side === 'right' ? 'left' : 'right'"
@resize-start="setResizingStatus(true)"
@resize-end="setResizingStatus(false)"
:side="side === 'right' ? 'left' : 'right'"
/>
</div>
</template>
......@@ -110,25 +110,25 @@
<template>
<div
v-if="descriptionHtml"
class="description"
:class="{
'js-task-list-container': canUpdate
}"
class="description"
>
<div
class="wiki"
ref="gfm-content"
:class="{
'issue-realtime-pre-pulse': preAnimation,
'issue-realtime-trigger-pulse': pulseAnimation
}"
v-html="descriptionHtml"
ref="gfm-content">
class="wiki"
v-html="descriptionHtml">
</div>
<textarea
class="hidden js-task-list-field"
v-if="descriptionText"
v-model="descriptionText"
:data-update-url="updateUrl"
class="hidden js-task-list-field"
>
</textarea>
......
......@@ -51,16 +51,16 @@
<template>
<div class="prepend-top-default append-bottom-default clearfix">
<button
class="btn btn-save float-left"
:class="{ disabled: formState.updateLoading || !isSubmitEnabled }"
type="submit"
:disabled="formState.updateLoading || !isSubmitEnabled"
class="btn btn-save float-left"
type="submit"
@click.prevent="updateIssuable">
Save changes
<i
v-if="formState.updateLoading"
class="fa fa-spinner fa-spin"
aria-hidden="true"
v-if="formState.updateLoading">
aria-hidden="true">
</i>
</button>
<button
......@@ -71,16 +71,16 @@
</button>
<button
v-if="shouldShowDeleteButton"
class="btn btn-danger float-right append-right-default"
:class="{ disabled: deleteLoading }"
type="button"
:disabled="deleteLoading"
class="btn btn-danger float-right append-right-default"
type="button"
@click="deleteIssuable">
Delete
<i
v-if="deleteLoading"
class="fa fa-spinner fa-spin"
aria-hidden="true"
v-if="deleteLoading">
aria-hidden="true">
</i>
</button>
</div>
......
......@@ -37,16 +37,16 @@
Edited
<time-ago-tooltip
v-if="updatedAt"
tooltip-placement="bottom"
:time="updatedAt"
tooltip-placement="bottom"
/>
<span
v-if="hasUpdatedBy"
>
by
<a
class="author_link"
:href="updatedByPath"
class="author_link"
>
<span>{{ updatedByName }}</span>
</a>
......
......@@ -52,12 +52,12 @@
>
<textarea
id="issue-description"
ref="textarea"
slot="textarea"
v-model="formState.description"
class="note-textarea js-gfm-input js-autosize markdown-area"
data-supports-quick-actions="false"
aria-label="Description"
v-model="formState.description"
ref="textarea"
slot="textarea"
placeholder="Write a comment or drag your files here..."
@keydown.meta.enter="updateIssuable"
@keydown.ctrl.enter="updateIssuable">
......
......@@ -48,15 +48,15 @@
class="dropdown js-issuable-selector-wrap"
data-issuable-type="issue">
<button
ref="toggle"
:data-namespace-path="projectNamespace"
:data-project-path="projectPath"
:data-data="issuableTemplatesJson"
class="dropdown-menu-toggle js-issuable-selector"
type="button"
ref="toggle"
data-field-name="issuable_template"
data-selected="null"
data-toggle="dropdown"
:data-namespace-path="projectNamespace"
:data-project-path="projectPath"
:data-data="issuableTemplatesJson">
data-toggle="dropdown">
<span class="dropdown-toggle-text">
Choose a template
</span>
......
......@@ -21,11 +21,11 @@
</label>
<input
id="issuable-title"
v-model="formState.title"
class="form-control"
type="text"
placeholder="Title"
aria-label="Title"
v-model="formState.title"
@keydown.meta.enter="updateIssuable"
@keydown.ctrl.enter="updateIssuable" />
</fieldset>
......
......@@ -72,8 +72,8 @@
<locked-warning v-if="formState.lockedWarningVisible" />
<div class="row">
<div
class="col-sm-4 col-lg-3"
v-if="hasIssuableTemplates">
v-if="hasIssuableTemplates"
class="col-sm-4 col-lg-3">
<description-template
:form-state="formState"
:issuable-templates="issuableTemplates"
......
......@@ -67,11 +67,11 @@
<template>
<div class="title-container">
<h2
class="title"
:class="{
'issue-realtime-pre-pulse': preAnimation,
'issue-realtime-trigger-pulse': pulseAnimation
}"
class="title"
v-html="titleHtml"
>
</h2>
......@@ -80,11 +80,11 @@
v-if="showInlineEditButton && canUpdate"
type="button"
class="btn btn-default btn-edit btn-svg js-issuable-edit"
v-html="pencilIcon"
title="Edit title and description"
data-placement="bottom"
data-container="body"
@click="edit"
v-html="pencilIcon"
>
</button>
</div>
......
......@@ -74,13 +74,13 @@ export default {
<ci-header
v-if="shouldRenderContent"
:status="status"
item-name="Job"
:item-id="job.id"
:time="headerTime"
:user="job.user"
:actions="actions"
:has-sidebar-button="true"
:should-render-triggered-label="jobStarted"
item-name="Job"
/>
<loading-icon
v-if="isLoading"
......
......@@ -101,8 +101,8 @@ export default {
{{ __('Retry') }}
</a>
<button
type="button"
:aria-label="__('Toggle Sidebar')"
type="button"
class="btn btn-blank gutter-toggle float-right d-block d-md-none js-sidebar-build-toggle"
>
<i
......@@ -114,20 +114,20 @@ export default {
</div>
<template v-if="shouldRenderContent">
<div
class="block retry-link"
v-if="job.retry_path || job.new_issue_path"
class="block retry-link"
>
<a
v-if="job.new_issue_path"
class="js-new-issue btn btn-new btn-inverted"
:href="job.new_issue_path"
class="js-new-issue btn btn-new btn-inverted"
>
{{ __('New issue') }}
</a>
<a
v-if="canUserRetry"
class="js-retry-job btn btn-inverted-secondary"
:href="job.retry_path"
class="js-retry-job btn btn-inverted-secondary"
data-method="post"
rel="nofollow"
>
......@@ -136,8 +136,8 @@ export default {
</div>
<div :class="{block : renderBlock }">
<p
class="build-detail-row js-job-mr"
v-if="job.merge_request"
class="build-detail-row js-job-mr"
>
<span class="build-light-text">
{{ __('Merge Request:') }}
......@@ -148,51 +148,51 @@ export default {
</p>
<detail-row
class="js-job-duration"
v-if="job.duration"
title="Duration"
:value="duration"
class="js-job-duration"
title="Duration"
/>
<detail-row
class="js-job-finished"
v-if="job.finished_at"
title="Finished"
:value="timeFormated(job.finished_at)"
class="js-job-finished"
title="Finished"
/>
<detail-row
class="js-job-erased"
v-if="job.erased_at"
title="Erased"
:value="timeFormated(job.erased_at)"
class="js-job-erased"
title="Erased"
/>
<detail-row
class="js-job-queued"
v-if="job.queued"
title="Queued"
:value="queued"
class="js-job-queued"
title="Queued"
/>
<detail-row
class="js-job-timeout"
v-if="hasTimeout"
title="Timeout"
:help-url="runnerHelpUrl"
:value="timeout"
class="js-job-timeout"
title="Timeout"
/>
<detail-row
class="js-job-runner"
v-if="job.runner"
title="Runner"
:value="runnerId"
class="js-job-runner"
title="Runner"
/>
<detail-row
class="js-job-coverage"
v-if="job.coverage"
title="Coverage"
:value="coverage"
class="js-job-coverage"
title="Coverage"
/>
<p
class="build-detail-row js-job-tags"
v-if="job.tags.length"
class="build-detail-row js-job-tags"
>
<span class="build-light-text">
{{ __('Tags:') }}
......@@ -210,8 +210,8 @@ export default {
class="btn-group prepend-top-5"
role="group">
<a
class="js-cancel-job btn btn-sm btn-default"
:href="job.cancel_path"
class="js-cancel-job btn btn-sm btn-default"
data-method="post"
rel="nofollow"
>
......@@ -221,8 +221,8 @@ export default {
</div>
</template>
<loading-icon
class="prepend-top-10"
v-if="isLoading"
class="prepend-top-10"
size="2"
/>
</div>
......
......@@ -11,9 +11,18 @@ import { __ } from '~/locale';
global.mergeConflicts.diffFileEditor = Vue.extend({
props: {
file: Object,
onCancelDiscardConfirmation: Function,
onAcceptDiscardConfirmation: Function
file: {
type: Object,
required: true,
},
onCancelDiscardConfirmation: {
type: Function,
required: true,
},
onAcceptDiscardConfirmation: {
type: Function,
required: true,
},
},
data() {
return {
......
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment