See #559: Use translations mixins in filters

front/src/components/favorites/List.vue

@@ -24,7 +24,7 @@
             <label><translate>Ordering</translate></label>
             <select class="ui dropdown" v-model="ordering">
               <option v-for="option in orderingOptions" :value="option[0]">
-                {{ option[1] }}
+                {{ sharedLabels.filters[option[1]] }}
               </option>
             </select>
           </div>
@@ -69,10 +69,11 @@ import RadioButton from '@/components/radios/Button'
 import Pagination from '@/components/Pagination'
 import OrderingMixin from '@/components/mixins/Ordering'
 import PaginationMixin from '@/components/mixins/Pagination'
+import TranslationsMixin from '@/components/mixins/Translations'
 const FAVORITES_URL = 'tracks/'
 
 export default {
-  mixins: [OrderingMixin, PaginationMixin],
+  mixins: [OrderingMixin, PaginationMixin, TranslationsMixin],
   components: {
     TrackTable,
     RadioButton,
@@ -90,10 +91,10 @@ export default {
       orderingDirection: defaultOrdering.direction || '+',
       ordering: defaultOrdering.field,
       orderingOptions: [
-        ['creation_date', 'Creation date'],
-        ['title', 'Track name'],
-        ['album__title', 'Album name'],
-        ['artist__name', 'Artist name']
+        ['creation_date', 'creation_date'],
+        ['title', 'track_title'],
+        ['album__title', 'album_title'],
+        ['artist__name', 'artist_name']
       ]
     }
   },

front/src/components/library/Artists.vue

@@ -16,7 +16,7 @@
             <label><translate>Ordering</translate></label>
             <select class="ui dropdown" v-model="ordering">
               <option v-for="option in orderingOptions" :value="option[0]">
-                {{ option[1] }}
+                {{ sharedLabels.filters[option[1]] }}
               </option>
             </select>
           </div>
@@ -77,13 +77,14 @@ import logger from '@/logging'
 
 import OrderingMixin from '@/components/mixins/Ordering'
 import PaginationMixin from '@/components/mixins/Pagination'
+import TranslationsMixin from '@/components/mixins/Translations'
 import ArtistCard from '@/components/audio/artist/Card'
 import Pagination from '@/components/Pagination'
 
 const FETCH_URL = 'artists/'
 
 export default {
-  mixins: [OrderingMixin, PaginationMixin],
+  mixins: [OrderingMixin, PaginationMixin, TranslationsMixin],
   props: {
     defaultQuery: {type: String, required: false, default: ''}
   },
@@ -102,8 +103,8 @@ export default {
       orderingDirection: defaultOrdering.direction || '+',
       ordering: defaultOrdering.field,
       orderingOptions: [
-        ['creation_date', 'Creation date'],
-        ['name', 'Name']
+        ['creation_date', 'creation_date'],
+        ['name', 'name']
       ]
     }
   },

front/src/components/library/Radios.vue

@@ -34,7 +34,7 @@
             <label><translate>Ordering</translate></label>
             <select class="ui dropdown" v-model="ordering">
               <option v-for="option in orderingOptions" :value="option[0]">
-                {{ option[1] }}
+                {{ sharedLabels.filters[option[1]] }}
               </option>
             </select>
           </div>
@@ -99,13 +99,14 @@ import logger from '@/logging'
 
 import OrderingMixin from '@/components/mixins/Ordering'
 import PaginationMixin from '@/components/mixins/Pagination'
+import TranslationsMixin from '@/components/mixins/Translations'
 import RadioCard from '@/components/radios/Card'
 import Pagination from '@/components/Pagination'
 
 const FETCH_URL = 'radios/radios/'
 
 export default {
-  mixins: [OrderingMixin, PaginationMixin],
+  mixins: [OrderingMixin, PaginationMixin, TranslationsMixin],
   props: {
     defaultQuery: {type: String, required: false, default: ''}
   },
@@ -124,8 +125,8 @@ export default {
       orderingDirection: defaultOrdering.direction || '+',
       ordering: defaultOrdering.field,
       orderingOptions: [
-        ['creation_date', 'Creation date'],
-        ['name', 'Name']
+        ['creation_date', 'creation_date'],
+        ['name', 'name']
       ]
     }
   },

front/src/components/manage/library/FilesTable.vue

@@ -10,7 +10,7 @@
           <label><translate>Ordering</translate></label>
           <select class="ui dropdown" v-model="ordering">
             <option v-for="option in orderingOptions" :value="option[0]">
-              {{ option[1] }}
+              {{ sharedLabels.filters[option[1]] }}
             </option>
           </select>
         </div>
@@ -111,9 +111,10 @@ import time from '@/utils/time'
 import Pagination from '@/components/Pagination'
 import ActionTable from '@/components/common/ActionTable'
 import OrderingMixin from '@/components/mixins/Ordering'
+import TranslationsMixin from '@/components/mixins/Translations'
 
 export default {
-  mixins: [OrderingMixin],
+  mixins: [OrderingMixin, TranslationsMixin],
   props: {
     filters: {type: Object, required: false}
   },
@@ -133,12 +134,12 @@ export default {
       orderingDirection: defaultOrdering.direction || '+',
       ordering: defaultOrdering.field,
       orderingOptions: [
-        ['creation_date', 'Creation date'],
-        ['accessed_date', 'Accessed date'],
-        ['modification_date', 'Modification date'],
-        ['size', 'Size'],
-        ['bitrate', 'Bitrate'],
-        ['duration', 'Duration']
+        ['creation_date', 'creation_date'],
+        ['accessed_date', 'accessed_date'],
+        ['modification_date', 'modification_date'],
+        ['size', 'size'],
+        ['bitrate', 'bitrate'],
+        ['duration', 'duration']
       ]
 
     }

front/src/components/manage/users/InvitationsTable.vue

@@ -10,7 +10,7 @@
           <label><translate>Ordering</translate></label>
           <select class="ui dropdown" v-model="ordering">
             <option v-for="option in orderingOptions" :value="option[0]">
-              {{ option[1] }}
+              {{ sharedLabels.filters[option[1]] }}
             </option>
           </select>
         </div>
@@ -90,9 +90,10 @@ import _ from 'lodash'
 import Pagination from '@/components/Pagination'
 import ActionTable from '@/components/common/ActionTable'
 import OrderingMixin from '@/components/mixins/Ordering'
+import TranslationsMixin from '@/components/mixins/Translations'
 
 export default {
-  mixins: [OrderingMixin],
+  mixins: [OrderingMixin, TranslationsMixin],
   props: {
     filters: {type: Object, required: false}
   },
@@ -113,8 +114,8 @@ export default {
       orderingDirection: defaultOrdering.direction || '+',
       ordering: defaultOrdering.field,
       orderingOptions: [
-        ['expiration_date', 'Expiration date'],
-        ['creation_date', 'Creation date']
+        ['expiration_date', 'expiration_date'],
+        ['creation_date', 'creation_date']
       ]
 
     }

front/src/components/manage/users/UsersTable.vue

@@ -10,7 +10,7 @@
           <label><translate>Ordering</translate></label>
           <select class="ui dropdown" v-model="ordering">
             <option v-for="option in orderingOptions" :value="option[0]">
-              {{ option[1] }}
+              {{ sharedLabels.filters[option[1]] }}
             </option>
           </select>
         </div>
@@ -101,9 +101,10 @@ import time from '@/utils/time'
 import Pagination from '@/components/Pagination'
 import ActionTable from '@/components/common/ActionTable'
 import OrderingMixin from '@/components/mixins/Ordering'
+import TranslationsMixin from '@/components/mixins/Translations'
 
 export default {
-  mixins: [OrderingMixin],
+  mixins: [OrderingMixin, TranslationsMixin],
   props: {
     filters: {type: Object, required: false}
   },
@@ -123,9 +124,9 @@ export default {
       orderingDirection: defaultOrdering.direction || '+',
       ordering: defaultOrdering.field,
       orderingOptions: [
-        ['date_joined', 'Sign-up date'],
-        ['last_activity', 'Last activity'],
-        ['username', 'Username']
+        ['date_joined', 'date_joined'],
+        ['last_activity', 'last_activity'],
+        ['username', 'username']
       ]
 
     }

front/src/views/content/libraries/FilesTable.vue

@@ -22,7 +22,7 @@
           <label><translate>Ordering</translate></label>
           <select class="ui dropdown" v-model="ordering">
             <option v-for="option in orderingOptions" :value="option[0]">
-              {{ option[1] }}
+              {{ sharedLabels.filters[option[1]] }}
             </option>
           </select>
         </div>
@@ -127,9 +127,10 @@ import {normalizeQuery, parseTokens, compileTokens} from '@/search'
 import Pagination from '@/components/Pagination'
 import ActionTable from '@/components/common/ActionTable'
 import OrderingMixin from '@/components/mixins/Ordering'
+import TranslationsMixin from '@/components/mixins/Translations'
 
 export default {
-  mixins: [OrderingMixin],
+  mixins: [OrderingMixin, TranslationsMixin],
   props: {
     filters: {type: Object, required: false},
     defaultQuery: {type: String, default: ''},
@@ -153,13 +154,13 @@ export default {
       orderingDirection: '-',
       ordering: 'creation_date',
       orderingOptions: [
-        ['creation_date', 'Creation date'],
-        ['title', 'Title'],
-        ['size', 'Size'],
-        ['duration', 'Duration'],
-        ['bitrate', 'Bitrate'],
-        ['album_title', 'Album title'],
-        ['artist_name', 'Artist name']
+        ['creation_date', 'creation_date'],
+        ['title', 'title'],
+        ['size', 'size'],
+        ['duration', 'duration'],
+        ['bitrate', 'bitrate'],
+        ['album_title', 'album_title'],
+        ['artist_name', 'artist_name']
       ]
     }
   },

front/src/views/playlists/List.vue

@@ -18,7 +18,7 @@
             <label><translate>Ordering</translate></label>
             <select class="ui dropdown" v-model="ordering">
               <option v-for="option in orderingOptions" :value="option[0]">
-                {{ option[1] }}
+                {{ sharedLabels.filters[option[1]] }}
               </option>
             </select>
           </div>
@@ -61,13 +61,14 @@ import $ from 'jquery'
 
 import OrderingMixin from '@/components/mixins/Ordering'
 import PaginationMixin from '@/components/mixins/Pagination'
+import TranslationsMixin from '@/components/mixins/Translations'
 import PlaylistCardList from '@/components/playlists/CardList'
 import Pagination from '@/components/Pagination'
 
 const FETCH_URL = 'playlists/'
 
 export default {
-  mixins: [OrderingMixin, PaginationMixin],
+  mixins: [OrderingMixin, PaginationMixin, TranslationsMixin],
   props: {
     defaultQuery: {type: String, required: false, default: ''}
   },
@@ -86,9 +87,9 @@ export default {
       orderingDirection: defaultOrdering.direction || '+',
       ordering: defaultOrdering.field,
       orderingOptions: [
-        ['creation_date', 'Creation date'],
-        ['modification_date', 'Last modification date'],
-        ['name', 'Name']
+        ['creation_date', 'creation_date'],
+        ['modification_date', 'modification_date'],
+        ['name', 'name']
       ]
     }
   },