${sprintf(
s__(
'Notes|This comment has changed since you started editing, please review the %{open_link}updated comment%{close_link} to ensure information is not lost',
),
{
open_link,
close_link: '',
},
)}
`);
$alert.insertAfter($note.find('.note-text'));
}
}
updateNotesCount(updateCount) {
return this.notesCountBadge.text(parseInt(this.notesCountBadge.text(), 10) + updateCount);
}
static renderPlaceholderComponent($container) {
const el = $container.find('.js-code-placeholder').get(0);
// eslint-disable-next-line no-new
new Vue({
el,
components: {
GlSkeletonLoading,
},
render(createElement) {
return createElement('gl-skeleton-loading');
},
});
}
static renderDiffContent($container, data) {
const { discussion_html } = data;
const lines = $(discussion_html).find('.line_holder');
lines.addClass('fade-in');
$container.find('.diff-content > table > tbody').prepend(lines);
const fileHolder = $container.find('.file-holder');
$container.find('.line-holder-placeholder').remove();
syntaxHighlight(fileHolder);
}
onClickRetryLazyLoad(e) {
const $retryButton = $(e.currentTarget);
$retryButton.prop('disabled', true);
return this.loadLazyDiff(e).then(() => {
$retryButton.prop('disabled', false);
});
}
loadLazyDiff(e) {
const $container = $(e.currentTarget).closest('.js-toggle-container');
Notes.renderPlaceholderComponent($container);
$container.find('.js-toggle-lazy-diff').removeClass('js-toggle-lazy-diff');
const $tableEl = $container.find('tbody');
if ($tableEl.length === 0) return;
const fileHolder = $container.find('.file-holder');
const url = fileHolder.data('linesPath');
const $errorContainer = $container.find('.js-error-lazy-load-diff');
const $successContainer = $container.find('.js-success-lazy-load');
/**
* We only fetch resolved discussions.
* Unresolved discussions don't have an endpoint being provided.
*/
if (url) {
return axios
.get(url)
.then(({ data }) => {
// Reset state in case last request returned error
$successContainer.removeClass('hidden');
$errorContainer.addClass('hidden');
Notes.renderDiffContent($container, data);
})
.catch(() => {
$successContainer.addClass('hidden');
$errorContainer.removeClass('hidden');
});
}
return Promise.resolve();
}
toggleCommitList(e) {
const $element = $(e.currentTarget);
const $closestSystemCommitList = $element.siblings('.system-note-commit-list');
$element
.find('.fa')
.toggleClass('fa-angle-down')
.toggleClass('fa-angle-up');
$closestSystemCommitList.toggleClass('hide-shade');
}
/**
* Scans system notes with `ul` elements in system note body
* then collapse long commit list pushed by user to make it less
* intrusive.
*/
collapseLongCommitList() {
const systemNotes = $('#notes-list')
.find('li.system-note')
.has('ul');
$.each(systemNotes, function(index, systemNote) {
const $systemNote = $(systemNote);
const headerMessage = $systemNote
.find('.note-text')
.find('p:first')
.text()
.replace(':', '');
$systemNote.find('.note-header .system-note-message').html(headerMessage);
if ($systemNote.find('li').length > MAX_VISIBLE_COMMIT_LIST_COUNT) {
$systemNote.find('.note-text').addClass('system-note-commit-list');
$systemNote.find('.system-note-commit-list-toggler').show();
} else {
$systemNote.find('.note-text').addClass('system-note-commit-list hide-shade');
}
});
}
addFlash(...flashParams) {
this.flashContainer = new Flash(...flashParams);
}
clearFlash() {
if (this.flashContainer) {
this.flashContainer.style.display = 'none';
this.flashContainer = null;
}
}
cleanForm($form) {
// Remove JS classes that are not needed here
$form.find('.js-comment-type-dropdown').removeClass('btn-group');
// Remove dropdown
$form.find('.dropdown-menu').remove();
return $form;
}
/**
* Check if note does not exists on page
*/
static isNewNote(noteEntity, noteIds) {
return $.inArray(noteEntity.id, noteIds) === -1;
}
/**
* Check if $note already contains the `noteEntity` content
*/
static isUpdatedNote(noteEntity, $note) {
// There can be CRLF vs LF mismatches if we don't sanitize and compare the same way
const sanitizedNoteEntityText = normalizeNewlines(noteEntity.note.trim());
const currentNoteText = normalizeNewlines(
$note
.find('.original-note-content')
.first()
.text()
.trim(),
);
return sanitizedNoteEntityText !== currentNoteText;
}
static checkMergeRequestStatus() {
if (getPagePath(1) === 'merge_requests' && gl.mrWidget) {
gl.mrWidget.checkStatus();
}
}
static animateAppendNote(noteHtml, $notesList) {
const $note = $(noteHtml);
$note.addClass('fade-in-full').renderGFM();
$notesList.append($note);
return $note;
}
static animateUpdateNote(noteHtml, $note) {
const $updatedNote = $(noteHtml);
$updatedNote.addClass('fade-in').renderGFM();
$note.replaceWith($updatedNote);
return $updatedNote;
}
/**
* Get data from Form attributes to use for saving/submitting comment.
*/
getFormData($form) {
const content = $form.find('.js-note-text').val();
return {
formData: $form.serialize(),
formContent: _.escape(content),
formAction: $form.attr('action'),
formContentOriginal: content,
};
}
/**
* Identify if comment has any quick actions
*/
hasQuickActions(formContent) {
return REGEX_QUICK_ACTIONS.test(formContent);
}
/**
* Remove quick actions and leave comment with pure message
*/
stripQuickActions(formContent) {
return formContent.replace(REGEX_QUICK_ACTIONS, '').trim();
}
/**
* Gets appropriate description from quick actions found in provided `formContent`
*/
getQuickActionDescription(formContent, availableQuickActions = []) {
let tempFormContent;
// Identify executed quick actions from `formContent`
const executedCommands = availableQuickActions.filter((command, index) => {
const commandRegex = new RegExp(`/${command.name}`);
return commandRegex.test(formContent);
});
if (executedCommands && executedCommands.length) {
if (executedCommands.length > 1) {
tempFormContent = __('Applying multiple commands');
} else {
const commandDescription = executedCommands[0].description.toLowerCase();
tempFormContent = sprintf(__('Applying command to %{commandDescription}'), {
commandDescription,
});
}
} else {
tempFormContent = __('Applying command');
}
return tempFormContent;
}
/**
* Create placeholder note DOM element populated with comment body
* that we will show while comment is being posted.
* Once comment is _actually_ posted on server, we will have final element
* in response that we will show in place of this temporary element.
*/
createPlaceholderNote({
formContent,
uniqueId,
isDiscussionNote,
currentUsername,
currentUserFullname,
currentUserAvatar,
}) {
const discussionClass = isDiscussionNote ? 'discussion' : '';
const $tempNote = $(
`${formContent}
${formContent}