From 8cc6115805ff3b387f24a098b86ff7e7c56a5799 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Bar=C4=B1=C5=9F=20Soner=20U=C5=9Fakl=C4=B1?=
 <baris@nodebb.org>
Date: Mon, 18 Jun 2018 14:03:45 -0400
Subject: [PATCH] https://github.com/NodeBB/NodeBB/issues/6579

---
 templates/popular.tpl | 48 ++++++++++++++++++++++++++++++++++++++-----
 templates/recent.tpl  |  8 ++++----
 templates/top.tpl     | 23 ++++++++++++++-------
 templates/unread.tpl  |  6 +++---
 4 files changed, 66 insertions(+), 19 deletions(-)

diff --git a/templates/popular.tpl b/templates/popular.tpl
index 6a64555..fae8b86 100644
--- a/templates/popular.tpl
+++ b/templates/popular.tpl
@@ -13,11 +13,49 @@
 			<a component="category/post/guest" href="{config.relative_path}/login" class="btn btn-primary">[[category:guest-login-post]]</a>
 			<!-- ENDIF loggedIn -->
 		</div>
-		<ul class="nav nav-pills pull-right" component="popular/tab">
-			<li><a href='{config.relative_path}/popular/daily'>[[recent:day]]</a></li>
-			<li><a href='{config.relative_path}/popular/weekly'>[[recent:week]]</a></li>
-			<li><a href='{config.relative_path}/popular/monthly'>[[recent:month]]</a></li>
-		</ul>
+
+		<div component="category/dropdown" class="btn-group pull-right category-dropdown-container <!-- IF !categories.length -->hidden<!-- ENDIF !categories.length -->">
+			<button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">
+				<!-- IF selectedCategory --><!-- IF selectedCategory.icon --><span class="fa-stack"><i style="color: {selectedCategory.bgColor};" class="fa fa-circle fa-stack-2x"></i><i class="fa fa-fw fa-stack-1x {selectedCategory.icon}" style="color: {selectedCategory.color};"></i></span><!-- ENDIF selectedCategory.icon --> {selectedCategory.name}<!-- ELSE -->
+				[[unread:all_categories]]<!-- ENDIF selectedCategory --> <span class="caret"></span>
+			</button>
+			<ul component="category/list" class="dropdown-menu category-dropdown-menu" role="menu">
+				<li role="presentation" class="category">
+					<a role="menu-item" href="{config.relative_path}/{allCategoriesUrl}"><i class="fa fa-fw <!-- IF !selectedCategory -->fa-check<!-- ENDIF !selectedCategory -->"></i> [[unread:all_categories]]</a>
+				</li>
+				<!-- BEGIN categories -->
+				<li role="presentation" class="category" data-cid="{categories.cid}" data-parent-cid="{categories.parentCid}">
+					<a role="menu-item" href="#"><i component="category/select/icon" class="fa fa-fw <!-- IF categories.selected -->fa-check<!-- ENDIF categories.selected -->"></i>{categories.level}<!-- IF categories.icon --><span class="fa-stack"><i style="color: {categories.bgColor};" class="fa fa-circle fa-stack-2x"></i><i class="fa fa-fw fa-stack-1x {categories.icon}" style="color: {categories.color};"></i></span><!-- ENDIF categories.icon --> {categories.name}</a>
+				</li>
+				<!-- END categories -->
+			</ul>
+		</div>
+
+		<div class="btn-group pull-right <!-- IF !filters.length -->hidden<!-- ENDIF !filters.length -->">
+			<button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">
+			{selectedFilter.name} <span class="caret"></span>
+			</button>
+			<ul class="dropdown-menu" role="menu">
+				<!-- BEGIN filters -->
+				<li role="presentation" class="category">
+					<a role="menu-item" href="{config.relative_path}/{filters.url}"><i class="fa fa-fw <!-- IF filters.selected -->fa-check<!-- ENDIF filters.selected -->"></i>{filters.name}</a>
+				</li>
+				<!-- END filters -->
+			</ul>
+		</div>
+
+		<div class="btn-group pull-right <!-- IF !terms.length -->hidden<!-- ENDIF !terms.length -->">
+			<button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">
+			{selectedTerm.name} <span class="caret"></span>
+			</button>
+			<ul class="dropdown-menu" role="menu">
+				<!-- BEGIN terms -->
+				<li role="presentation" class="category">
+					<a role="menu-item" href="{config.relative_path}/{terms.url}"><i class="fa fa-fw <!-- IF terms.selected -->fa-check<!-- ENDIF terms.selected -->"></i>{terms.name}</a>
+				</li>
+				<!-- END terms -->
+			</ul>
+		</div>
 	</div>
 
 	<br />
diff --git a/templates/recent.tpl b/templates/recent.tpl
index 52c4c9b..83f1631 100644
--- a/templates/recent.tpl
+++ b/templates/recent.tpl
@@ -21,11 +21,11 @@
 			</button>
 			<ul component="category/list" class="dropdown-menu category-dropdown-menu" role="menu">
 				<li role="presentation" class="category">
