diff --git a/app/assets/javascripts/discourse/controllers/tags-show.js.es6 b/app/assets/javascripts/discourse/controllers/tags-show.js.es6
index 2682cd23778..574c12b6075 100644
--- a/app/assets/javascripts/discourse/controllers/tags-show.js.es6
+++ b/app/assets/javascripts/discourse/controllers/tags-show.js.es6
@@ -7,40 +7,8 @@ import {
 } from "discourse-common/utils/decorators";
 import BulkTopicSelection from "discourse/mixins/bulk-topic-selection";
 import {
-  default as NavItem,
-  customNavItemHref
+  default as NavItem
 } from "discourse/models/nav-item";
-import Category from "discourse/models/category";
-import Site from "discourse/models/site";
-
-if (customNavItemHref) {
-  customNavItemHref(function(navItem) {
-    if (navItem.get("tagId")) {
-      const name = navItem.get("name");
-
-      if (!Site.currentProp("filters").includes(name)) {
-        return null;
-      }
-
-      let path = "/tags/";
-      const category = navItem.get("category");
-
-      if (category) {
-        path += "c/";
-        path += Category.slugFor(category);
-        if (navItem.get("noSubcategories")) {
-          path += "/none";
-        }
-        path += "/";
-      }
-
-      path += `${navItem.get("tagId")}/l/`;
-      return `${path}${name.replace(" ", "-")}`;
-    } else {
-      return null;
-    }
-  });
-}
 
 export default Controller.extend(BulkTopicSelection, {
   application: inject(),
diff --git a/app/assets/javascripts/discourse/models/nav-item.js.es6 b/app/assets/javascripts/discourse/models/nav-item.js.es6
index c2a6f5a84c0..ab415e030d6 100644
--- a/app/assets/javascripts/discourse/models/nav-item.js.es6
+++ b/app/assets/javascripts/discourse/models/nav-item.js.es6
@@ -33,8 +33,8 @@ const NavItem = EmberObject.extend({
     );
   },
 
-  @discourseComputed("filterMode")
-  href(filterMode) {
+  @discourseComputed("name", "category", "noSubcategories", "tagId")
+  href(filterMode, category, noSubcategories, tagId) {
     let customHref = null;
 
     NavItem.customNavItemHrefs.forEach(function(cb) {
@@ -48,7 +48,8 @@ const NavItem = EmberObject.extend({
       return customHref;
     }
 
-    return Discourse.getURL("/") + filterMode;
+    const context = { category, noSubcategories, tagId };
+    return NavItem.pathFor(filterMode, context);
   },
 
   @discourseComputed("name", "category", "noSubcategories")
@@ -99,6 +100,46 @@ NavItem.reopenClass({
   customNavItemHrefs: [],
   extraNavItemDescriptors: [],
 
+  pathFor(filterType, context) {
+    let path = Discourse.getURL("");
+    let includesCategoryContext = false;
+    let includesTagContext = false;
+
+    if (filterType === "categories") {
+      path += "/categories";
+      return path;
+    }
+
+    if (context.tagId && Site.currentProp("filters").includes(filterType)) {
+      includesTagContext = true;
+      path += "/tags";
+    }
+
+    if (context.category) {
+      includesCategoryContext = true;
+      path += `/c/${Category.slugFor(context.category)}`;
+
+      if (context.noSubcategories) {
+        path += "/none";
+      }
+    }
+
+    if (includesTagContext) {
+      path += `/${context.tagId}`;
+    }
+
+    if (includesTagContext || includesCategoryContext) {
+      path += "/l";
+    }
+
+    path += `/${filterType}`;
+
+    // In the case of top, the nav item doesn't include a period because the
+    // period has its own selector just below
+
+    return path;
+  },
+
   // Create a nav item given a filterType. It returns null if there is not
   // valid nav item. The name is a historical artifact.
   fromText(filterType, opts) {