Translations for the profile page components

app/assets/app/cobalt/Listing.component.js

@@ -41,7 +41,7 @@ const template = `
                     <th scope="row">{{ index + 1 }}</th>
                     <td v-for="col of definition.columns">
                         <span v-if="typeof col.renderer === 'function'">{{ col.renderer(row[col.field]) }}</span>
-                        <span v-if="col.renderer === 'boolean'">{{ row[col.field] ? 'Yes' : 'No' }}</span>
+                        <span v-if="col.renderer === 'boolean'">{{ row[col.field] ? t['common.yes'] : t['common.no'] }}</span>
                         <span v-if="col.renderer !== 'boolean' && typeof col.renderer !== 'function'">{{ col.field in row ? row[col.field] : '-' }}</span>
                     </td>
                     <td>
@@ -71,14 +71,26 @@ export default class ListingComponent extends Component {
 
     access_msg = ''
     can_access = false
+    t = {}
 
     async vue_on_create() {
+        this.t = await T(
+            'common.yes',
+            'common.no',
+            'common.not_permission',
+            'common.view',
+            'common.are_you_sure',
+            'common.action_resource_confirm',
+            'common.cancel',
+            'common.continue'
+        )
+
         // Load the resource
         this.resource_class = await resource_service.get(this.resource)
 
         // Make sure we have permission
         if ( !(await this.resource_class.can('list')) ) {
-            this.access_msg = 'Sorry, you do not have permission to view this resource.'
+            this.access_msg = this.t['common.not_permission'].replace('ACTION', this.t['common.view'])
             this.can_access = false
             return
         } else {
@@ -97,15 +109,15 @@ export default class ListingComponent extends Component {
     async perform($event, action, row = undefined) {
         if ( action.confirm ) {
             message_service.modal({
-                title: 'Are you sure?',
-                message: `You are about to ${action.action}${row ? ' this '+this.resource_class.item : ''}. Do you want to continue?`,
+                title: this.t['common.are_you_sure'],
+                message: this.t['common.action_resource_confirm'].replace('ACTION', action.action).replace('RESOURCE', this.resource_class.item),
                 buttons: [
                     {
-                        text: 'Cancel',
+                        text: this.t['common.cancel'],
                         type: 'close',
                     },
                     {
-                        text: 'Continue',
+                        text: this.t['common.continue'],
                         class: ['btn', 'btn-primary'],
                         type: 'close',
                         on_click: async () => {