From ff8b8a0399d175351c4da56ba8cf102758114e99 Mon Sep 17 00:00:00 2001
From: Alain Nussbaumer <alain.nussbaumer@alleluia.ch>
Date: Tue, 27 Feb 2024 17:18:58 +0100
Subject: [PATCH] [web] Add types to properties

---
 web-src/src/components/ControlDropdown.vue         |  2 +-
 web-src/src/components/ControlSlider.vue           |  2 +-
 web-src/src/components/CoverArtwork.vue            |  8 +++++++-
 web-src/src/components/ListAlbums.vue              |  2 +-
 web-src/src/components/ListArtists.vue             |  3 +--
 web-src/src/components/ListComposers.vue           |  2 +-
 web-src/src/components/ListDirectories.vue         |  3 +--
 web-src/src/components/ListGenres.vue              |  3 +--
 web-src/src/components/ListItemAlbumSpotify.vue    |  2 +-
 web-src/src/components/ListItemArtistSpotify.vue   |  2 +-
 web-src/src/components/ListItemPlaylistSpotify.vue |  2 +-
 web-src/src/components/ListItemQueueItem.vue       | 14 +++++++-------
 web-src/src/components/ListItemTrackSpotify.vue    |  2 +-
 web-src/src/components/ListPlaylists.vue           |  3 +--
 web-src/src/components/ListTracks.vue              |  9 +++++++--
 web-src/src/components/ModalDialog.vue             |  8 +++++++-
 web-src/src/components/ModalDialogAddRss.vue       |  2 +-
 web-src/src/components/ModalDialogAddUrlStream.vue |  2 +-
 web-src/src/components/ModalDialogAlbum.vue        |  7 ++++++-
 web-src/src/components/ModalDialogAlbumSpotify.vue |  2 +-
 web-src/src/components/ModalDialogArtist.vue       |  2 +-
 .../src/components/ModalDialogArtistSpotify.vue    |  2 +-
 web-src/src/components/ModalDialogComposer.vue     |  2 +-
 web-src/src/components/ModalDialogDirectory.vue    |  2 +-
 web-src/src/components/ModalDialogGenre.vue        |  2 +-
 web-src/src/components/ModalDialogPlaylist.vue     |  2 +-
 web-src/src/components/ModalDialogPlaylistSave.vue |  2 +-
 .../src/components/ModalDialogPlaylistSpotify.vue  |  2 +-
 web-src/src/components/ModalDialogQueueItem.vue    |  2 +-
 .../src/components/ModalDialogRemotePairing.vue    |  2 +-
 web-src/src/components/ModalDialogTrack.vue        |  3 +--
 web-src/src/components/ModalDialogTrackSpotify.vue |  2 +-
 web-src/src/components/ModalDialogUpdate.vue       |  2 +-
 web-src/src/components/NavbarItemOutput.vue        |  2 +-
 web-src/src/components/SettingsCheckbox.vue        |  2 +-
 web-src/src/components/SettingsIntfield.vue        |  7 ++++++-
 web-src/src/components/SettingsTextfield.vue       |  8 ++++++--
 web-src/src/components/TabsSearch.vue              |  3 +--
 38 files changed, 77 insertions(+), 52 deletions(-)

