diff --git a/src/i18n/locales/en.json b/src/i18n/locales/en.json index 93d061d18..578b5351a 100644 --- a/src/i18n/locales/en.json +++ b/src/i18n/locales/en.json @@ -304,7 +304,7 @@ "component_framework": "Framework", "component_library": "Library", "component_container": "Container", - "component_os": "Operation system", + "component_operating_system": "Operation system", "component_device": "Device", "component_firmware": "Firmware", "component_file": "File" diff --git a/src/shared/common.js b/src/shared/common.js index bf0bef8c5..196017c98 100644 --- a/src/shared/common.js +++ b/src/shared/common.js @@ -190,6 +190,31 @@ $common.makeAnalysisResponseLabelFormatter = (i18n) => { } }; +/** + * + * @param {*} i18n - VueI18n instance with $t translate function available + * @returns a specialized label for component and project classifiers (APPLICATION, LIBRARY, etc). + * It must have a corresponding entry in the locales files (e.g. src/locales/en.json) + * (application, library, etc.) + */ +$common.componentClassifierLabelFormatter = (i18n) => { + return function (value) { + switch (value) { + case 'APPLICATION': + case 'FRAMEWORK': + case 'LIBRARY': + case 'CONTAINER': + case 'OPERATING_SYSTEM': + case 'DEVICE': + case 'FIRMWARE': + case 'FILE': + return i18n.$t(`message.component_${value.toLowerCase()}`) + default: + return null; + } + } +}; + /** * Given a UNIX timestamp, this function will return a formatted date. * i.e. 15 Jan 2017 @@ -291,6 +316,7 @@ module.exports = { formatAnalyzerLabel: $common.formatAnalyzerLabel, makeAnalysisStateLabelFormatter: $common.makeAnalysisStateLabelFormatter, makeAnalysisJustificationLabelFormatter: $common.makeAnalysisJustificationLabelFormatter, + componentClassifierLabelFormatter: $common.componentClassifierLabelFormatter, formatTimestamp: $common.formatTimestamp, concatenateComponentName: $common.concatenateComponentName, valueWithDefault: $common.valueWithDefault, diff --git a/src/views/portfolio/projects/ComponentDetailsModal.vue b/src/views/portfolio/projects/ComponentDetailsModal.vue index 6d89b7956..3ca9dcb52 100644 --- a/src/views/portfolio/projects/ComponentDetailsModal.vue +++ b/src/views/portfolio/projects/ComponentDetailsModal.vue @@ -146,14 +146,14 @@ data() { return { availableClassifiers: [ - { value: 'APPLICATION', text: 'Application' }, - { value: 'FRAMEWORK', text: 'Framework' }, - { value: 'LIBRARY', text: 'Library' }, - { value: 'CONTAINER', text: 'Container' }, - { value: 'OPERATING_SYSTEM', text: 'Operating System' }, - { value: 'DEVICE', text: 'Device' }, - { value: 'FIRMWARE', text: 'Firmware' }, - { value: 'FILE', text: 'File' } + { value: 'APPLICATION', text: this.$i18n.t('message.component_application') }, + { value: 'FRAMEWORK', text: this.$i18n.t('message.component_framework') }, + { value: 'LIBRARY', text: this.$i18n.t('message.component_library') }, + { value: 'CONTAINER', text: this.$i18n.t('message.component_container') }, + { value: 'OPERATING_SYSTEM', text: this.$i18n.t('message.component_operating_system') }, + { value: 'DEVICE', text: this.$i18n.t('message.component_device') }, + { value: 'FIRMWARE', text: this.$i18n.t('message.component_firmware') }, + { value: 'FILE', text: this.$i18n.t('message.component_file') } ], selectableLicenses: [], selectedLicense: '', diff --git a/src/views/portfolio/projects/ProjectAddComponentModal.vue b/src/views/portfolio/projects/ProjectAddComponentModal.vue index 5459a014a..a5f14b3c0 100644 --- a/src/views/portfolio/projects/ProjectAddComponentModal.vue +++ b/src/views/portfolio/projects/ProjectAddComponentModal.vue @@ -110,14 +110,14 @@ data() { return { availableClassifiers: [ - { value: 'APPLICATION', text: 'Application' }, - { value: 'FRAMEWORK', text: 'Framework' }, - { value: 'LIBRARY', text: 'Library' }, - { value: 'CONTAINER', text: 'Container' }, - { value: 'OPERATING_SYSTEM', text: 'Operating System' }, - { value: 'DEVICE', text: 'Device' }, - { value: 'FIRMWARE', text: 'Firmware' }, - { value: 'FILE', text: 'File' } + { value: 'APPLICATION', text: this.$i18n.t('message.component_application') }, + { value: 'FRAMEWORK', text: this.$i18n.t('message.component_framework') }, + { value: 'LIBRARY', text: this.$i18n.t('message.component_library') }, + { value: 'CONTAINER', text: this.$i18n.t('message.component_container') }, + { value: 'OPERATING_SYSTEM', text: this.$i18n.t('message.component_operating_system') }, + { value: 'DEVICE', text: this.$i18n.t('message.component_device') }, + { value: 'FIRMWARE', text: this.$i18n.t('message.component_firmware') }, + { value: 'FILE', text: this.$i18n.t('message.component_file') } ], selectableLicenses: [], selectedLicense: '', diff --git a/src/views/portfolio/projects/ProjectCreateProjectModal.vue b/src/views/portfolio/projects/ProjectCreateProjectModal.vue index 7241d1da5..5cafff126 100644 --- a/src/views/portfolio/projects/ProjectCreateProjectModal.vue +++ b/src/views/portfolio/projects/ProjectCreateProjectModal.vue @@ -104,7 +104,7 @@ { value: 'FRAMEWORK', text: this.$i18n.t('message.component_framework') }, { value: 'LIBRARY', text: this.$i18n.t('message.component_library') }, { value: 'CONTAINER', text: this.$i18n.t('message.component_container') }, - { value: 'OPERATING_SYSTEM', text: this.$i18n.t('message.component_os') }, + { value: 'OPERATING_SYSTEM', text: this.$i18n.t('message.component_operating_system') }, { value: 'DEVICE', text: this.$i18n.t('message.component_device') }, { value: 'FIRMWARE', text: this.$i18n.t('message.component_firmware') }, { value: 'FILE', text: this.$i18n.t('message.component_file') } @@ -135,8 +135,8 @@ sortAvailableClassifiers: function() { this.availableClassifiers.sort(function(a, b) { return a.text.localeCompare(b.text); - }); - return this.availableClassifiers; + }); + return this.availableClassifiers; } }, methods: { diff --git a/src/views/portfolio/projects/ProjectDetailsModal.vue b/src/views/portfolio/projects/ProjectDetailsModal.vue index ccea36252..a8137812d 100644 --- a/src/views/portfolio/projects/ProjectDetailsModal.vue +++ b/src/views/portfolio/projects/ProjectDetailsModal.vue @@ -106,14 +106,14 @@ readOnlyProjectName: '', readOnlyProjectVersion: '', availableClassifiers: [ - { value: 'APPLICATION', text: 'Application' }, - { value: 'FRAMEWORK', text: 'Framework' }, - { value: 'LIBRARY', text: 'Library' }, - { value: 'CONTAINER', text: 'Container' }, - { value: 'OPERATING_SYSTEM', text: 'Operating System' }, - { value: 'DEVICE', text: 'Device' }, - { value: 'FIRMWARE', text: 'Firmware' }, - { value: 'FILE', text: 'File' } + { value: 'APPLICATION', text: this.$i18n.t('message.component_application') }, + { value: 'FRAMEWORK', text: this.$i18n.t('message.component_framework') }, + { value: 'LIBRARY', text: this.$i18n.t('message.component_library') }, + { value: 'CONTAINER', text: this.$i18n.t('message.component_container') }, + { value: 'OPERATING_SYSTEM', text: this.$i18n.t('message.component_operating_system') }, + { value: 'DEVICE', text: this.$i18n.t('message.component_device') }, + { value: 'FIRMWARE', text: this.$i18n.t('message.component_firmware') }, + { value: 'FILE', text: this.$i18n.t('message.component_file') } ], tag: '', // The contents of a tag as its being typed into the vue-tag-input tags: [], // An array of tags bound to the vue-tag-input diff --git a/src/views/portfolio/projects/ProjectList.vue b/src/views/portfolio/projects/ProjectList.vue index cc0703945..47ed6116e 100644 --- a/src/views/portfolio/projects/ProjectList.vue +++ b/src/views/portfolio/projects/ProjectList.vue @@ -92,7 +92,8 @@ { title: this.$t('message.classifier'), field: "classifier", - sortable: true + sortable: true, + formatter: common.componentClassifierLabelFormatter(this), }, { title: this.$t('message.last_bom_import'),