diff --git a/ui/core/app/components/error/message.hbs b/ui/core/app/components/error/message.hbs index 200395481..54813a844 100644 --- a/ui/core/app/components/error/message.hbs +++ b/ui/core/app/components/error/message.hbs @@ -1,5 +1,5 @@ - - {{t this.description}} + + {{t (concat "errors." statusCode ".description")}} {{#if this.helpRoute}} {{t "actions.help"}} {{/if}} diff --git a/ui/core/app/components/error/message.js b/ui/core/app/components/error/message.js index 1c476e71f..7ae6ca0d1 100644 --- a/ui/core/app/components/error/message.js +++ b/ui/core/app/components/error/message.js @@ -1,4 +1,5 @@ import Message from 'rose/components/rose/message'; +import { computed } from '@ember/object'; /* * Helpful error booleans are attached based on the error status code: @@ -14,75 +15,29 @@ import Message from 'rose/components/rose/message'; * we don't distinguish it yet */ -const status_messages = { - '401': { - icon: 'disabled', - title: 'errors.titles.unauthenticated-error', - subtitle: 'errors.subtitles.unauthenticated-error', - description: 'errors.descriptions.unauthenticated-error', - }, - '403': { - icon: 'disabled', - title: 'errors.titles.forbidden-error', - subtitle: 'errors.subtitles.forbidden-error', - description: 'errors.descriptions.forbidden-error', - }, - '404': { - icon: 'help-circle-outline', - title: 'errors.titles.notfound-error', - subtitle: 'errors.subtitles.notfound-error', - description: 'errors.descriptions.notfound-error', - }, - '500': { - icon: 'alert-circle-outline', - title: 'errors.titles.server-error', - subtitle: 'errors.subtitles.server-error', - description: 'errors.descriptions.server-error', - }, - unknown: { - icon: 'alert-circle-outline', - title: 'errors.titles.unknown-error', - subtitle: 'errors.subtitles.unknown-error', - description: 'errors.descriptions.unknown-error', - }, -}; +const statuses = ['401', '403', '404', '500']; export default class ErrorMessageComponent extends Message { // =methods /** - * Returns an icon name based on error status. + * Returns an icon for error status. * @return {string} */ + @computed('status') get icon() { - return this.statusMessage.icon; + switch (this.status) { + case '401': + case '403': + return 'disabled'; + case '404': + return 'help-circle-outline'; + default: + return 'alert-circle-outline'; + } } - /** - * Returns a message title based on error status. - * @return {string} - */ - get title() { - return this.statusMessage.title; - } - - /** - * Returns a message subtitle of error status prefixed with 'Error'. - * @return {string} - */ - get subtitle() { - return this.statusMessage.subtitle; - } - - /** - * Returns an error description based on error status. - * @return {string} - */ - get description() { - return this.statusMessage.description; - } - - // Disable until help documentation can be linked in. + // TODO: Enable when help documentation can be linked in. /** * Returns an route string for help text in message. * @return {string} @@ -92,16 +47,15 @@ export default class ErrorMessageComponent extends Message { // } /** - * Returns an object with message details based on error status. - * Return message for `unknown` error when error status isn't part of - * predefined message set. - * @return {object} + * Returns 'unknown' status code when provided error status + * isn't part of predefined statuses. + * @return {string} */ - get statusMessage() { - let status = this.status; - if (!status_messages[status]) { - status = 'unknown'; - } - return status_messages[status]; + @computed('status') + get statusCode() { + let statusCode = this.status; + if(!statuses.includes(statusCode)) statusCode = 'unknown'; + return statusCode; } + } diff --git a/ui/core/app/templates/scopes/scope/error.hbs b/ui/core/app/templates/scopes/scope/error.hbs index 417feb0ea..8d56c81ce 100644 --- a/ui/core/app/templates/scopes/scope/error.hbs +++ b/ui/core/app/templates/scopes/scope/error.hbs @@ -1,6 +1,6 @@ +{{title (t "errors.titles.error") }} {{#each @model.errors as |error|}} - {{title error.status}} {{/each}} \ No newline at end of file diff --git a/ui/core/tests/integration/components/error/message-test.js b/ui/core/tests/integration/components/error/message-test.js index e4e6b1428..2671c9b7e 100644 --- a/ui/core/tests/integration/components/error/message-test.js +++ b/ui/core/tests/integration/components/error/message-test.js @@ -7,9 +7,7 @@ module('Integration | Component | error/message', function (hooks) { setupRenderingTest(hooks); test('it renders predefined message for known error status', async function (assert) { - this.set('status', '401'); - - await render(hbs``); + await render(hbs``); assert.equal( find('.rose-message-title').textContent.trim(), 'You are not signed in' @@ -24,15 +22,13 @@ module('Integration | Component | error/message', function (hooks) { ); }); - test('it renders default error for undefined error status', async function (assert) { - this.set('status', '510'); - - await render(hbs``); + test('it renders default error for unknown error status', async function (assert) { + await render(hbs``); assert.equal( find('.rose-message-title').textContent.trim(), 'Something went wrong' ); - assert.equal(find('.rose-message-subtitle').textContent.trim(), 'Error'); + assert.equal(find('.rose-message-subtitle').textContent.trim(), 'Error 599'); assert.equal( find('.rose-message-description').textContent.trim(), 'Please contact your administrator or try again later.' diff --git a/ui/core/translations/en-us.yaml b/ui/core/translations/en-us.yaml index f5708a5a0..fdfb779f9 100644 --- a/ui/core/translations/en-us.yaml +++ b/ui/core/translations/en-us.yaml @@ -158,25 +158,24 @@ form: current_password: Current Password new_password: New Password errors: + 401: + title: You are not signed in + description: You are not authenticated. Please authenticate and try again later. + 403: + title: You are not authorized + description: You must be granted permissions to view this data. Ask your administrator if you think you should have access. + 404: + title: Resource not found + description: We could not find the requested resource. You can ask your administrator or try again later. + 500: + title: Server error + description: We ran into a problem and could not continue. You can ask your administrator or try again later. + unknown: + title: Something went wrong + description: Please contact your administrator or try again later. titles: - unauthenticated-error: You are not signed in - forbidden-error: You are not authorized - notfound-error: Resource not found - server-error: Server error - unknown-error: Something went wrong authentication-failed: Authentication Failed - subtitles: - unauthenticated-error: Error 401 - forbidden-error: Error 403 - notfound-error: Error 404 - server-error: Error 500 - unknown-error: Error - descriptions: - unauthenticated-error: You are not authenticated. Please authenticate and try again later. - forbidden-error: You must be granted permissions to view this data. Ask your administrator if you think you should have access. - notfound-error: We could not find the requested resource. You can ask your administrator or try again later. - server-error: We ran into a problem and could not continue. You can ask your administrator or try again later. - unknown-error: Please contact your administrator or try again later. + error: Error notify: create-success: Created succesfully. save-success: Saved succesfully.