search fetch error message, just to close the issue

src/components/search.js

@@ -36,7 +36,12 @@ AFRAME.registerComponent('search', {
     this.queryObject.query = query;
     algolia.search(this.queryObject, (err, content) => {
       // Cache popular hits.
-      if (err) { console.error(err); }
+      if (err) {
+        this.el.sceneEl.emit('searcherror', null, false);
+        console.error(err);
+        return;
+      }
+
       if (!query) { this.popularHits = content.hits; }
       this.eventDetail.results = content.hits;
       this.el.sceneEl.emit('searchresults', this.eventDetail);

src/state/index.js

@@ -84,6 +84,7 @@ AFRAME.registerState({
     search: {
       active: true,
       page: 0,
+      hasError: false,
       hasNext: false,
       hasPrev: false,
       results: [],
@@ -288,6 +289,10 @@ AFRAME.registerState({
       state.isSongLoading = true;
     },
 
+    searcherror: (state, payload) => {
+      state.search.hasError = true;
+    },
+
     searchprevpage: function (state) {
       if (state.search.page === 0) { return; }
       state.search.page--;
@@ -307,6 +312,7 @@ AFRAME.registerState({
      */
     searchresults: (state, payload) => {
       var i;
+      state.search.hasError = false;
       state.search.page = 0;
       state.search.results = payload.results;
       for (i = 0; i < payload.results.length; i++) {

src/templates/menu.html

@@ -229,6 +229,13 @@
       bind-toggle__raycastable="menuActive && !!menuSelectedChallenge.id"
       bind__visible="menuActive && !!menuSelectedChallenge.id"></a-plane>
   </a-entity>
+
+  <a-entity
+    id="searchError"
+    bind__visible="search.hasError"
+    mixin="textFont"
+    text="align: center; value: Sorry, there was an issue fetching search results. Please try again."
+    position="0 0 0.01"></a-entity>
 </a-entity>
 
 <a-entity