No matching Guilds/Challenges message (#10744)

* Display message on My Guilds page when filters dont' match anything

* Display message on Discover Guilds page when filters dont' match anything

* Display message on My Challenges page when filters dont' match anything

* Display message on Discover Challenges page when filters dont' match anything

* Don't show Load More button when there is nothing to load

* Fix Guild search

Previously was not possible to clear after searching

website/client/components/challenges/findChallenges.vue

@@ -14,11 +14,17 @@
         button.btn.btn-secondary.create-challenge-button.float-right(@click='createChallenge()')
           .svg-icon.positive-icon(v-html="icons.positiveIcon")
           span(v-once) {{$t('createChallenge')}}
+
+    .row
+      .no-challenges.text-center.col-md-6.offset-3(v-if='!loading && filteredChallenges.length === 0')
+        h2(v-once) {{$t('noChallengeMatchFilters')}}
+
     .row
       .col-12.col-md-6(v-for='challenge in filteredChallenges')
         challenge-item(:challenge='challenge')
+
     .row
-      .col-12.text-center
+      .col-12.text-center(v-if='!loading && filteredChallenges.length > 0')
         button.btn.btn-secondary(@click='loadMore()') {{ $t('loadMore') }}
 </template>
 
@@ -41,6 +47,15 @@
       margin-right: .5em;
     }
   }
+
+  .no-challenges {
+    color: $gray-200;
+    margin-top: 10em;
+
+    h2 {
+      color: $gray-200;
+    }
+  }
 </style>
 
 <script>

website/client/components/challenges/myChallenges.vue

@@ -23,6 +23,10 @@
         p(v-once) {{$t('challengeDescription1')}}
         p(v-once) {{$t('challengeDescription2')}}
 
+    .row
+      .no-challenges.text-center.col-md-6.offset-3(v-if='!loading && challenges.length > 0 && filteredChallenges.length === 0')
+        h2(v-once) {{$t('noChallengeMatchFilters')}}
+
     .row
       .col-12.col-md-6(v-for='challenge in filteredChallenges')
         challenge-item(:challenge='challenge')

website/client/components/groups/discovery.vue

@@ -14,6 +14,11 @@
         button.btn.btn-secondary.create-group-button.float-right(@click='createGroup()')
           .svg-icon.positive-icon(v-html="icons.positiveIcon")
           span(v-once) {{$t('createGuild2')}}
+
+    .row
+      .no-guilds.text-center.col-md-6.offset-md-3(v-if='!loading && filteredGuilds.length === 0')
+        h2(v-once) {{$t('noGuildsMatchFilters')}}
+
     .row
       .col-md-12
         public-guild-item(v-for="guild in filteredGuilds", :key='guild._id', :guild="guild", :display-leave='true')
@@ -39,6 +44,15 @@
     display: inline-block;
     margin-right: .5em;
   }
+
+  .no-guilds {
+    color: $gray-200;
+    margin-top: 10em;
+
+    h2 {
+      color: $gray-200;
+    }
+  }
 </style>
 
 <script>

website/client/components/groups/myGuilds.vue

@@ -23,6 +23,10 @@
         p(v-once) {{$t('noGuildsParagraph1')}}
         p(v-once) {{$t('noGuildsParagraph2')}}
 
+    .row
+      .no-guilds.text-center.col-md-6.offset-md-3(v-if='!loading && guilds.length > 0 && filteredGuilds.length === 0')
+        h2(v-once) {{$t('noGuildsMatchFilters')}}
+
     .row
       .col-md-12
         public-guild-item(v-for="guild in filteredGuilds", :key='guild._id', :guild="guild", :display-gem-bank='true')

website/client/components/groups/sidebar.vue

@@ -139,8 +139,6 @@ export default {
       this.emitFilters();
     },
     searchTerm: throttle(function searchTerm (newSearch) {
-      if (newSearch.length <= 1) return; // @TODO: eh, should we limit based on length?
-
       this.$emit('search', {
         searchTerm: newSearch,
       });

website/common/locales/en/challenge.json

@@ -100,6 +100,7 @@
   "noChallengeTitle": "You don't have any Challenges.",
   "challengeDescription1": "Challenges are community events in which players compete and earn prizes by completing a group of related tasks.",
   "challengeDescription2": "Find recommended Challenges based on your interests, browse Habitica's public Challenges, or create your own Challenges.",
+  "noChallengeMatchFilters": "We couldn't find any matching Challenges.",
   "createdBy": "Created By",
   "joinChallenge": "Join Challenge",
   "leaveChallenge": "Leave Challenge",

website/common/locales/en/groups.json

@@ -397,6 +397,7 @@
   "noGuildsTitle": "You aren't a member of any Guilds.",
   "noGuildsParagraph1": "Guilds are social groups created by other players that can offer you support,  accountability, and encouraging chat.",
   "noGuildsParagraph2": "Click the Discover tab to see recommended Guilds based on your interests, browse Habitica's public Guilds, or create your own Guild.",
+  "noGuildsMatchFilters": "We couldn't find any matching Guilds.",
   "privateDescription": "A private Guild will not be displayed in Habitica's Guild directory. New members can be added by invitation only.",
   "removeInvite": "Remove Invitation",
   "removeMember": "Remove Member",