From af6c51f6f2962257c26ec72fd93759bee3562cac Mon Sep 17 00:00:00 2001
From: Michael Schnerring <3743342+schnerring@users.noreply.github.com>
Date: Fri, 15 Oct 2021 15:38:04 +0200
Subject: [PATCH] If flexsearch returns no results, display message

---
 assets/js/index.js                  |  9 +++++++++
 assets/scss/components/_search.scss | 11 ++++++++---
 2 files changed, 17 insertions(+), 3 deletions(-)

diff --git a/assets/js/index.js b/assets/js/index.js
index 7f4bfcc..24049b9 100644
--- a/assets/js/index.js
+++ b/assets/js/index.js
@@ -133,6 +133,15 @@ Source:
     suggestions.innerHTML = "";
     suggestions.classList.remove('d-none');
 
+    // inform user that no results were found
+    if (flatResults.size === 0) {
+      const noResultsMessage = document.createElement('div')
+      noResultsMessage.innerHTML = `No results for "<strong>${searchQuery}</strong>"`
+      noResultsMessage.classList.add("suggestion__no-results");
+      suggestions.appendChild(noResultsMessage);
+      return;
+    }
+
     // construct a list of suggestions
     for(const [href, doc] of flatResults) {
         const entry = document.createElement('div');
diff --git a/assets/scss/components/_search.scss b/assets/scss/components/_search.scss
index 7395004..45ec2af 100644
--- a/assets/scss/components/_search.scss
+++ b/assets/scss/components/_search.scss
@@ -10,11 +10,15 @@
   z-index: $zindex-dropdown;
 }
 
+#suggestions a,
+.suggestion__no-results {
+  padding: 0.75rem;
+  margin: 0 0.5rem;
+}
+
 #suggestions a {
   display: block;
   text-decoration: none;
-  padding: 0.75rem;
-  margin: 0 0.5rem;
 }
 
 #suggestions a:focus {
@@ -48,7 +52,8 @@
   color: $black;
 }
 
-.suggestion__description {
+.suggestion__description,
+.suggestion__no-results {
   color: $gray-700;
 }