From 0bec18825e31f375c1f13ff6db589aaef31c7387 Mon Sep 17 00:00:00 2001 From: garrettmills Date: Mon, 1 Jun 2020 19:43:29 -0500 Subject: [PATCH] More translations --- app/assets/app/auth/MFASetup.component.js | 56 +++++++++++-------- app/assets/app/auth/Page.component.js | 1 - .../app/auth/PasswordReset.component.js | 45 ++++++++++----- app/assets/app/cobalt/Form.component.js | 31 +++++++--- app/assets/app/dash-components.js | 2 + locale/en_US/common.locale.js | 8 +++ locale/en_US/mfa.locale.js | 20 +++++++ locale/en_US/password.locale.js | 11 ++++ 8 files changed, 129 insertions(+), 45 deletions(-) create mode 100644 locale/en_US/password.locale.js diff --git a/app/assets/app/auth/MFASetup.component.js b/app/assets/app/auth/MFASetup.component.js index d52f66b..1a30bb9 100644 --- a/app/assets/app/auth/MFASetup.component.js +++ b/app/assets/app/auth/MFASetup.component.js @@ -8,41 +8,34 @@ const template = `
{{ app_name }}
- We're going to walk you through setting up multi-factor authentication for your account. -

- Once this is completed, you will need to provide your second factor of authentication whenever you sign in with your {{ app_name }} account. -

- You'll need some kind of MFA token generator such as Google Authenticator. +
- - + +
- Scan the QR code below with your authenticator app to add your {{ app_name }} account. -

- Once you've done this, we'll ask for one of the generated codes to verify that MFA is working correctly. +
-

Secret: {{ secret }} +

{{ t['mfa.secret'] }} {{ secret }}
- +
-
- Now, enter the code displayed in your authenticator app. {{ app_name }} will verify that the code is - correct. Then, you can enable MFA for your account. +
+ {{ t['mfa.setup_success'].replace('APP_NAME', app_name) }}
{{ error_message }}
{{ other_message }}
- - + +
@@ -80,6 +73,25 @@ export default class MFASetupPage extends Component { error_message = '' other_message = '' + t = {} + + async vue_on_create() { + this.t = await T( + 'mfa.setup_prompt', + 'common.cancel', + 'common.continue', + 'mfa.setup_qr_prompt', + 'mfa.secret', + 'mfa.setup_success', + 'mfa.mfa_code', + 'common.back', + 'mfa.enable_mfa', + 'mfa.invalid_code', + 'mfa.setup_code_success', + 'mfa.mfa_enabled', + 'common.unknown_error' + ) + } async watch_verify_code(new_verify_code, old_verify_code) { if ( new_verify_code.length === 6 ) { @@ -89,10 +101,10 @@ export default class MFASetupPage extends Component { this.loading = false if ( !this.verify_success ) { this.other_message = '' - this.error_message = `Uh, oh! It looks like that's not the right code. Please try again.` + this.error_message = this.t['mfa.invalid_code'] } else { this.error_message = '' - this.other_message = `Success! That code matched what ${this.app_name} was expecting. You can now enable multi-factor authentication for your account.` + this.other_message = this.t['mfa.setup_code_success'].replace('APP_NAME', this.app_name) } } else if ( new_verify_code.length > 6 ) { this.verify_code = old_verify_code @@ -136,11 +148,11 @@ export default class MFASetupPage extends Component { try { await auth_api.mfa_enable() this.error_message = '' - this.other_message = 'MFA has been enabled for your account! For security purposes, you will be asked to sign in again.' + this.other_message = this.t['mfa.mfa_enabled'] await location_service.redirect('/auth/login', 3000) } catch(e) { this.loading = false - this.error_message = 'Sorry, an unknown error occurred, and we were unable to continue.' + this.error_message = this.t['common.unknown_error'] this.other_message = '' } } diff --git a/app/assets/app/auth/Page.component.js b/app/assets/app/auth/Page.component.js index d8938ba..0569f79 100644 --- a/app/assets/app/auth/Page.component.js +++ b/app/assets/app/auth/Page.component.js @@ -1,5 +1,4 @@ import { Component } from '../../lib/vues6/vues6.js' -import { auth_api } from '../service/AuthApi.service.js' import { action_service } from '../service/Action.service.js' const template = ` diff --git a/app/assets/app/auth/PasswordReset.component.js b/app/assets/app/auth/PasswordReset.component.js index 514e1d5..d714870 100644 --- a/app/assets/app/auth/PasswordReset.component.js +++ b/app/assets/app/auth/PasswordReset.component.js @@ -5,25 +5,25 @@ import { password_service } from '../service/Password.service.js' const template = `
-
+
{{ app_name }}
- We're going to walk you through resetting your {{ app_name }} password. + {{ t['password.reset_prompt'].replace('APP_NAME', app_name) }}

