show prettier maxChars warning for changeset comments

from #9392
This commit is contained in:
Martin Raifer
2022-11-28 19:08:37 +01:00
parent 3b7141ba0a
commit d5872cca73
5 changed files with 58 additions and 28 deletions
+43 -25
View File
@@ -1,4 +1,5 @@
import { dispatch as d3_dispatch } from 'd3-dispatch';
import { select as d3_select } from 'd3-selection';
import { presetManager } from '../presets';
import { t } from '../core/localizer';
@@ -6,7 +7,7 @@ import { svgIcon } from '../svg/icon';
import { uiCombobox} from './combobox';
import { uiField } from './field';
import { uiFormFields } from './form_fields';
import { utilArrayUniqBy, utilRebind, utilTriggerEvent } from '../util';
import { utilArrayUniqBy, utilCleanOsmString, utilRebind, utilTriggerEvent, utilUnicodeCharsCount } from '../util';
export function uiChangesetEditor(context) {
@@ -85,10 +86,26 @@ export function uiChangesetEditor(context) {
}
}
var hasGoogle = _tags.comment.match(/google/i);
var commentTooLong = _tags.comment.length > 255;
// Show warning(s) if comment mentions Google or comment length exceeds 255 chars
const warnings = [];
if (_tags.comment.match(/google/i)) {
warnings.push({
id: 'contains "google"',
msg: t.append('commit.google_warning'),
link: t('commit.google_warning_link')
});
}
const maxChars = context.maxCharsForTagValue();
const strLen = utilUnicodeCharsCount(utilCleanOsmString(_tags.comment, Number.POSITIVE_INFINITY));
if (strLen > maxChars || !true) {
warnings.push({
id: 'message too long',
msg: t.append('commit.changeset_comment_length_warning', { maxChars: maxChars }),
});
}
var commentWarning = selection.select('.form-field-comment').selectAll('.comment-warning')
.data(hasGoogle || commentTooLong ? [0] : []);
.data(warnings, d => d.id);
commentWarning.exit()
.transition()
@@ -96,30 +113,31 @@ export function uiChangesetEditor(context) {
.style('opacity', 0)
.remove();
function displayWarningMessage(msg, link) {
var commentEnter = commentWarning.enter()
.insert('div', '.tag-reference-body')
.attr('class', 'field-warning comment-warning')
.style('opacity', 0);
var commentEnter = commentWarning.enter()
.insert('div', '.comment-warning')
.attr('class', 'comment-warning field-warning')
.style('opacity', 0);
commentEnter
.append('a')
.attr('target', '_blank')
.call(svgIcon('#iD-icon-alert', 'inline'))
.attr('href', t(link))
.append('span')
.call(t.append(msg));
commentEnter
.call(svgIcon('#iD-icon-alert', 'inline'))
.append('span');
commentEnter
.transition()
.duration(200)
.style('opacity', 1);
}
commentEnter
.transition()
.duration(200)
.style('opacity', 1);
// Add warning if comment mentions Google or comment length
// exceeds 255 chars
if (hasGoogle) displayWarningMessage('commit.google_warning', 'commit.google_warning_link');
if (commentTooLong) displayWarningMessage('commit.changeset_comment_length_warning', 'commit.about_changeset_comments_link');
commentWarning.merge(commentEnter).selectAll('div > span')
.text('')
.each(function(d) {
let selection = d3_select(this);
if (d.link) {
selection = selection.append('a')
.attr('target', '_blank')
.attr('href', d.link);
}
selection.call(d.msg);
});
}