show empty pages

src/components/Main.vue

@@ -3,14 +3,16 @@
 		<Navigation
 			:station-data="tableData" />
 		<AppContent>
-			<Breadcrumbs class="breadcrumbs">
+			<Breadcrumbs
+				v-if="tableData.length > 0"
+				class="breadcrumbs">
 				<Breadcrumb title="Home" href="/" />
 				<Breadcrumb
 					:title="t('radio', 'Top')"
 					href="/Top" />
 			</Breadcrumbs>
 			<Table
-				v-if="!pageLoading"
+				v-if="!pageLoading && tableData.length > 0"
 				:station-data="tableData"
 				:favorites="favorites"
 				@doPlay="doPlay"
@@ -18,6 +20,24 @@
 			<EmptyContent
 				v-if="pageLoading"
 				icon="icon-loading" />
+			<EmptyContent
+				v-if="tableData.length === 0 && !pageLoading"
+				v-show="$route.name==='FAVORITES'"
+				icon="icon-star">
+				No favorites yet
+				<template #desc>
+					Stations you mark as favorite will show up here
+				</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>
 		</AppContent>
 	</Content>
 </template>
@@ -182,10 +202,20 @@ export default {
 			let queryURI = queryBase
 			let sortBy = 'clickcount'
 
+			// Inital page loading
 			if (vm.offset === 0) {
 				vm.pageLoading = true
 			}
 
+			// Skip loading more stations on certain sites
+			if (vm.offset > 0
+				&& (vm.$route.name === 'FAVORITES'
+				|| vm.$route.name === 'RECENT')) {
+				return true
+			}
+
+			console.log(vm.$route.name)
+
 			if (menuState === 'TOP') {
 				sortBy = 'clickcount'
 			} else if (menuState === 'NEW') {