-					<a role="menu-item" href="{config.relative_path}/{selectedFilter.url}"><i class="fa fa-fw <!-- IF !selectedCategory -->fa-check<!-- ENDIF !selectedCategory -->"></i> [[unread:all_categories]]</a>
+					<a role="menu-item" href="{config.relative_path}/{allCategoriesUrl}"><i class="fa fa-fw <!-- IF !selectedCategory -->fa-check<!-- ENDIF !selectedCategory -->"></i> [[unread:all_categories]]</a>
 				</li>
 				<!-- BEGIN categories -->
 				<li role="presentation" class="category" data-cid="{categories.cid}" data-parent-cid="{categories.parentCid}">
-					<a role="menu-item" href="{config.relative_path}/{selectedFilter.url}?cid={categories.cid}"><i component="category/select/icon" class="fa fa-fw <!-- IF categories.selected -->fa-check<!-- ENDIF categories.selected -->"></i>{categories.level}<!-- IF categories.icon --><span class="fa-stack"><i style="color: {categories.bgColor};" class="fa fa-circle fa-stack-2x"></i><i class="fa fa-fw fa-stack-1x {categories.icon}" style="color: {categories.color};"></i></span><!-- ENDIF categories.icon --> {categories.name}</a>
+					<a role="menu-item" href="#"><i component="category/select/icon" class="fa fa-fw <!-- IF categories.selected -->fa-check<!-- ENDIF categories.selected -->"></i>{categories.level}<!-- IF categories.icon --><span class="fa-stack"><i style="color: {categories.bgColor};" class="fa fa-circle fa-stack-2x"></i><i class="fa fa-fw fa-stack-1x {categories.icon}" style="color: {categories.color};"></i></span><!-- ENDIF categories.icon --> {categories.name}</a>
 				</li>
 				<!-- END categories -->
 			</ul>
@@ -38,7 +38,7 @@
 			<ul class="dropdown-menu" role="menu">
 				<!-- BEGIN filters -->
 				<li role="presentation" class="category">
-					<a role="menu-item" href="{config.relative_path}/{filters.url}{querystring}"><i class="fa fa-fw <!-- IF filters.selected -->fa-check<!-- ENDIF filters.selected -->"></i>{filters.name}</a>
+					<a role="menu-item" href="{config.relative_path}/{filters.url}"><i class="fa fa-fw <!-- IF filters.selected -->fa-check<!-- ENDIF filters.selected -->"></i>{filters.name}</a>
 				</li>
 				<!-- END filters -->
 			</ul>
@@ -52,7 +52,7 @@
 		<div class="alert alert-warning" id="category-no-topics">[[recent:no_recent_topics]]</div>
 		<!-- ENDIF !topics.length -->
 
-		<a href="{config.relative_path}/{selectedFilter.url}{querystring}">
+		<a href="{config.relative_path}/{selectedFilter.url}">
 			<div class="alert alert-warning hide" id="new-topics-alert"></div>
 		</a>
 
diff --git a/templates/top.tpl b/templates/top.tpl
index de4ca6e..2aad423 100644
--- a/templates/top.tpl
+++ b/templates/top.tpl
@@ -21,11 +21,11 @@
 			</button>
 			<ul component="category/list" class="dropdown-menu category-dropdown-menu" role="menu">
 				<li role="presentation" class="category">
-					<a role="menu-item" href="{config.relative_path}/{selectedFilter.url}"><i class="fa fa-fw <!-- IF !selectedCategory -->fa-check<!-- ENDIF !selectedCategory -->"></i> [[unread:all_categories]]</a>
+					<a role="menu-item" href="{config.relative_path}/{allCategoriesUrl}"><i class="fa fa-fw <!-- IF !selectedCategory -->fa-check<!-- ENDIF !selectedCategory -->"></i> [[unread:all_categories]]</a>
 				</li>
 				<!-- BEGIN categories -->
 				<li role="presentation" class="category" data-cid="{categories.cid}" data-parent-cid="{categories.parentCid}">
-					<a role="menu-item" href="{config.relative_path}/{selectedFilter.url}?cid={categories.cid}"><i component="category/select/icon" class="fa fa-fw <!-- IF categories.selected -->fa-check<!-- ENDIF categories.selected -->"></i>{categories.level}<!-- IF categories.icon --><span class="fa-stack"><i style="color: {categories.bgColor};" class="fa fa-circle fa-stack-2x"></i><i class="fa fa-fw fa-stack-1x {categories.icon}" style="color: {categories.color};"></i></span><!-- ENDIF categories.icon --> {categories.name}</a>
+					<a role="menu-item" href="#"><i component="category/select/icon" class="fa fa-fw <!-- IF categories.selected -->fa-check<!-- ENDIF categories.selected -->"></i>{categories.level}<!-- IF categories.icon --><span class="fa-stack"><i style="color: {categories.bgColor};" class="fa fa-circle fa-stack-2x"></i><i class="fa fa-fw fa-stack-1x {categories.icon}" style="color: {categories.color};"></i></span><!-- ENDIF categories.icon --> {categories.name}</a>
 				</li>
 				<!-- END categories -->
 			</ul>
