From f66b4a9460a97a2e7b2806d747e19b79ac2079d1 Mon Sep 17 00:00:00 2001 From: Thomas Randolph Date: Mon, 1 Mar 2021 14:10:57 -0700 Subject: [PATCH] Move i18n for Comment Form component to Notes app I18n file --- .../notes/components/comment_form.vue | 43 +++++++++---------- app/assets/javascripts/notes/i18n.js | 26 +++++++++++ 2 files changed, 46 insertions(+), 23 deletions(-) create mode 100644 app/assets/javascripts/notes/i18n.js diff --git a/app/assets/javascripts/notes/components/comment_form.vue b/app/assets/javascripts/notes/components/comment_form.vue index e6d8a527fb7e40..b865826051eb0c 100644 --- a/app/assets/javascripts/notes/components/comment_form.vue +++ b/app/assets/javascripts/notes/components/comment_form.vue @@ -20,12 +20,15 @@ import { splitCamelCase, slugifyWithUnderscore, } from '~/lib/utils/text_utility'; -import { __, sprintf } from '~/locale'; +import { sprintf } from '~/locale'; import markdownField from '~/vue_shared/components/markdown/field.vue'; import TimelineEntryItem from '~/vue_shared/components/notes/timeline_entry_item.vue'; import glFeatureFlagsMixin from '~/vue_shared/mixins/gl_feature_flags_mixin'; + import * as constants from '../constants'; import eventHub from '../event_hub'; +import { COMMENT_FORM } from '../i18n'; + import issuableStateMixin from '../mixins/issuable_state'; import CommentFieldLayout from './comment_field_layout.vue'; import discussionLockedWidget from './discussion_locked_widget.vue'; @@ -33,13 +36,7 @@ import noteSignedOutWidget from './note_signed_out_widget.vue'; export default { name: 'CommentForm', - i18n: { - submitButton: { - startThread: __('Start thread'), - comment: __('Comment'), - commentHelp: __('Add a general comment to this %{noteableDisplayName}.'), - }, - }, + i18n: COMMENT_FORM, noteTypeComment: constants.COMMENT, noteTypeDiscussion: constants.DISCUSSION, components: { @@ -96,12 +93,14 @@ export default { return this.getUserData.id; }, commentButtonTitle() { - return this.noteType === constants.COMMENT ? __('Comment') : __('Start thread'); + return this.noteType === constants.COMMENT + ? this.$options.i18n.comment + : this.$options.i18n.startThread; }, startDiscussionDescription() { return this.getNoteableData.noteableType === constants.MERGE_REQUEST_NOTEABLE_TYPE - ? __('Discuss a specific suggestion or question that needs to be resolved.') - : __('Discuss a specific suggestion or question.'); + ? this.$options.i18n.discussionThatNeedsResolution + : this.$options.i18n.discussion; }, commentDescription() { return sprintf(this.$options.i18n.submitButton.commentHelp, { @@ -121,14 +120,14 @@ export default { const openOrClose = this.isOpen ? 'close' : 'reopen'; if (this.note.length) { - return sprintf(__('%{actionText} & %{openOrClose} %{noteable}'), { + return sprintf(this.$options.i18n.actionButtonWithNote, { actionText: this.commentButtonTitle, openOrClose, noteable: this.noteableDisplayName, }); } - return sprintf(__('%{openOrClose} %{noteable}'), { + return sprintf(this.$options.i18n.actionButton, { openOrClose: capitalizeFirstCharacter(openOrClose), noteable: this.noteableDisplayName, }); @@ -171,8 +170,8 @@ export default { }, issuableTypeTitle() { return this.noteableType === constants.MERGE_REQUEST_NOTEABLE_TYPE - ? __('merge request') - : __('issue'); + ? this.$options.i18n.mergeRequest + : this.$options.i18n.issue; }, isIssue() { return this.noteableDisplayName === constants.ISSUE_NOTEABLE_TYPE; @@ -242,9 +241,7 @@ export default { }) .catch(() => { this.discard(false); - const msg = __( - 'Your comment could not be submitted! Please check your network connection and try again.', - ); + const msg = this.$options.i18n.GENERIC_UNSUBMITTABLE_NETWORK; Flash(msg, 'alert', this.$el); this.note = noteData.data.note.note; // Restore textarea content. this.removePlaceholderNotes(); @@ -310,7 +307,7 @@ export default { const noteableType = capitalizeFirstCharacter(convertToCamelCase(this.noteableType)); this.autosave = new Autosave($(this.$refs.textarea), [ - __('Note'), + this.$options.i18n.note, noteableType, this.getNoteableData.id, ]); @@ -363,8 +360,8 @@ export default { data-qa-selector="comment_field" data-testid="comment-field" :data-supports-quick-actions="!glFeatures.tributeAutocomplete" - :aria-label="__('Comment')" - :placeholder="__('Write a comment or drag your files here…')" + :aria-label="$options.i18n.comment" + :placeholder="$options.i18n.bodyPlaceholder" @keydown.up="editCurrentUserLastNote()" @keydown.meta.enter="handleSave()" @keydown.ctrl.enter="handleSave()" @@ -379,12 +376,12 @@ export default { class="gl-mb-6" data-testid="confidential-note-checkbox" > - {{ s__('Notes|Make this comment confidential') }} + {{ $options.i18n.confidential }} diff --git a/app/assets/javascripts/notes/i18n.js b/app/assets/javascripts/notes/i18n.js new file mode 100644 index 00000000000000..1ffb94d11adaf3 --- /dev/null +++ b/app/assets/javascripts/notes/i18n.js @@ -0,0 +1,26 @@ +import { __, s__ } from '~/locale'; + +export const COMMENT_FORM = { + GENERIC_UNSUBMITTABLE_NETWORK: __( + 'Your comment could not be submitted! Please check your network connection and try again.', + ), + note: __('Note'), + comment: __('Comment'), + issue: __('issue'), + startThread: __('Start thread'), + mergeRequest: __('merge request'), + bodyPlaceholder: __('Write a comment or drag your files here…'), + confidential: s__('Notes|Make this comment confidential'), + confidentialVisibility: s__('Notes|Confidential comments are only visible to project members'), + discussionThatNeedsResolution: __( + 'Discuss a specific suggestion or question that needs to be resolved.', + ), + discussion: __('Discuss a specific suggestion or question.'), + actionButtonWithNote: __('%{actionText} & %{openOrClose} %{noteable}'), + actionButton: __('%{openOrClose} %{noteable}'), + submitButton: { + startThread: __('Start thread'), + comment: __('Comment'), + commentHelp: __('Add a general comment to this %{noteableDisplayName}.'), + }, +}; -- GitLab