debian-mirror-gitlab/app/assets/javascripts/issue.js

222 lines
7.1 KiB
JavaScript
Raw Normal View History

2019-12-26 22:10:19 +05:30
/* eslint-disable consistent-return */
2018-05-09 12:01:36 +05:30
import $ from 'jquery';
2018-03-17 18:26:18 +05:30
import axios from './lib/utils/axios_utils';
import { addDelimiter } from './lib/utils/text_utility';
2020-10-24 23:57:45 +05:30
import { deprecatedCreateFlash as flash } from './flash';
2017-09-10 17:25:29 +05:30
import CreateMergeRequestDropdown from './create_merge_request_dropdown';
import IssuablesHelper from './helpers/issuables_helper';
2020-06-23 00:09:42 +05:30
import { joinPaths } from '~/lib/utils/url_utility';
2019-09-04 21:01:54 +05:30
import { __ } from './locale';
2016-09-13 17:45:13 +05:30
2018-03-17 18:26:18 +05:30
export default class Issue {
2017-08-17 22:00:37 +05:30
constructor() {
2020-07-28 23:09:34 +05:30
if ($('.btn-close, .btn-reopen').length) this.initIssueBtnEventListeners();
2016-09-13 17:45:13 +05:30
2020-05-24 23:13:21 +05:30
if ($('.js-close-blocked-issue-warning').length) this.initIssueWarningBtnEventListener();
2020-06-23 00:09:42 +05:30
if ($('.js-alert-moved-from-service-desk-warning').length) {
const trimmedPathname = window.location.pathname.slice(1);
this.alertMovedFromServiceDeskDismissedKey = joinPaths(
trimmedPathname,
'alert-issue-moved-from-service-desk-dismissed',
);
this.initIssueMovedFromServiceDeskDismissHandler();
}
2017-08-17 22:00:37 +05:30
Issue.$btnNewBranch = $('#new-branch');
Issue.createMrDropdownWrap = document.querySelector('.create-mr-dropdown-wrap');
2016-09-13 17:45:13 +05:30
2019-04-03 18:18:56 +05:30
if (document.querySelector('#related-branches')) {
Issue.initRelatedBranches();
}
2016-09-13 17:45:13 +05:30
2020-07-28 23:09:34 +05:30
this.closeButtons = $('.btn-close');
this.reopenButtons = $('.btn-reopen');
2017-09-10 17:25:29 +05:30
this.initCloseReopenReport();
2017-08-17 22:00:37 +05:30
if (Issue.createMrDropdownWrap) {
this.createMergeRequestDropdown = new CreateMergeRequestDropdown(Issue.createMrDropdownWrap);
}
2018-03-27 19:54:05 +05:30
// Listen to state changes in the Vue app
2018-12-13 13:39:08 +05:30
document.addEventListener('issuable_vue_app:change', event => {
2018-03-27 19:54:05 +05:30
this.updateTopState(event.detail.isClosed, event.detail.data);
});
}
/**
* This method updates the top area of the issue.
*
* Once the issue state changes, either through a click on the top area (jquery)
* or a click on the bottom area (Vue) we need to update the top area.
*
* @param {Boolean} isClosed
* @param {Array} data
* @param {String} issueFailMessage
*/
2019-09-04 21:01:54 +05:30
updateTopState(
isClosed,
data,
issueFailMessage = __('Unable to update this issue at this time.'),
) {
2018-03-27 19:54:05 +05:30
if ('id' in data) {
const isClosedBadge = $('div.status-box-issue-closed');
const isOpenBadge = $('div.status-box-open');
const projectIssuesCounter = $('.issue_counter');
isClosedBadge.toggleClass('hidden', !isClosed);
isOpenBadge.toggleClass('hidden', isClosed);
$(document).trigger('issuable:change', isClosed);
this.toggleCloseReopenButton(isClosed);
2018-12-13 13:39:08 +05:30
let numProjectIssues = Number(
projectIssuesCounter
.first()
.text()
.trim()
.replace(/[^\d]/, ''),
);
2018-03-27 19:54:05 +05:30
numProjectIssues = isClosed ? numProjectIssues - 1 : numProjectIssues + 1;
projectIssuesCounter.text(addDelimiter(numProjectIssues));
if (this.createMergeRequestDropdown) {
2021-01-29 00:20:46 +05:30
this.createMergeRequestDropdown.checkAbilityToCreateBranch();
2018-03-27 19:54:05 +05:30
}
} else {
flash(issueFailMessage);
}
2017-08-17 22:00:37 +05:30
}
2016-09-13 17:45:13 +05:30
2017-08-17 22:00:37 +05:30
initIssueBtnEventListeners() {
2019-09-04 21:01:54 +05:30
const issueFailMessage = __('Unable to update this issue at this time.');
2016-09-13 17:45:13 +05:30
2020-11-24 15:15:51 +05:30
$('.report-abuse-link').on('click', e => {
// this is needed because of the implementation of
// the dropdown toggle and Report Abuse needing to be
// linked to another page.
e.stopPropagation();
});
2020-05-30 21:06:31 +05:30
// NOTE: data attribute seems unnecessary but is actually necessary
return $('.js-issuable-buttons[data-action="close-reopen"]').on(
2018-12-13 13:39:08 +05:30
'click',
2020-07-28 23:09:34 +05:30
'.btn-close, .btn-reopen, .btn-close-anyway',
2018-12-13 13:39:08 +05:30
e => {
e.preventDefault();
e.stopImmediatePropagation();
2019-12-26 22:10:19 +05:30
const $button = $(e.currentTarget);
const shouldSubmit = $button.hasClass('btn-comment');
2018-12-13 13:39:08 +05:30
if (shouldSubmit) {
Issue.submitNoteForm($button.closest('form'));
}
2017-09-10 17:25:29 +05:30
2020-05-24 23:13:21 +05:30
const shouldDisplayBlockedWarning = $button.hasClass('btn-issue-blocked');
const warningBanner = $('.js-close-blocked-issue-warning');
if (shouldDisplayBlockedWarning) {
this.toggleWarningAndCloseButton();
} else {
this.disableCloseReopenButton($button);
2020-07-28 23:09:34 +05:30
const url = $button.data('endpoint');
2020-05-30 21:06:31 +05:30
2020-05-24 23:13:21 +05:30
return axios
.put(url)
.then(({ data }) => {
const isClosed = $button.is('.btn-close, .btn-close-anyway');
this.updateTopState(isClosed, data);
if ($button.hasClass('btn-close-anyway')) {
warningBanner.addClass('hidden');
if (this.closeReopenReportToggle)
$('.js-issuable-close-dropdown').removeClass('hidden');
}
})
.catch(() => flash(issueFailMessage))
.then(() => {
this.disableCloseReopenButton($button, false);
});
}
2018-12-13 13:39:08 +05:30
},
);
2017-08-17 22:00:37 +05:30
}
2017-09-10 17:25:29 +05:30
initCloseReopenReport() {
this.closeReopenReportToggle = IssuablesHelper.initCloseReopenReport();
if (this.closeButtons) this.closeButtons = this.closeButtons.not('.issuable-close-button');
if (this.reopenButtons) this.reopenButtons = this.reopenButtons.not('.issuable-close-button');
}
disableCloseReopenButton($button, shouldDisable) {
if (this.closeReopenReportToggle) {
this.closeReopenReportToggle.setDisable(shouldDisable);
} else {
$button.prop('disabled', shouldDisable);
}
}
toggleCloseReopenButton(isClosed) {
if (this.closeReopenReportToggle) this.closeReopenReportToggle.updateButton(isClosed);
this.closeButtons.toggleClass('hidden', isClosed);
this.reopenButtons.toggleClass('hidden', !isClosed);
}
2020-05-24 23:13:21 +05:30
toggleWarningAndCloseButton() {
const warningBanner = $('.js-close-blocked-issue-warning');
warningBanner.toggleClass('hidden');
$('.btn-close').toggleClass('hidden');
if (this.closeReopenReportToggle) {
$('.js-issuable-close-dropdown').toggleClass('hidden');
}
}
initIssueWarningBtnEventListener() {
2020-11-24 15:15:51 +05:30
return $(document).on(
'click',
'.js-close-blocked-issue-warning .js-cancel-blocked-issue-warning',
e => {
e.preventDefault();
e.stopImmediatePropagation();
this.toggleWarningAndCloseButton();
},
);
2020-05-24 23:13:21 +05:30
}
2020-06-23 00:09:42 +05:30
initIssueMovedFromServiceDeskDismissHandler() {
const alertMovedFromServiceDeskWarning = $('.js-alert-moved-from-service-desk-warning');
if (!localStorage.getItem(this.alertMovedFromServiceDeskDismissedKey)) {
alertMovedFromServiceDeskWarning.show();
}
alertMovedFromServiceDeskWarning.on('click', '.js-close', e => {
e.preventDefault();
e.stopImmediatePropagation();
alertMovedFromServiceDeskWarning.remove();
localStorage.setItem(this.alertMovedFromServiceDeskDismissedKey, true);
});
}
2017-08-17 22:00:37 +05:30
static submitNoteForm(form) {
2019-12-26 22:10:19 +05:30
const noteText = form.find('textarea.js-note-text').val();
2018-03-17 18:26:18 +05:30
if (noteText && noteText.trim().length > 0) {
2017-08-17 22:00:37 +05:30
return form.submit();
}
}
2016-09-13 17:45:13 +05:30
2017-08-17 22:00:37 +05:30
static initRelatedBranches() {
2019-12-26 22:10:19 +05:30
const $container = $('#related-branches');
2018-12-13 13:39:08 +05:30
return axios
.get($container.data('url'))
2018-03-17 18:26:18 +05:30
.then(({ data }) => {
if ('html' in data) {
$container.html(data.html);
}
2018-12-13 13:39:08 +05:30
})
2019-09-04 21:01:54 +05:30
.catch(() => flash(__('Failed to load related branches')));
2017-08-17 22:00:37 +05:30
}
}