fix empty content recent page

src/components/Main.vue

@@ -13,26 +13,14 @@
 			<EmptyContent
 				v-if="pageLoading"
 				icon="icon-loading" />
-			<template
+			<EmptyContent
-				v-if="tableData.length === 0 && !pageLoading">
+				v-if="tableData.length === 0 && !pageLoading"
-				<EmptyContent
+				:icon="emptyContentIcon">
-					v-show="$route.name==='FAVORITES'"
+				{{ emptyContentMessage }}
-					icon="icon-star">
+				<template #desc>
-					No favorites yet
+					{{ emptyContentDesc }}
-					<template #desc>
+				</template>
-						Stations you mark as favorite will show up here
+			</EmptyContent>
-					</template>
-				</EmptyContent>
-				<EmptyContent
-					v-if="tableData.length === 0 && !pageLoading"
-					v-show="$route.name==='SEARCH'"
-					icon="icon-search">
-					No search results
-					<template #desc>
-						No stations were found matching your search term
-					</template>
-				</EmptyContent>
-			</template>
 		</AppContent>
 		<Sidebar
 			:show-sidebar="showSidebar"
@@ -79,6 +67,36 @@ export default {
 		player() {
 			return this.$store.state.player
 		},
+		emptyContentMessage() {
+			if (this.$route.name === 'FAVORITES') {
+				return 'No favorites yet'
+			} else if (this.$route.name === 'RECENT') {
+				return 'No recent stations yet'
+			} else if (this.$route.name === 'SEARCH') {
+				return 'No search results'
+			}
+			return 'No stations here'
+		},
+		emptyContentIcon() {
+			if (this.$route.name === 'FAVORITES') {
+				return 'icon-star'
+			} else if (this.$route.name === 'RECENT') {
+				return 'icon-recent'
+			} else if (this.$route.name === 'SEARCH') {
+				return 'icon-search'
+			}
+			return 'icon-radio'
+		},
+		emptyContentDesc() {
+			if (this.$route.name === 'FAVORITES') {
+				return 'Stations you mark as favorite will show up here'
+			} else if (this.$route.name === 'RECENT') {
+				return 'Stations you recently played will show up here'
+			} else if (this.$route.name === 'SEARCH') {
+				return 'No stations were found matching your search term'
+			}
+			return 'No stations here'
+		},
 	},
 	watch: {
 		$route: 'onRoute',