refactor: moved all track preview logic in its component

src/components/globals/PreviewControls.vue

@@ -10,16 +10,12 @@
 </template>
 
 <script>
-import EventBus from '@/utils/EventBus'
+import { previewMouseEnter, previewMouseLeave } from '@components/globals/TheTrackPreview.vue'
 
 export default {
 	methods: {
-		previewMouseEnter(e) {
+		previewMouseEnter,
-			EventBus.$emit('trackPreview:previewMouseEnter', e)
+		previewMouseLeave
-		},
-		previewMouseLeave(e) {
-			EventBus.$emit('trackPreview:previewMouseLeave', e)
-		}
 	}
 }
 </script>

src/components/globals/TheTrackPreview.vue

@@ -5,10 +5,22 @@
 </template>
 
 <script>
+import { mapGetters } from 'vuex'
 import EventBus from '@/utils/EventBus'
 
 import { adjustVolume } from '@/utils/adjust-volume'
-import { mapGetters } from 'vuex'
+
+export function playPausePreview(event) {
+	EventBus.$emit('trackPreview:playPausePreview', event)
+}
+
+export function previewMouseEnter(event) {
+	EventBus.$emit('trackPreview:previewMouseEnter', event)
+}
+
+export function previewMouseLeave(event) {
+	EventBus.$emit('trackPreview:previewMouseLeave', event)
+}
 
 export default {
 	data: () => ({

src/components/pages/Charts.vue

@@ -91,8 +91,8 @@ import { sendAddToQueue } from '@/utils/downloads'
 import { convertDuration } from '@/utils/utils'
 import { getChartsData } from '@/data/charts'
 
-import EventBus from '@/utils/EventBus'
 import PreviewControls from '@components/globals/PreviewControls.vue'
+import { playPausePreview } from '@components/globals/TheTrackPreview.vue'
 
 export default {
 	components: {
@@ -137,9 +137,7 @@ export default {
 	},
 	methods: {
 		convertDuration,
-		playPausePreview(e) {
+		playPausePreview,
-			EventBus.$emit('trackPreview:playPausePreview', e)
-		},
 		addToQueue(e) {
 			e.stopPropagation()
 			sendAddToQueue(e.currentTarget.dataset.link)

src/components/pages/Favorites.vue

@@ -188,9 +188,9 @@ import { convertDuration } from '@/utils/utils'
 import { toast } from '@/utils/toasts'
 import { getFavoritesData } from '@/data/favorites'
 
-import EventBus from '@/utils/EventBus'
 import PreviewControls from '@components/globals/PreviewControls.vue'
 import CoverContainer from '@components/globals/CoverContainer.vue'
+import { playPausePreview } from '@components/globals/TheTrackPreview.vue'
 import { BaseTabs, BaseTab } from '@components/globals/BaseTabs'
 
 export default {
@@ -244,9 +244,7 @@ export default {
 		})
 	},
 	methods: {
-		playPausePreview(e) {
+		playPausePreview,
-			EventBus.$emit('trackPreview:playPausePreview', e)
-		},
 		convertDuration,
 		downloadAllOfType() {
 			try {

src/components/pages/LinkAnalyzer.vue

@@ -137,7 +137,6 @@
 import { socket } from '@/utils/socket'
 import { convertDuration } from '@/utils/utils'
 import { COUNTRIES } from '@/utils/countries'
-import EventBus from '@/utils/EventBus'
 import { sendAddToQueue } from '@/utils/downloads'
 
 export default {
@@ -210,8 +209,6 @@ export default {
 		}
 	},
 	mounted() {
-		EventBus.$on('linkAnalyzerTab:reset', this.reset)
-
 		socket.on('analyze_track', this.showTrack)
 		socket.on('analyze_album', this.showAlbum)
 		socket.on('analyze_notSupported', this.notSupported)

src/components/pages/Search.vue

@@ -42,7 +42,6 @@ import { BaseTabs, BaseTab } from '@components/globals/BaseTabs'
 import { socket } from '@/utils/socket'
 import { sendAddToQueue } from '@/utils/downloads'
 import { numberWithDots, convertDuration } from '@/utils/utils'
-import EventBus from '@/utils/EventBus'
 
 import { formatSingleTrack, formatAlbums, formatArtist, formatPlaylist } from '@/data/search'
 import { standardizeData } from '@/data/standardize'

src/components/pages/Tracklist.vue

@@ -155,7 +155,7 @@ import { isEmpty } from 'lodash-es'
 import { socket } from '@/utils/socket'
 import Downloads from '@/utils/downloads'
 import Utils from '@/utils/utils'
-import EventBus from '@/utils/EventBus'
+import { playPausePreview } from '@components/globals/TheTrackPreview.vue'
 
 export default {
 	data() {
@@ -172,16 +172,12 @@ export default {
 		}
 	},
 	mounted() {
-		EventBus.$on('tracklistTab:selectRow', this.selectRow)
-
 		socket.on('show_album', this.showAlbum)
 		socket.on('show_playlist', this.showPlaylist)
 		socket.on('show_spotifyplaylist', this.showSpotifyPlaylist)
 	},
 	methods: {
-		playPausePreview(e) {
+		playPausePreview,
-			EventBus.$emit('trackPreview:playPausePreview', e)
-		},
 		reset() {
 			this.title = 'Loading...'
 			this.image = ''

src/components/search/ResultsTracks.vue

@@ -88,8 +88,8 @@
 <script>
 import BaseLoadingPlaceholder from '@components/globals/BaseLoadingPlaceholder.vue'
 import PreviewControls from '@components/globals/PreviewControls.vue'
+import { playPausePreview } from '@components/globals/TheTrackPreview.vue'
 
-import EventBus from '@/utils/EventBus'
 import { convertDuration } from '@/utils/utils'
 
 import { formatTitle } from '@/data/search'
@@ -127,9 +127,7 @@ export default {
 	methods: {
 		convertDuration,
 		formatTitle,
-		playPausePreview(e) {
+		playPausePreview
-			EventBus.$emit('trackPreview:playPausePreview', e)
-		}
 	}
 }
 </script>