From 79ab849df0ac4183c48d3916effe7ebf5b1b4f46 Mon Sep 17 00:00:00 2001
From: RemixDev <RemixDev64@gmail.com>
Date: Tue, 1 Mar 2022 11:16:27 +0100
Subject: [PATCH] Added search error page For example while searching for curl
 and wget

---
 src/components/pages/Search.vue            |  3 ++-
 src/components/search/ResultsAlbums.vue    |  9 ++++++---
 src/components/search/ResultsAll.vue       |  9 ++++++---
 src/components/search/ResultsArtists.vue   |  9 ++++++---
 src/components/search/ResultsError.vue     | 17 +++++++++++++++++
 src/components/search/ResultsPlaylists.vue |  9 ++++++---
 src/components/search/ResultsTracks.vue    |  9 ++++++---
 src/data/standardize.js                    |  3 ++-
 src/lang/en.mjs                            |  3 ++-
 src/lang/it.mjs                            |  3 ++-
 10 files changed, 55 insertions(+), 19 deletions(-)
 create mode 100644 src/components/search/ResultsError.vue

diff --git a/src/components/pages/Search.vue b/src/components/pages/Search.vue
index be05709..61601bd 100644
--- a/src/components/pages/Search.vue
+++ b/src/components/pages/Search.vue
@@ -186,10 +186,11 @@ export default defineComponent({
 
 		// Search watcher
 		watch(result, newValue => {
-			const { next: nextResult, total, type, data: newData } = newValue
+			const { next: nextResult, total, type, data: newData, error } = newValue
 
 			const currentTabKey = `${type}Tab`
 			let next = total
+			state.results[currentTabKey].error = error
 
 			if (nextResult) {
 				next = parseInt(nextResult.match(/index=(\d*)/)[1])
diff --git a/src/components/search/ResultsAlbums.vue b/src/components/search/ResultsAlbums.vue
index e09a6ca..37f1a96 100644
--- a/src/components/search/ResultsAlbums.vue
+++ b/src/components/search/ResultsAlbums.vue
@@ -3,8 +3,9 @@
 		<BaseLoadingPlaceholder v-if="isLoading" />
 
 		<template v-else>
-			<div v-if="viewInfo.data.length === 0">
-				<h1>{{ $t('search.noResultsAlbum') }}</h1>
+			<ResultsError v-if="viewInfo.error" :error="viewInfo.error"></ResultsError>
+			<div v-else-if="viewInfo.data.length === 0">
+				<h1 class="text-center">{{ $t('search.noResultsAlbum') }}</h1>
 			</div>
 
 			<div v-else class="release-grid">
@@ -45,11 +46,13 @@
 <script>
 import BaseLoadingPlaceholder from '@components/globals/BaseLoadingPlaceholder.vue'
 import CoverContainer from '@components/globals/CoverContainer.vue'
+import ResultsError from '@components/search/ResultsError.vue'
 
 export default {
 	components: {
 		BaseLoadingPlaceholder,
-		CoverContainer
+		CoverContainer,
+		ResultsError
 	},
 	props: {
 		viewInfo: {
diff --git a/src/components/search/ResultsAll.vue b/src/components/search/ResultsAll.vue
index 578575e..d096f5e 100644
--- a/src/components/search/ResultsAll.vue
+++ b/src/components/search/ResultsAll.vue
@@ -1,7 +1,8 @@
 <template>
 	<section>
-		<div v-if="!thereAreResults">
-			<h1>{{ $t('search.noResults') }}</h1>
+		<ResultsError v-if="viewInfo.ERROR" :error="viewInfo.ERROR"></ResultsError>
+		<div v-else-if="!thereAreResults">
+			<h1 class="text-center">{{ $t('search.noResults') }}</h1>
 		</div>
 
 		<template v-else>
@@ -66,6 +67,7 @@ import ResultsTracks from '@components/search/ResultsTracks.vue'
 import ResultsAlbums from '@components/search/ResultsAlbums.vue'
 import ResultsArtists from '@components/search/ResultsArtists.vue'
 import ResultsPlaylists from '@components/search/ResultsPlaylists.vue'
+import ResultsError from '@components/search/ResultsError.vue'
 
 import { formatSingleTrack, formatAlbums, formatArtist, formatPlaylist } from '@/data/search'
 import { standardizeData } from '@/data/standardize'
@@ -76,7 +78,8 @@ export default {
 		ResultsTracks,
 		ResultsAlbums,
 		ResultsArtists,
-		ResultsPlaylists
+		ResultsPlaylists,
+		ResultsError
 	},
 	props: {
 		viewInfo: {
diff --git a/src/components/search/ResultsArtists.vue b/src/components/search/ResultsArtists.vue
index 56733a4..fc408ba 100644
--- a/src/components/search/ResultsArtists.vue
+++ b/src/components/search/ResultsArtists.vue
@@ -3,8 +3,9 @@
 		<BaseLoadingPlaceholder v-if="isLoading" />
 
 		<template v-else>
-			<div v-if="viewInfo.data.length === 0">
-				<h1>{{ $t('search.noResultsArtist') }}</h1>
+			<ResultsError v-if="viewInfo.error" :error="viewInfo.error"></ResultsError>
+			<div v-else-if="viewInfo.data.length === 0">
+				<h1 class="text-center">{{ $t('search.noResultsArtist') }}</h1>
 			</div>
 
 			<div v-else class="release-grid">
@@ -33,11 +34,13 @@
 <script>
 import BaseLoadingPlaceholder from '@components/globals/BaseLoadingPlaceholder.vue'
 import CoverContainer from '@components/globals/CoverContainer.vue'
+import ResultsError from '@components/search/ResultsError.vue'
 
 export default {
 	components: {
 		BaseLoadingPlaceholder,
-		CoverContainer
+		CoverContainer,
+		ResultsError
 	},
 	props: {
 		viewInfo: {
diff --git a/src/components/search/ResultsError.vue b/src/components/search/ResultsError.vue
new file mode 100644
index 0000000..088f9c8
--- /dev/null
+++ b/src/components/search/ResultsError.vue
@@ -0,0 +1,17 @@
+<template>
+  <div class="text-center">
+    <h1>{{ $t('search.error') }}</h1>
+    <p class="secondary-text mt-4">{{ error }}</p>
+  </div>
+</template>
+
+<script>
+export default {
+  props: {
+		error: {
+			type: String,
+			default: "Error"
+		}
+	}
+}
+</script>
diff --git a/src/components/search/ResultsPlaylists.vue b/src/components/search/ResultsPlaylists.vue
index 88a5c23..d0ffa1c 100644
--- a/src/components/search/ResultsPlaylists.vue
+++ b/src/components/search/ResultsPlaylists.vue
@@ -3,8 +3,9 @@
 		<BaseLoadingPlaceholder v-if="isLoading" />
 
 		<template v-else>
-			<div v-if="viewInfo.data.length === 0">
-				<h1>{{ $t('search.noResultsPlaylist') }}</h1>
+			<ResultsError v-if="viewInfo.error" :error="viewInfo.error"></ResultsError>
+			<div v-else-if="viewInfo.data.length === 0">
+				<h1 class="text-center">{{ $t('search.noResultsPlaylist') }}</h1>
 			</div>
 			<div v-else class="release-grid">
 				<div v-for="playlist in viewInfo.data.slice(0, itemsToShow)" :key="playlist.playlistID" class="w-40 release">
@@ -38,11 +39,13 @@
 <script>
 import BaseLoadingPlaceholder from '@components/globals/BaseLoadingPlaceholder.vue'
 import CoverContainer from '@components/globals/CoverContainer.vue'
+import ResultsError from '@components/search/ResultsError.vue'
 
 export default {
 	components: {
 		BaseLoadingPlaceholder,
-		CoverContainer
+		CoverContainer,
+		ResultsError
 	},
 	props: {
 		viewInfo: {
diff --git a/src/components/search/ResultsTracks.vue b/src/components/search/ResultsTracks.vue
index 56a607d..7dbc620 100644
--- a/src/components/search/ResultsTracks.vue
+++ b/src/components/search/ResultsTracks.vue
@@ -3,8 +3,9 @@
 		<BaseLoadingPlaceholder v-if="isLoading" />
 
 		<template v-else>
-			<div v-if="viewInfo.data.length === 0">
-				<h1>{{ $t('search.noResultsTrack') }}</h1>
+			<ResultsError v-if="viewInfo.error" :error="viewInfo.error"></ResultsError>
+			<div v-else-if="viewInfo.data.length === 0">
+				<h1 class="text-center">{{ $t('search.noResultsTrack') }}</h1>
 			</div>
 
 			<table v-else class="table w-full table--tracks">
@@ -88,6 +89,7 @@
 <script>
 import BaseLoadingPlaceholder from '@components/globals/BaseLoadingPlaceholder.vue'
 import PreviewControls from '@components/globals/PreviewControls.vue'
+import ResultsError from '@components/search/ResultsError.vue'
 import { playPausePreview } from '@components/globals/TheTrackPreview.vue'
 
 import { convertDuration } from '@/utils/utils'
@@ -97,7 +99,8 @@ import { formatTitle } from '@/data/search'
 export default {
 	components: {
 		BaseLoadingPlaceholder,
-		PreviewControls
+		PreviewControls,
+		ResultsError
 	},
 	props: {
 		viewInfo: {
diff --git a/src/data/standardize.js b/src/data/standardize.js
index 3dd7076..b95e03c 100644
--- a/src/data/standardize.js
+++ b/src/data/standardize.js
@@ -13,7 +13,8 @@ export function standardizeData(rawObj, formatFunc) {
 
 		return {
 			data: formattedData,
-			hasLoaded: rawObj.hasLoaded
+			hasLoaded: rawObj.hasLoaded,
+			error: rawObj.error
 		}
 	}
 }
diff --git a/src/lang/en.mjs b/src/lang/en.mjs
index ee6816e..4027921 100644
--- a/src/lang/en.mjs
+++ b/src/lang/en.mjs
@@ -189,7 +189,8 @@ const en = {
 		noResultsTrack: 'No Tracks found',
 		noResultsAlbum: 'No Albums found',
 		noResultsArtist: 'No Artists found',
-		noResultsPlaylist: 'No Playlists found'
+		noResultsPlaylist: 'No Playlists found',
+		error: 'An error occurred, please try again later.'
 	},
 	searchbar: 'Search anything you want (or just paste a link)',
 	downloads: 'downloads',
diff --git a/src/lang/it.mjs b/src/lang/it.mjs
index 13f16d4..21e1bdf 100644
--- a/src/lang/it.mjs
+++ b/src/lang/it.mjs
@@ -189,7 +189,8 @@ const it = {
 		noResultsTrack: 'Nessun brano trovato',
 		noResultsAlbum: 'Nessun album trovato',
 		noResultsArtist: 'Nessun artista trovato',
-		noResultsPlaylist: 'Nessuna playlist trovata'
+		noResultsPlaylist: 'Nessuna playlist trovata',
+		error: 'Si è verificato un errore, riprova più tardi.'
 	},
 	searchbar: 'Cerca qualsiasi cosa (o incolla semplicemente un link)',
 	downloads: 'download',