@@ -38,11 +38,24 @@
 			<ul class="dropdown-menu" role="menu">
 				<!-- BEGIN filters -->
 				<li role="presentation" class="category">
-					<a role="menu-item" href="{config.relative_path}/{filters.url}{querystring}"><i class="fa fa-fw <!-- IF filters.selected -->fa-check<!-- ENDIF filters.selected -->"></i>{filters.name}</a>
+					<a role="menu-item" href="{config.relative_path}/{filters.url}"><i class="fa fa-fw <!-- IF filters.selected -->fa-check<!-- ENDIF filters.selected -->"></i>{filters.name}</a>
 				</li>
 				<!-- END filters -->
 			</ul>
 		</div>
+
+		<div class="btn-group pull-right <!-- IF !terms.length -->hidden<!-- ENDIF !terms.length -->">
+			<button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">
+			{selectedTerm.name} <span class="caret"></span>
+			</button>
+			<ul class="dropdown-menu" role="menu">
+				<!-- BEGIN terms -->
+				<li role="presentation" class="category">
+					<a role="menu-item" href="{config.relative_path}/{terms.url}"><i class="fa fa-fw <!-- IF terms.selected -->fa-check<!-- ENDIF terms.selected -->"></i>{terms.name}</a>
+				</li>
+				<!-- END terms -->
+			</ul>
+		</div>
 	</div>
 
 	<hr class="hidden-xs"/>
@@ -52,10 +65,6 @@
 		<div class="alert alert-warning" id="category-no-topics">[[top:no_top_topics]]</div>
 		<!-- ENDIF !topics.length -->
 
-		<a href="{config.relative_path}/{selectedFilter.url}{querystring}">
-			<div class="alert alert-warning hide" id="new-topics-alert"></div>
-		</a>
-
 		<!-- IMPORT partials/topics_list.tpl -->
 
 		<!-- IF config.usePagination -->
diff --git a/templates/unread.tpl b/templates/unread.tpl
index c03be21..01bc286 100644
--- a/templates/unread.tpl
+++ b/templates/unread.tpl
@@ -42,11 +42,11 @@
 			</button>
 			<ul component="category/list" class="dropdown-menu category-dropdown-menu" role="menu">
 				<li role="presentation" class="category">
-					<a role="menu-item" href="{config.relative_path}/{selectedFilter.url}"><i class="fa fa-fw <!-- IF !selectedCategory -->fa-check<!-- ENDIF !selectedCategory -->"></i> [[unread:all_categories]]</a>
+					<a role="menu-item" href="{config.relative_path}/{allCategoriesUrl}"><i class="fa fa-fw <!-- IF !selectedCategory -->fa-check<!-- ENDIF !selectedCategory -->"></i> [[unread:all_categories]]</a>
 				</li>
 				<!-- BEGIN categories -->
 				<li role="presentation" class="category" data-cid="{categories.cid}" data-parent-cid="{categories.parentCid}">
-					<a role="menu-item" href="{config.relative_path}/{selectedFilter.url}?cid={categories.cid}"><i component="category/select/icon" class="fa fa-fw <!-- IF categories.selected -->fa-check<!-- ENDIF categories.selected -->"></i>{categories.level}<!-- IF categories.icon --><span class="fa-stack"><i style="color: {categories.bgColor};" class="fa fa-circle fa-stack-2x"></i><i class="fa fa-fw fa-stack-1x {categories.icon}" style="color: {categories.color};"></i></span><!-- ENDIF categories.icon --> {categories.name}</a>
+					<a role="menu-item" href="#"><i component="category/select/icon" class="fa fa-fw <!-- IF categories.selected -->fa-check<!-- ENDIF categories.selected -->"></i>{categories.level}<!-- IF categories.icon --><span class="fa-stack"><i style="color: {categories.bgColor};" class="fa fa-circle fa-stack-2x"></i><i class="fa fa-fw fa-stack-1x {categories.icon}" style="color: {categories.color};"></i></span><!-- ENDIF categories.icon --> {categories.name}</a>
 				</li>
 				<!-- END categories -->
 			</ul>
@@ -59,7 +59,7 @@
 			<ul class="dropdown-menu" role="menu">
 				<!-- BEGIN filters -->
 				<li role="presentation" class="category">
-					<a role="menu-item" href="{config.relative_path}/{filters.url}{querystring}"><i class="fa fa-fw <!-- IF filters.selected -->fa-check<!-- ENDIF filters.selected -->"></i>{filters.name}</a>
+					<a role="menu-item" href="{config.relative_path}/{filters.url}"><i class="fa fa-fw <!-- IF filters.selected -->fa-check<!-- ENDIF filters.selected -->"></i>{filters.name}</a>
 				</li>
 				<!-- END filters -->
 			</ul>