[web] Add default value for properties

web-src/src/components/ControlDropdown.vue

@@ -33,7 +33,10 @@
 <script>
 export default {
   name: 'ControlDropdown',
-  props: { value: [String, Number], options: Array },
+  props: {
+    options: { required: true, type: Array },
+    value: { required: true, type: [String, Number] }
+  },
   emits: ['update:value'],
 
   data() {

web-src/src/components/ControlSlider.vue

@@ -17,7 +17,12 @@
 <script>
 export default {
   name: 'ControlSlider',
-  props: { value: Number, max: Number, disabled: Boolean, cursor: String },
+  props: {
+    cursor: { default: '', type: String },
+    disabled: Boolean,
+    max: { required: true, type: Number },
+    value: { required: true, type: Number }
+  },
   emits: ['update:value'],
 
   computed: {

web-src/src/components/CoverArtwork.vue

@@ -14,11 +14,11 @@ import webapi from '@/webapi'
 export default {
   name: 'CoverArtwork',
   props: {
-    artist: String,
+    album: { default: '', type: String },
-    album: String,
+    artist: { default: '', type: String },
-    artwork_url: String,
+    artwork_url: { default: '', type: String },
-    maxwidth: Number,
+    maxheight: { default: 600, type: Number },
-    maxheight: Number
+    maxwidth: { default: 600, type: Number }
   },
   emits: ['click'],
 

web-src/src/components/IndexButtonList.vue

@@ -15,7 +15,7 @@
 <script>
 export default {
   name: 'IndexButtonList',
-  props: { indices: Array }
+  props: { indices: { required: true, type: Array } }
 }
 </script>
 

web-src/src/components/ListAlbums.vue

@@ -77,7 +77,11 @@ import webapi from '@/webapi'
 export default {
   name: 'ListAlbums',
   components: { CoverArtwork, ModalDialog, ModalDialogAlbum },
-  props: { albums: Object, media_kind: String, hide_group_title: Boolean },
+  props: {
+    albums: { required: true, type: Object },
+    hide_group_title: Boolean,
+    media_kind: { default: '', type: String }
+  },
   emits: ['play-count-changed', 'podcast-deleted'],
 
   data() {

web-src/src/components/ListArtists.vue

@@ -39,7 +39,10 @@ import ModalDialogArtist from '@/components/ModalDialogArtist.vue'
 export default {
   name: 'ListArtists',
   components: { ModalDialogArtist },
-  props: { artists: Object, hide_group_title: Boolean },
+  props: {
+    artists: { required: true, type: Object },
+    hide_group_title: Boolean
+  },
 
   data() {
     return {

web-src/src/components/ListComposers.vue

@@ -40,7 +40,11 @@ import ModalDialogComposer from '@/components/ModalDialogComposer.vue'
 export default {
   name: 'ListComposers',
   components: { ModalDialogComposer },
-  props: { composers: Object, media_kind: String, hide_group_title: Boolean },
+  props: {
+    composers: { required: true, type: Object },
+    hide_group_title: Boolean,
+    media_kind: { required: true, type: String }
+  },
 
   data() {
     return {

web-src/src/components/ListDirectories.vue

@@ -48,7 +48,7 @@ import ModalDialogDirectory from '@/components/ModalDialogDirectory.vue'
 export default {
   name: 'ListDirectories',
   components: { ModalDialogDirectory },
-  props: { directories: Array },
+  props: { directories: { required: true, type: Array } },
 
   data() {
     return {

web-src/src/components/ListGenres.vue

@@ -40,7 +40,11 @@ import ModalDialogGenre from '@/components/ModalDialogGenre.vue'
 export default {
   name: 'ListGenres',
   components: { ModalDialogGenre },
-  props: { genres: Object, hide_group_title: Boolean, media_kind: String },
+  props: {
+    genres: { required: true, type: Object },
+    hide_group_title: Boolean,
+    media_kind: { required: true, type: String }
+  },
 
   data() {
     return {

web-src/src/components/ListItemAlbumSpotify.vue

@@ -25,7 +25,7 @@
 <script>
 export default {
   name: 'ListItemAlbumSpotify',
-  props: { album: Object }
+  props: { album: { required: true, type: Object } }
 }
 </script>
 

web-src/src/components/ListItemArtistSpotify.vue

@@ -12,7 +12,7 @@
 <script>
 export default {
   name: 'ListItemArtistSpotify',
-  props: { artist: Object },
+  props: { artist: { required: true, type: Object } },
 
   methods: {
     open_artist() {

web-src/src/components/ListItemPlaylistSpotify.vue

@@ -13,7 +13,7 @@
 <script>
 export default {
   name: 'ListItemPlaylistSpotify',
-  props: { playlist: Object },
+  props: { playlist: { required: true, type: Object } },
 
   methods: {
     open_playlist() {

web-src/src/components/ListItemQueueItem.vue

@@ -50,11 +50,11 @@ import webapi from '@/webapi'
 export default {
   name: 'ListItemQueueItem',
   props: {
-    item: Object,
+    current_position: { required: true, type: Number },
-    position: Number,
+    edit_mode: Boolean,
-    current_position: Number,
+    item: { required: true, type: Object },
-    show_only_next_items: Boolean,
+    position: { required: true, type: Number },
-    edit_mode: Boolean
+    show_only_next_items: Boolean
   },
 
   computed: {

web-src/src/components/ListItemTrackSpotify.vue

@@ -44,7 +44,11 @@ import webapi from '@/webapi'
 
 export default {
   name: 'ListItemTrackSpotify',
-  props: { track: Object, position: Number, context_uri: String },
+  props: {
+    context_uri: { required: true, type: String },
+    position: { required: true, type: Number },
+    track: { required: true, type: Object }
+  },
   methods: {
     play() {
       if (this.track.is_playable) {

web-src/src/components/ListPlaylists.vue

@@ -32,7 +32,7 @@ import ModalDialogPlaylist from '@/components/ModalDialogPlaylist.vue'
 export default {
   name: 'ListPlaylists',
   components: { ModalDialogPlaylist },
-  props: { playlists: Object },
+  props: { playlists: { required: true, type: Object } },
 
   data() {
     return {

web-src/src/components/ListTracks.vue

@@ -62,11 +62,11 @@ export default {
   name: 'ListTracks',
   components: { ModalDialogTrack },
   props: {
-    tracks: Object,
+    expression: { default: '', type: String },
-    uris: String,
+    show_icon: Boolean,
-    expression: String,
     show_progress: Boolean,
-    show_icon: Boolean
+    tracks: { required: true, type: Object },
+    uris: { default: '', type: String }
   },
   emits: ['play-count-changed'],
 

web-src/src/components/ModalDialog.vue

@@ -12,10 +12,7 @@
             <footer class="card-footer is-clipped">
               <a class="card-footer-item has-text-dark" @click="$emit('close')">
                 <mdicon class="icon" name="cancel" size="16" />
-                <span
+                <span class="is-size-7" v-text="close_action" />
-                  class="is-size-7"
-                  v-text="close_action ? close_action : $t('dialog.cancel')"
-                />
               </a>
               <a
                 v-if="delete_action"
@@ -50,11 +47,11 @@
 export default {
   name: 'ModalDialog',
   props: {
+    close_action: { default: 'dialog.cancel', type: String },
+    delete_action: { default: '', type: String },
+    ok_action: { default: '', type: String },
     show: Boolean,
-    title: String,
+    title: { required: true, type: String }
-    ok_action: String,
-    delete_action: String,
-    close_action: String
   },
   emits: ['delete', 'close', 'ok']
 }

web-src/src/components/ModalDialogAlbum.vue

@@ -121,10 +121,10 @@ export default {
   name: 'ModalDialogAlbum',
   components: { CoverArtwork },
   props: {
-    show: Boolean,
+    album: { required: true, type: Object },
-    album: Object,
+    media_kind: { default: '', type: String },
-    media_kind: String,
+    new_tracks: { required: true, type: Array },
-    new_tracks: Array
+    show: Boolean
   },
   emits: ['close', 'remove-podcast', 'play-count-changed'],
 

web-src/src/components/ModalDialogAlbumSpotify.vue

@@ -94,7 +94,7 @@ import webapi from '@/webapi'
 export default {
   name: 'ModalDialogAlbumSpotify',
   components: { CoverArtwork },
-  props: { show: Boolean, album: Object },
+  props: { album: { required: true, type: Object }, show: Boolean },
   emits: ['close'],
 
   data() {

web-src/src/components/ModalDialogArtist.vue

@@ -69,7 +69,7 @@ import webapi from '@/webapi'
 
 export default {
   name: 'ModalDialogArtist',
-  props: { show: Boolean, artist: Object },
+  props: { artist: { required: true, type: Object }, show: Boolean },
   emits: ['close'],
 
   methods: {

web-src/src/components/ModalDialogArtistSpotify.vue

@@ -75,7 +75,7 @@ import webapi from '@/webapi'
 
 export default {
   name: 'ModalDialogArtistSpotify',
-  props: { show: Boolean, artist: Object },
+  props: { artist: { required: true, type: Object }, show: Boolean },
   emits: ['close'],
 
   methods: {

web-src/src/components/ModalDialogComposer.vue

@@ -71,7 +71,7 @@ import webapi from '@/webapi'
 
 export default {
   name: 'ModalDialogComposer',
-  props: { show: Boolean, composer: Object },
+  props: { composer: { required: true, type: Object }, show: Boolean },
   emits: ['close'],
 
   methods: {

web-src/src/components/ModalDialogDirectory.vue

@@ -42,7 +42,7 @@ import webapi from '@/webapi'
 
 export default {
   name: 'ModalDialogDirectory',
-  props: { show: Boolean, directory: String },
+  props: { directory: { required: true, type: String }, show: Boolean },
   emits: ['close'],
 
   methods: {

web-src/src/components/ModalDialogGenre.vue

@@ -62,7 +62,11 @@ import webapi from '@/webapi'
 
 export default {
   name: 'ModalDialogGenre',
-  props: { genre: Object, media_kind: String, show: Boolean },
+  props: {
+    genre: { required: true, type: Object },
+    media_kind: { required: true, type: String },
+    show: Boolean
+  },
   emits: ['close'],
 
   computed: {

web-src/src/components/ModalDialogPlaylist.vue

@@ -68,7 +68,11 @@ import webapi from '@/webapi'
 
 export default {
   name: 'ModalDialogPlaylist',
-  props: { show: Boolean, playlist: Object, uris: String },
+  props: {
+    playlist: { required: true, type: Object },
+    show: Boolean,
+    uris: { default: '', type: String }
+  },
   emits: ['close'],
 
   methods: {

web-src/src/components/ModalDialogPlaylistSpotify.vue

@@ -80,7 +80,7 @@ import webapi from '@/webapi'
 
 export default {
   name: 'ModalDialogPlaylistSpotify',
-  props: { show: Boolean, playlist: Object },
+  props: { playlist: { required: true, type: Object }, show: Boolean },
   emits: ['close'],
 
   methods: {

web-src/src/components/ModalDialogQueueItem.vue

@@ -154,7 +154,7 @@ import webapi from '@/webapi'
 
 export default {
   name: 'ModalDialogQueueItem',
-  props: { show: Boolean, item: Object },
+  props: { item: { required: true, type: Object }, show: Boolean },
   emits: ['close'],
 
   data() {

web-src/src/components/ModalDialogTrack.vue

@@ -185,7 +185,7 @@ import webapi from '@/webapi'
 
 export default {
   name: 'ModalDialogTrack',
-  props: { show: Boolean, track: Object },
+  props: { show: Boolean, track: { required: true, type: Object } },
   emits: ['close', 'play-count-changed'],
 
   data() {

web-src/src/components/ModalDialogTrackSpotify.vue

@@ -110,7 +110,11 @@ import webapi from '@/webapi'
 
 export default {
   name: 'ModalDialogTrackSpotify',
-  props: { show: Boolean, track: Object, album: Object },
+  props: {
+    album: { required: true, type: Object },
+    show: Boolean,
+    track: { required: true, type: Object }
+  },
   emits: ['close'],
 
   methods: {

web-src/src/components/NavbarItemLink.vue

@@ -16,7 +16,7 @@ export default {
   name: 'NavbarItemLink',
   props: {
     exact: Boolean,
-    to: Object
+    to: { required: true, type: Object }
   },
 
   computed: {

web-src/src/components/NavbarItemOutput.vue

@@ -47,12 +47,12 @@ export default {
   components: {
     ControlSlider
   },
-  props: { output: Object },
+  props: { output: { required: true, type: Object } },
 
   data() {
     return {
-      volume: this.output.selected ? this.output.volume : 0,
+      cursor: mdiCancel,
-      cursor: mdiCancel
+      volume: this.output.selected ? this.output.volume : 0
     }
   },
 

web-src/src/components/PlayerButtonSeekBack.vue

@@ -14,11 +14,8 @@ import webapi from '@/webapi'
 export default {
   name: 'PlayerButtonSeekBack',
   props: {
-    seek_ms: Number,
+    icon_size: { default: 16, type: Number },
-    icon_size: {
+    seek_ms: { required: true, type: Number }
-      type: Number,
-      default: 16
-    }
   },
 
   computed: {

web-src/src/components/PlayerButtonSeekForward.vue

@@ -14,11 +14,8 @@ import webapi from '@/webapi'
 export default {
   name: 'PlayerButtonSeekForward',
   props: {
-    seek_ms: Number,
+    icon_size: { default: 16, type: Number },
-    icon_size: {
+    seek_ms: { required: true, type: Number }
-      type: Number,
-      default: 16
-    }
   },
 
   computed: {

web-src/src/components/SettingsCheckbox.vue

@@ -26,13 +26,16 @@ import webapi from '@/webapi'
 
 export default {
   name: 'SettingsCheckbox',
-  props: { category_name: String, option_name: String },
+  props: {
+    category_name: { required: true, type: String },
+    option_name: { required: true, type: String }
+  },
 
   data() {
     return {
+      statusUpdate: '',
       timerDelay: 2000,
-      timerId: -1,
+      timerId: -1
-      statusUpdate: ''
     }
   },
 

web-src/src/components/SettingsIntfield.vue

@@ -33,10 +33,10 @@ import webapi from '@/webapi'
 export default {
   name: 'SettingsIntfield',
   props: {
-    category_name: String,
+    category_name: { required: true, type: String },
-    option_name: String,
+    disabled: Boolean,
-    placeholder: String,
+    option_name: { required: true, type: String },
-    disabled: Boolean
+    placeholder: { default: '', type: String }
   },
 
   data() {

web-src/src/components/SettingsTextfield.vue

@@ -32,10 +32,10 @@ import webapi from '@/webapi'
 export default {
   name: 'SettingsTextfield',
   props: {
-    category_name: String,
+    category_name: { required: true, type: String },
-    option_name: String,
+    disabled: Boolean,
-    placeholder: String,
+    option_name: { required: true, type: String },
-    disabled: Boolean
+    placeholder: { default: '', type: String }
   },
 
   data() {

web-src/src/components/TabsSearch.vue

@@ -38,7 +38,7 @@ import * as types from '@/store/mutation_types'
 
 export default {
   name: 'TabsSearch',
-  props: { query: String },
+  props: { query: { default: '', type: String } },
 
   computed: {
     spotify_enabled() {