- Note that this process will invalidate any existing app passwords you have created. + {{ t['password.reset_invalidates'] }}
- +
-
This password would take {{ step_1_calc_time }} to crack.
+
{{ t['password.calc_time'].replace('CALC_TIME', step_1_calc_time) }}
{{ step_1_problem }}.
- + Cancel + >{{ t['common.cancel'] }} + >{{ step === 2 ? t['password.change'] : t['common.continue'] }}
@@ -93,9 +93,28 @@ export default class PasswordResetComponent extends Component { password = '' confirm_password = '' + t = {} + ready = false - vue_on_create() { + async vue_on_create() { this.has_mfa = !!session.get('user.has_mfa') + + this.t = await T( + 'password.reset_prompt', + 'password.reset_invalidates', + 'password.enter_new_pw', + 'password.calc_time', + 'password.confirm', + 'password.new_password', + 'password.confirm_password', + 'password.change', + 'password.reset_success', + 'common.unknown_error', + 'common.continue', + 'common.cancel' + ) + + this.ready = true } async back_click() { @@ -131,10 +150,10 @@ export default class PasswordResetComponent extends Component { if ( this.step_2_valid ) { try { await password_service.reset(this.password) - this.other_message = 'Your password was reset. For security reasons, you will be asked to sign-in again.' + this.other_message = this.t['password.reset_success'] await location_service.redirect('/dash/profile', 5000) } catch (e) { - let message = 'An unknown error occurred while attempting to reset your password.' + let message = this.t['common.unknown_error'] if ( e.response && e.response.data && e.response.data.message ) { message = e.response.data.message } diff --git a/app/assets/app/cobalt/Form.component.js b/app/assets/app/cobalt/Form.component.js index 378e03e..91a83f2 100644 --- a/app/assets/app/cobalt/Form.component.js +++ b/app/assets/app/cobalt/Form.component.js @@ -19,7 +19,7 @@ const template = `
-

Loading...

+

{{ t['common.loading'] }}...

@@ -106,7 +106,7 @@ const template = ` :id="uuid+field.field+'-confirm'" v-model="data[field.field+'-confirm']" :required="Array.isArray(field.required) ? field.required.includes(mode) : field.required" - :placeholder="'Confirm ' + field.name" + :placeholder="t['common.confirm'] + ' ' + field.name" :readonly="mode === 'view' || (Array.isArray(field.readonly) ? field.readonly.includes(mode) : field.readonly)" > {{ field.error }} @@ -121,7 +121,7 @@ const template = ` type="button" v-if="mode !== 'view'" @click="save_click" - >Save + >{{ t['common.save'] }}
@@ -159,6 +159,7 @@ export default class FormComponent extends Component { is_ready = false mode = '' id = '' + t = {} reset() { this.definition = {} @@ -171,6 +172,18 @@ export default class FormComponent extends Component { } async vue_on_create(internal = false) { + this.t = await T( + 'common.loading', + 'common.confirm', + 'common.save', + 'common.not_permission', + 'common.item_saved', + 'common.unknown_error', + 'common.field_required', + 'common.confirmation_not_match', + 'common.invalid_json' + ) + if ( !internal ) { this.mode = this.initial_mode this.id = this.form_id @@ -181,7 +194,7 @@ export default class FormComponent extends Component { this.access_msg = true } else { this.can_access = false - this.access_msg = 'Sorry, you do not have permission to ' + this.mode + ' this resource.' + this.access_msg = this.t['common.not_permission'].replace('ACTION', this.mode) return } @@ -283,12 +296,12 @@ export default class FormComponent extends Component { } this.error_message = '' - this.other_message = `The ${this.resource_class.item} was saved.` + this.other_message = this.t['common.item_saved'].replace('ITEM', this.resource_class.item) } catch (e) { console.error(e) if ( e.response && e.response.data && e.response.data.message ) this.error_message = e.response.data.message - else this.error_message = 'An unknown error occurred while saving the form.' + else this.error_message = this.t['common.unknown_error'] } } @@ -305,13 +318,13 @@ export default class FormComponent extends Component { let valid = true for ( const field of this.definition.fields ) { if ( (Array.isArray(field.required) ? field.required.includes(this.mode) : field.required) && (!(field.field in this.data) || !this.data[field.field]) ) { - field.error = 'This field is required.' + field.error = this.t['common.field_required'] valid = false } else if ( field.type === 'password' && this.data[field.field] !== this.data[field.field + '-confirm'] ) { - field.error = field.name + ' confirmation does not match.' + field.error = field.name + ' ' + this.t['common.confirmation_not_match'] valid = false } else if ( field.type === 'json' && !this.is_json(this.data[field.field]) ) { - field.error = field.name + ' must be valid JSON.' + field.error = field.name + ' ' + this.t['common.invalid_json'] valid = false } else { field.error = '' diff --git a/app/assets/app/dash-components.js b/app/assets/app/dash-components.js index 796ddd9..93661a0 100644 --- a/app/assets/app/dash-components.js +++ b/app/assets/app/dash-components.js @@ -9,6 +9,8 @@ import AppSetupComponent from './dash/AppSetup.component.js' import ListingComponent from './cobalt/Listing.component.js' import FormComponent from './cobalt/Form.component.js' +import { T } from './service/Translate.service.js' + const dash_components = { SideBarComponent, NavBarComponent, diff --git a/locale/en_US/common.locale.js b/locale/en_US/common.locale.js index d2c8ff4..7d47f4c 100644 --- a/locale/en_US/common.locale.js +++ b/locale/en_US/common.locale.js @@ -18,4 +18,12 @@ module.exports = exports = { unknown_error: 'An unknown error has occurred, and we are unable to continue at this time.', invalid_resolver: 'Invalid locale resolver.', + loading: 'Loading', + confirm: 'Confirm', + save: 'Save', + field_required: 'This field is required.', + confirmation_not_match: 'confirmation does not match.', + invalid_json: 'must be valid JSON.', + not_permission: 'Sorry, you do not have permission to ACTION this resource.', + item_saved: 'The ITEM was saved.', } diff --git a/locale/en_US/mfa.locale.js b/locale/en_US/mfa.locale.js index 9be51ec..3e4c13a 100644 --- a/locale/en_US/mfa.locale.js +++ b/locale/en_US/mfa.locale.js @@ -20,4 +20,24 @@ module.exports = exports = { normal_code: 'Have a normal MFA code?', recover_success: 'Success! There are only NUM_CODES recovery codes remaining. Let\'s get you on your way...', + setup_prompt: ` + We're going to walk you through setting up multi-factor authentication for your account. +

+ Once this is completed, you will need to provide your second factor of authentication whenever you sign in with your APP_NAME account. +

+ You'll need some kind of MFA token generator such as Google Authenticator. + `, + setup_qr_prompt: ` + Scan the QR code below with your authenticator app to add your APP_NAME account. +

+ Once you've done this, we'll ask for one of the generated codes to verify that MFA is working correctly. + `, + secret: 'Secret:', + setup_success: ` + Now, enter the code displayed in your authenticator app. APP_NAME will verify that the code is + correct. Then, you can enable MFA for your account. + `, + enable_mfa: 'Enable MFA', + setup_code_success: 'Success! That code matched what APP_NAME was expecting. You can now enable multi-factor authentication for your account.', + mfa_enabled: 'MFA has been enabled for your account! For security purposes, you will be asked to sign in again.', } diff --git a/locale/en_US/password.locale.js b/locale/en_US/password.locale.js new file mode 100644 index 0000000..4a729ed --- /dev/null +++ b/locale/en_US/password.locale.js @@ -0,0 +1,11 @@ +module.exports = exports = { + reset_prompt: 'We\'re going to walk you through resetting your APP_NAME password.', + reset_invalidates: 'Note that this process will invalidate any existing app passwords you have created.', + enter_new_pw: 'Please enter a new password for your account:', + calc_time: 'This password would take CALC_TIME to crack.', + confirm: 'Confirm the password:', + new_password: 'New Password', + confirm_password: 'Confirm the Password', + change: 'Change Password', + reset_success: 'Your password was reset. For security reasons, you will be asked to sign-in again.', +}