diff --git a/app/assets/javascripts/discourse/app/components/tag-heading.js b/app/assets/javascripts/discourse/app/components/tag-heading.js
deleted file mode 100644
index 0e6d50b17d4..00000000000
--- a/app/assets/javascripts/discourse/app/components/tag-heading.js
+++ /dev/null
@@ -1,4 +0,0 @@
-import Component from "@ember/component";
-export default Component.extend({
- tagName: "",
-});
diff --git a/app/assets/javascripts/discourse/app/templates/components/bread-crumbs.hbs b/app/assets/javascripts/discourse/app/templates/components/bread-crumbs.hbs
index 7647cc6ca7f..8236b9448a7 100644
--- a/app/assets/javascripts/discourse/app/templates/components/bread-crumbs.hbs
+++ b/app/assets/javascripts/discourse/app/templates/components/bread-crumbs.hbs
@@ -15,12 +15,24 @@
{{/each}}
{{#if siteSettings.tagging_enabled}}
- {{#unless additionalTags}}
- {{!-- the tag filter doesn't work with tag intersections, so hide it --}}
- {{#if siteSettings.show_filter_by_tag}}
- {{tag-drop currentCategory=category noSubcategories=noSubcategories tagId=tag.id}}
+ {{#if siteSettings.show_filter_by_tag}}
+ {{#if additionalTags}}
+ {{tags-intersection-chooser
+ currentCategory=category
+ mainTag=tag.id
+ additionalTags=additionalTags
+ options=(hash
+ categoryId=category.id
+ )
+ }}
+ {{else}}
+ {{tag-drop
+ currentCategory=category
+ noSubcategories=noSubcategories
+ tagId=tag.id
+ }}
{{/if}}
- {{/unless}}
+ {{/if}}
{{/if}}
{{plugin-outlet name="bread-crumbs-right" connectorTagName="li" tagName=""}}
diff --git a/app/assets/javascripts/discourse/app/templates/components/tag-heading.hbs b/app/assets/javascripts/discourse/app/templates/components/tag-heading.hbs
deleted file mode 100644
index ec791283cc4..00000000000
--- a/app/assets/javascripts/discourse/app/templates/components/tag-heading.hbs
+++ /dev/null
@@ -1,11 +0,0 @@
-
- {{#link-to "tags"}}
- {{i18n "tagging.tags"}}
- {{/link-to}}
- {{d-icon "angle-right"}}
- {{discourse-tag-bound tagRecord=tag style="simple"}}
- {{#each additionalTags as |tag|}}
- &
- {{discourse-tag tag style="simple"}}
- {{/each}}
-
\ No newline at end of file
diff --git a/app/assets/javascripts/discourse/app/templates/tags/show.hbs b/app/assets/javascripts/discourse/app/templates/tags/show.hbs
index dbb03bbb563..d8f2fc07427 100644
--- a/app/assets/javascripts/discourse/app/templates/tags/show.hbs
+++ b/app/assets/javascripts/discourse/app/templates/tags/show.hbs
@@ -7,15 +7,6 @@
- {{#if showTagFilter}}
- {{#if additionalTags}}
- {{!-- Tag intersections don't work with the tag filter, so show the tag heading instead --}}
- {{tag-heading tag=tag additionalTags=additionalTags}}
- {{/if}}
- {{else}}
- {{tag-heading tag=tag additionalTags=additionalTags}}
- {{/if}}
-
{{d-navigation
filterMode=filterMode
canCreateTopic=canCreateTopic
diff --git a/app/assets/javascripts/select-kit/addon/components/tags-intersection-chooser.js b/app/assets/javascripts/select-kit/addon/components/tags-intersection-chooser.js
new file mode 100644
index 00000000000..78718bd244f
--- /dev/null
+++ b/app/assets/javascripts/select-kit/addon/components/tags-intersection-chooser.js
@@ -0,0 +1,43 @@
+import DiscourseURL from "discourse/lib/url";
+import MiniTagChooser from "select-kit/components/mini-tag-chooser";
+import { makeArray } from "discourse-common/lib/helpers";
+import { action } from "@ember/object";
+
+export default MiniTagChooser.extend({
+ pluginApiIdentifiers: ["tags-intersection-chooser"],
+ attributeBindings: ["selectKit.options.categoryId:category-id"],
+ classNames: ["tags-intersection-chooser"],
+
+ mainTag: null,
+ additionalTags: null,
+
+ didReceiveAttrs() {
+ this._super(...arguments);
+
+ this.set(
+ "value",
+ makeArray(this.mainTag).concat(makeArray(this.additionalTags))
+ );
+ },
+
+ @action
+ onChange(tags) {
+ if (tags.includes(this.mainTag)) {
+ const remainingTags = tags.filter((t) => t !== this.mainTag);
+
+ if (remainingTags.length >= 1) {
+ DiscourseURL.routeTo(
+ `/tags/intersection/${this.mainTag}/${remainingTags.join("/")}`
+ );
+ } else {
+ DiscourseURL.routeTo("/tags");
+ }
+ } else {
+ if (tags.length >= 2) {
+ DiscourseURL.routeTo(`/tags/intersection/${tags.join("/")}`);
+ } else {
+ DiscourseURL.routeTo("/tags");
+ }
+ }
+ },
+});
diff --git a/app/assets/stylesheets/common/base/tagging.scss b/app/assets/stylesheets/common/base/tagging.scss
index 5bc74ea0c90..0383147d7f4 100644
--- a/app/assets/stylesheets/common/base/tagging.scss
+++ b/app/assets/stylesheets/common/base/tagging.scss
@@ -31,20 +31,6 @@
}
}
-.tag-show-heading {
- display: inline-flex;
- flex-wrap: wrap;
- align-items: center;
- white-space: nowrap;
- overflow: hidden;
- text-overflow: hidden;
- width: 100%;
- .d-icon,
- span {
- margin: 0 0.25em;
- }
-}
-
.topic-category {
display: flex;
flex-wrap: wrap;
@@ -315,3 +301,9 @@ section.tag-info {
}
}
}
+
+.tag-navigation {
+ .mini-tag-chooser.tags-intersection-chooser {
+ margin: 0 0.5em 0 0;
+ }
+}