diff --git a/web-src/src/components/ControlDropdown.vue b/web-src/src/components/ControlDropdown.vue
index aaa3d32c..ed95c248 100644
--- a/web-src/src/components/ControlDropdown.vue
+++ b/web-src/src/components/ControlDropdown.vue
@@ -33,7 +33,7 @@
 <script>
 export default {
   name: 'ControlDropdown',
-  props: ['value', 'options'],
+  props: { value: [String, Number], options: Array },
   emits: ['update:value'],
 
   data() {
diff --git a/web-src/src/components/ControlSlider.vue b/web-src/src/components/ControlSlider.vue
index ef729488..3edaf774 100644
--- a/web-src/src/components/ControlSlider.vue
+++ b/web-src/src/components/ControlSlider.vue
@@ -17,7 +17,7 @@
 <script>
 export default {
   name: 'ControlSlider',
-  props: ['value', 'max', 'disabled', 'cursor'],
+  props: { value: Number, max: Number, disabled: Boolean, cursor: String },
   emits: ['update:value'],
 
   computed: {
diff --git a/web-src/src/components/CoverArtwork.vue b/web-src/src/components/CoverArtwork.vue
index 2466e989..d4012b45 100644
--- a/web-src/src/components/CoverArtwork.vue
+++ b/web-src/src/components/CoverArtwork.vue
@@ -13,7 +13,13 @@ import webapi from '@/webapi'
 
 export default {
   name: 'CoverArtwork',
-  props: ['artist', 'album', 'artwork_url', 'maxwidth', 'maxheight'],
+  props: {
+    artist: String,
+    album: String,
+    artwork_url: String,
+    maxwidth: Number,
+    maxheight: Number
+  },
   emits: ['click'],
 
   data() {
diff --git a/web-src/src/components/ListAlbums.vue b/web-src/src/components/ListAlbums.vue
index 117003cc..d9639abd 100644
--- a/web-src/src/components/ListAlbums.vue
+++ b/web-src/src/components/ListAlbums.vue
@@ -77,7 +77,7 @@ import webapi from '@/webapi'
 export default {
   name: 'ListAlbums',
   components: { CoverArtwork, ModalDialog, ModalDialogAlbum },
-  props: ['albums', 'media_kind', 'hide_group_title'],
+  props: { albums: Object, media_kind: String, hide_group_title: Boolean },
   emits: ['play-count-changed', 'podcast-deleted'],
 
   data() {
diff --git a/web-src/src/components/ListArtists.vue b/web-src/src/components/ListArtists.vue
index e4c76080..d6eac955 100644
--- a/web-src/src/components/ListArtists.vue
+++ b/web-src/src/components/ListArtists.vue
@@ -39,8 +39,7 @@ import ModalDialogArtist from '@/components/ModalDialogArtist.vue'
 export default {
   name: 'ListArtists',
   components: { ModalDialogArtist },
-
-  props: ['artists', 'hide_group_title'],
+  props: { artists: Object, hide_group_title: Boolean },
 
   data() {
     return {
diff --git a/web-src/src/components/ListComposers.vue b/web-src/src/components/ListComposers.vue
index f8897b7d..0edb7b0e 100644
--- a/web-src/src/components/ListComposers.vue
+++ b/web-src/src/components/ListComposers.vue
@@ -40,7 +40,7 @@ import ModalDialogComposer from '@/components/ModalDialogComposer.vue'
 export default {
   name: 'ListComposers',
   components: { ModalDialogComposer },
-  props: ['composers', 'media_kind', 'hide_group_title'],
+  props: { composers: Object, media_kind: String, hide_group_title: Boolean },
 
   data() {
     return {
diff --git a/web-src/src/components/ListDirectories.vue b/web-src/src/components/ListDirectories.vue
index da710d97..9f78ccea 100644
--- a/web-src/src/components/ListDirectories.vue
+++ b/web-src/src/components/ListDirectories.vue
@@ -48,8 +48,7 @@ import ModalDialogDirectory from '@/components/ModalDialogDirectory.vue'
 export default {
   name: 'ListDirectories',
   components: { ModalDialogDirectory },
-
-  props: ['directories'],
+  props: { directories: Array },
 
   data() {
     return {
diff --git a/web-src/src/components/ListGenres.vue b/web-src/src/components/ListGenres.vue
index 7f121710..ec7d66ff 100644
--- a/web-src/src/components/ListGenres.vue
+++ b/web-src/src/components/ListGenres.vue
@@ -40,8 +40,7 @@ import ModalDialogGenre from '@/components/ModalDialogGenre.vue'
 export default {
   name: 'ListGenres',
   components: { ModalDialogGenre },
-
-  props: ['genres', 'hide_group_title', 'media_kind'],
+  props: { genres: Object, hide_group_title: Boolean, media_kind: String },
 
   data() {
     return {
diff --git a/web-src/src/components/ListItemAlbumSpotify.vue b/web-src/src/components/ListItemAlbumSpotify.vue
index b3bfc54b..71970a15 100644
--- a/web-src/src/components/ListItemAlbumSpotify.vue
+++ b/web-src/src/components/ListItemAlbumSpotify.vue
@@ -25,7 +25,7 @@
 <script>
 export default {
   name: 'ListItemAlbumSpotify',
-  props: ['album']
+  props: { album: Object }
 }
 </script>
 
diff --git a/web-src/src/components/ListItemArtistSpotify.vue b/web-src/src/components/ListItemArtistSpotify.vue
index f29846ab..bacc289c 100644
--- a/web-src/src/components/ListItemArtistSpotify.vue
+++ b/web-src/src/components/ListItemArtistSpotify.vue
@@ -12,7 +12,7 @@
 <script>
 export default {
   name: 'ListItemArtistSpotify',
-  props: ['artist'],
+  props: { artist: Object },
 
   methods: {
     open_artist() {
diff --git a/web-src/src/components/ListItemPlaylistSpotify.vue b/web-src/src/components/ListItemPlaylistSpotify.vue
index 98f9b51b..310c2d84 100644
--- a/web-src/src/components/ListItemPlaylistSpotify.vue
+++ b/web-src/src/components/ListItemPlaylistSpotify.vue
@@ -13,7 +13,7 @@
 <script>
 export default {
   name: 'ListItemPlaylistSpotify',
-  props: ['playlist'],
+  props: { playlist: Object },
 
   methods: {
     open_playlist() {
diff --git a/web-src/src/components/ListItemQueueItem.vue b/web-src/src/components/ListItemQueueItem.vue
index 7309158f..f6ca97cc 100644
--- a/web-src/src/components/ListItemQueueItem.vue
+++ b/web-src/src/components/ListItemQueueItem.vue
@@ -49,13 +49,13 @@ import webapi from '@/webapi'
 
 export default {
   name: 'ListItemQueueItem',
-  props: [
-    'item',
-    'position',
-    'current_position',
-    'show_only_next_items',
-    'edit_mode'
-  ],
+  props: {
+    item: Object,
+    position: Number,
+    current_position: Number,
+    show_only_next_items: Boolean,
+    edit_mode: Boolean
+  },
 
   computed: {
     state() {
diff --git a/web-src/src/components/ListItemTrackSpotify.vue b/web-src/src/components/ListItemTrackSpotify.vue
index 31b016d5..0f857b95 100644
--- a/web-src/src/components/ListItemTrackSpotify.vue
+++ b/web-src/src/components/ListItemTrackSpotify.vue
@@ -44,7 +44,7 @@ import webapi from '@/webapi'
 
 export default {
   name: 'ListItemTrackSpotify',
-  props: ['track', 'position', 'context_uri'],
+  props: { track: Object, position: Number, context_uri: String },
   methods: {
     play() {
       if (this.track.is_playable) {
diff --git a/web-src/src/components/ListPlaylists.vue b/web-src/src/components/ListPlaylists.vue
index 61877035..67719455 100644
--- a/web-src/src/components/ListPlaylists.vue
+++ b/web-src/src/components/ListPlaylists.vue
@@ -32,8 +32,7 @@ import ModalDialogPlaylist from '@/components/ModalDialogPlaylist.vue'
 export default {
   name: 'ListPlaylists',
   components: { ModalDialogPlaylist },
-
-  props: ['playlists'],
+  props: { playlists: Object },
 
   data() {
     return {
diff --git a/web-src/src/components/ListTracks.vue b/web-src/src/components/ListTracks.vue
index dcb8989d..de0f10da 100644
--- a/web-src/src/components/ListTracks.vue
+++ b/web-src/src/components/ListTracks.vue
@@ -61,8 +61,13 @@ import webapi from '@/webapi'
 export default {
   name: 'ListTracks',
   components: { ModalDialogTrack },
-
-  props: ['tracks', 'uris', 'expression', 'show_progress', 'show_icon'],
+  props: {
+    tracks: Object,
+    uris: String,
+    expression: String,
+    show_progress: Boolean,
+    show_icon: Boolean
+  },
   emits: ['play-count-changed'],
 
   data() {
diff --git a/web-src/src/components/ModalDialog.vue b/web-src/src/components/ModalDialog.vue
index 095e2922..8a712207 100644
--- a/web-src/src/components/ModalDialog.vue
+++ b/web-src/src/components/ModalDialog.vue
@@ -49,7 +49,13 @@
 <script>
 export default {
   name: 'ModalDialog',
-  props: ['show', 'title', 'ok_action', 'delete_action', 'close_action'],
+  props: {
+    show: Boolean,
+    title: String,
+    ok_action: String,
+    delete_action: String,
+    close_action: String
+  },
   emits: ['delete', 'close', 'ok']
 }
 </script>
diff --git a/web-src/src/components/ModalDialogAddRss.vue b/web-src/src/components/ModalDialogAddRss.vue
index 4454448a..92b4c6f6 100644
--- a/web-src/src/components/ModalDialogAddRss.vue
+++ b/web-src/src/components/ModalDialogAddRss.vue
@@ -63,7 +63,7 @@ import webapi from '@/webapi'
 
 export default {
   name: 'ModalDialogAddRss',
-  props: ['show'],
+  props: { show: Boolean },
   emits: ['close', 'podcast-added'],
 
   data() {
diff --git a/web-src/src/components/ModalDialogAddUrlStream.vue b/web-src/src/components/ModalDialogAddUrlStream.vue
index 761f099f..d63019c8 100644
--- a/web-src/src/components/ModalDialogAddUrlStream.vue
+++ b/web-src/src/components/ModalDialogAddUrlStream.vue
@@ -69,7 +69,7 @@ import webapi from '@/webapi'
 
 export default {
   name: 'ModalDialogAddUrlStream',
-  props: ['show'],
+  props: { show: Boolean },
   emits: ['close'],
 
   data() {
diff --git a/web-src/src/components/ModalDialogAlbum.vue b/web-src/src/components/ModalDialogAlbum.vue
index aa7d2d91..dd470094 100644
--- a/web-src/src/components/ModalDialogAlbum.vue
+++ b/web-src/src/components/ModalDialogAlbum.vue
@@ -120,7 +120,12 @@ import webapi from '@/webapi'
 export default {
   name: 'ModalDialogAlbum',
   components: { CoverArtwork },
-  props: ['show', 'album', 'media_kind', 'new_tracks'],
+  props: {
+    show: Boolean,
+    album: Object,
+    media_kind: String,
+    new_tracks: Array
+  },
   emits: ['close', 'remove-podcast', 'play-count-changed'],
 
   data() {
diff --git a/web-src/src/components/ModalDialogAlbumSpotify.vue b/web-src/src/components/ModalDialogAlbumSpotify.vue
index dc04ef2d..0e050e54 100644
--- a/web-src/src/components/ModalDialogAlbumSpotify.vue
+++ b/web-src/src/components/ModalDialogAlbumSpotify.vue
@@ -94,7 +94,7 @@ import webapi from '@/webapi'
 export default {
   name: 'ModalDialogAlbumSpotify',
   components: { CoverArtwork },
-  props: ['show', 'album'],
+  props: { show: Boolean, album: Object },
   emits: ['close'],
 
   data() {
diff --git a/web-src/src/components/ModalDialogArtist.vue b/web-src/src/components/ModalDialogArtist.vue
index 78db81ff..3f0d6cc1 100644
--- a/web-src/src/components/ModalDialogArtist.vue
+++ b/web-src/src/components/ModalDialogArtist.vue
@@ -69,7 +69,7 @@ import webapi from '@/webapi'
 
 export default {
   name: 'ModalDialogArtist',
-  props: ['show', 'artist'],
+  props: { show: Boolean, artist: Object },
   emits: ['close'],
 
   methods: {
diff --git a/web-src/src/components/ModalDialogArtistSpotify.vue b/web-src/src/components/ModalDialogArtistSpotify.vue
index 367dde11..2c9eb2f0 100644
--- a/web-src/src/components/ModalDialogArtistSpotify.vue
+++ b/web-src/src/components/ModalDialogArtistSpotify.vue
@@ -75,7 +75,7 @@ import webapi from '@/webapi'
 
 export default {
   name: 'ModalDialogArtistSpotify',
-  props: ['show', 'artist'],
+  props: { show: Boolean, artist: Object },
   emits: ['close'],
 
   methods: {
diff --git a/web-src/src/components/ModalDialogComposer.vue b/web-src/src/components/ModalDialogComposer.vue
index be12408c..ac55aca8 100644
--- a/web-src/src/components/ModalDialogComposer.vue
+++ b/web-src/src/components/ModalDialogComposer.vue
@@ -71,7 +71,7 @@ import webapi from '@/webapi'
 
 export default {
   name: 'ModalDialogComposer',
-  props: ['show', 'composer'],
+  props: { show: Boolean, composer: Object },
   emits: ['close'],
 
   methods: {
diff --git a/web-src/src/components/ModalDialogDirectory.vue b/web-src/src/components/ModalDialogDirectory.vue
index 843d0778..220a9c6f 100644
--- a/web-src/src/components/ModalDialogDirectory.vue
+++ b/web-src/src/components/ModalDialogDirectory.vue
@@ -42,7 +42,7 @@ import webapi from '@/webapi'
 
 export default {
   name: 'ModalDialogDirectory',
-  props: ['show', 'directory'],
+  props: { show: Boolean, directory: String },
   emits: ['close'],
 
   methods: {
diff --git a/web-src/src/components/ModalDialogGenre.vue b/web-src/src/components/ModalDialogGenre.vue
index 619343ce..b753a862 100644
--- a/web-src/src/components/ModalDialogGenre.vue
+++ b/web-src/src/components/ModalDialogGenre.vue
@@ -62,7 +62,7 @@ import webapi from '@/webapi'
 
 export default {
   name: 'ModalDialogGenre',
-  props: ['genre', 'media_kind', 'show'],
+  props: { genre: Object, media_kind: String, show: Boolean },
   emits: ['close'],
 
   computed: {
diff --git a/web-src/src/components/ModalDialogPlaylist.vue b/web-src/src/components/ModalDialogPlaylist.vue
index d67c91b9..1ab08f02 100644
--- a/web-src/src/components/ModalDialogPlaylist.vue
+++ b/web-src/src/components/ModalDialogPlaylist.vue
@@ -68,7 +68,7 @@ import webapi from '@/webapi'
 
 export default {
   name: 'ModalDialogPlaylist',
-  props: ['show', 'playlist', 'uris'],
+  props: { show: Boolean, playlist: Object, uris: String },
   emits: ['close'],
 
   methods: {
diff --git a/web-src/src/components/ModalDialogPlaylistSave.vue b/web-src/src/components/ModalDialogPlaylistSave.vue
index f2ce74f2..436f5846 100644
--- a/web-src/src/components/ModalDialogPlaylistSave.vue
+++ b/web-src/src/components/ModalDialogPlaylistSave.vue
@@ -71,7 +71,7 @@ import webapi from '@/webapi'
 
 export default {
   name: 'ModalDialogPlaylistSave',
-  props: ['show'],
+  props: { show: Boolean },
   emits: ['close'],
 
   data() {
diff --git a/web-src/src/components/ModalDialogPlaylistSpotify.vue b/web-src/src/components/ModalDialogPlaylistSpotify.vue
index e894e0ea..01d6ca2f 100644
--- a/web-src/src/components/ModalDialogPlaylistSpotify.vue
+++ b/web-src/src/components/ModalDialogPlaylistSpotify.vue
@@ -80,7 +80,7 @@ import webapi from '@/webapi'
 
 export default {
   name: 'ModalDialogPlaylistSpotify',
-  props: ['show', 'playlist'],
+  props: { show: Boolean, playlist: Object },
   emits: ['close'],
 
   methods: {
diff --git a/web-src/src/components/ModalDialogQueueItem.vue b/web-src/src/components/ModalDialogQueueItem.vue
index f1d71c19..8b732fab 100644
--- a/web-src/src/components/ModalDialogQueueItem.vue
+++ b/web-src/src/components/ModalDialogQueueItem.vue
@@ -154,7 +154,7 @@ import webapi from '@/webapi'
 
 export default {
   name: 'ModalDialogQueueItem',
-  props: ['show', 'item'],
+  props: { show: Boolean, item: Object },
   emits: ['close'],
 
   data() {
diff --git a/web-src/src/components/ModalDialogRemotePairing.vue b/web-src/src/components/ModalDialogRemotePairing.vue
index 1e8077af..ee559868 100644
--- a/web-src/src/components/ModalDialogRemotePairing.vue
+++ b/web-src/src/components/ModalDialogRemotePairing.vue
@@ -65,7 +65,7 @@ import webapi from '@/webapi'
 
 export default {
   name: 'ModalDialogRemotePairing',
-  props: ['show'],
+  props: { show: Boolean },
   emits: ['close'],
 
   data() {
diff --git a/web-src/src/components/ModalDialogTrack.vue b/web-src/src/components/ModalDialogTrack.vue
index 3d6933cb..f6cee2bb 100644
--- a/web-src/src/components/ModalDialogTrack.vue
+++ b/web-src/src/components/ModalDialogTrack.vue
@@ -185,8 +185,7 @@ import webapi from '@/webapi'
 
 export default {
   name: 'ModalDialogTrack',
-
-  props: ['show', 'track'],
+  props: { show: Boolean, track: Object },
   emits: ['close', 'play-count-changed'],
 
   data() {
diff --git a/web-src/src/components/ModalDialogTrackSpotify.vue b/web-src/src/components/ModalDialogTrackSpotify.vue
index 7bf85c6a..ee5a4b1e 100644
--- a/web-src/src/components/ModalDialogTrackSpotify.vue
+++ b/web-src/src/components/ModalDialogTrackSpotify.vue
@@ -110,7 +110,7 @@ import webapi from '@/webapi'
 
 export default {
   name: 'ModalDialogTrackSpotify',
-  props: ['show', 'track', 'album'],
+  props: { show: Boolean, track: Object, album: Object },
   emits: ['close'],
 
   methods: {
diff --git a/web-src/src/components/ModalDialogUpdate.vue b/web-src/src/components/ModalDialogUpdate.vue
index 22915635..44857d6f 100644
--- a/web-src/src/components/ModalDialogUpdate.vue
+++ b/web-src/src/components/ModalDialogUpdate.vue
@@ -55,7 +55,7 @@ import webapi from '@/webapi'
 export default {
   name: 'ModalDialogUpdate',
   components: { ModalDialog },
-  props: ['show'],
+  props: { show: Boolean },
   emits: ['close'],
 
   data() {
diff --git a/web-src/src/components/NavbarItemOutput.vue b/web-src/src/components/NavbarItemOutput.vue
index e1465143..fe733b9c 100644
--- a/web-src/src/components/NavbarItemOutput.vue
+++ b/web-src/src/components/NavbarItemOutput.vue
@@ -47,7 +47,7 @@ export default {
   components: {
     ControlSlider
   },
-  props: ['output'],
+  props: { output: Object },
 
   data() {
     return {
diff --git a/web-src/src/components/SettingsCheckbox.vue b/web-src/src/components/SettingsCheckbox.vue
index fa57412c..b69ad5a8 100644
--- a/web-src/src/components/SettingsCheckbox.vue
+++ b/web-src/src/components/SettingsCheckbox.vue
@@ -26,7 +26,7 @@ import webapi from '@/webapi'
 
 export default {
   name: 'SettingsCheckbox',
-  props: ['category_name', 'option_name'],
+  props: { category_name: String, option_name: String },
 
   data() {
     return {
diff --git a/web-src/src/components/SettingsIntfield.vue b/web-src/src/components/SettingsIntfield.vue
index a65e132c..04f93a17 100644
--- a/web-src/src/components/SettingsIntfield.vue
+++ b/web-src/src/components/SettingsIntfield.vue
@@ -32,7 +32,12 @@ import webapi from '@/webapi'
 
 export default {
   name: 'SettingsIntfield',
-  props: ['category_name', 'option_name', 'placeholder', 'disabled'],
+  props: {
+    category_name: String,
+    option_name: String,
+    placeholder: String,
+    disabled: Boolean
+  },
 
   data() {
     return {
diff --git a/web-src/src/components/SettingsTextfield.vue b/web-src/src/components/SettingsTextfield.vue
index 3dd82b08..d144e109 100644
--- a/web-src/src/components/SettingsTextfield.vue
+++ b/web-src/src/components/SettingsTextfield.vue
@@ -31,8 +31,12 @@ import webapi from '@/webapi'
 
 export default {
   name: 'SettingsTextfield',
-
-  props: ['category_name', 'option_name', 'placeholder', 'disabled'],
+  props: {
+    category_name: String,
+    option_name: String,
+    placeholder: String,
+    disabled: Boolean
+  },
 
   data() {
     return {
diff --git a/web-src/src/components/TabsSearch.vue b/web-src/src/components/TabsSearch.vue
index 4298db5a..e5e08dac 100644
--- a/web-src/src/components/TabsSearch.vue
+++ b/web-src/src/components/TabsSearch.vue
@@ -38,8 +38,7 @@ import * as types from '@/store/mutation_types'
 
 export default {
   name: 'TabsSearch',
-
-  props: ['query'],
+  props: { query: String },
 
   computed: {
     spotify_enabled() {