From be9cbc4da4d4e193b297b48a29a53551017e3cc6 Mon Sep 17 00:00:00 2001
From: Benny Samir Hierl <bennysamir@posteo.de>
Date: Sat, 12 Feb 2022 22:36:39 +0100
Subject: [PATCH] fallback text for no wishlist

Signed-off-by: Benny Samir Hierl <bennysamir@posteo.de>
---
 src/config/locales/de-DE.json |  7 +++++++
 src/config/locales/en-US.json |  7 +++++++
 src/views/HomeView.vue        | 12 +++++++++++-
 3 files changed, 25 insertions(+), 1 deletion(-)

diff --git a/src/config/locales/de-DE.json b/src/config/locales/de-DE.json
index 4aa5dee..86c34e7 100644
--- a/src/config/locales/de-DE.json
+++ b/src/config/locales/de-DE.json
@@ -32,6 +32,13 @@
         }
       }
     },
+    "home-view": {
+      "main": {
+        "empty-list": {
+          "text": "Keine Wunschlisten verfügbar."
+        }
+      }
+    },
     "detail-view": {
       "main": {
         "empty-list": {
diff --git a/src/config/locales/en-US.json b/src/config/locales/en-US.json
index 5c6c836..65029b2 100644
--- a/src/config/locales/en-US.json
+++ b/src/config/locales/en-US.json
@@ -32,6 +32,13 @@
         }
       }
     },
+    "home-view": {
+      "main": {
+        "empty-list": {
+          "text": "No wishlists available."
+        }
+      }
+    },
     "detail-view": {
       "main": {
         "empty-list": {
diff --git a/src/views/HomeView.vue b/src/views/HomeView.vue
index e2cdde1..8822499 100644
--- a/src/views/HomeView.vue
+++ b/src/views/HomeView.vue
@@ -12,7 +12,10 @@ await fetch()
   <h1 class="text-semibold text-center text-3xl">
     {{ t('common.app-title.text') }}
   </h1>
-  <div v-if="wishlists" class="flex flex-row flex-wrap justify-around p-10">
+  <div
+    v-if="wishlists.length > 0"
+    class="flex flex-row flex-wrap justify-around p-10"
+  >
     <router-link
       v-for="(item, index) in wishlists"
       :key="index"
@@ -21,4 +24,11 @@ await fetch()
       <ImageTile :title="item.title" :image-src="item.imageSrc" class="m-4" />
     </router-link>
   </div>
+  <div v-else class="flex h-1/2 w-full justify-center">
+    <div
+      class="flex flex-col flex-wrap items-center justify-center text-center text-xl text-gray-600/75 dark:text-white/70 sm:flex-row sm:space-x-2 sm:text-left"
+    >
+      <span>{{ t('pages.home-view.main.empty-list.text') }}</span>
+    </div>
+  </div>
 </template>