From 77b1b70df5d88e1098a10cc23f3b8e9a33ab0efa Mon Sep 17 00:00:00 2001
From: Vinta Chen <vinta.chen@gmail.com>
Date: Sun, 27 Sep 2026 02:04:57 +0800
Subject: [PATCH] fix: hide use-case and page tags that repeat the group
 heading

On section and subcategory pages, every row repeated its use case and current page as tags (and as the label under the name on phones), right under a heading that already said the same thing. They are now hidden in editorial order and shown again when a column sort flattens the groups.

Co-Authored-By: Claude <noreply@anthropic.com>
---
 website/static/main.js          | 1 +
 website/static/style.css        | 5 +++++
 website/templates/category.html | 9 ++++++---
 website/tests/test_build.py     | 2 ++
 4 files changed, 14 insertions(+), 3 deletions(-)

diff --git a/website/static/main.js b/website/static/main.js
index 30871c9f..93eac711 100644
--- a/website/static/main.js
+++ b/website/static/main.js
@@ -288,6 +288,7 @@ function sortRows() {
 const sortHeaders = document.querySelectorAll("th[data-sort]");
 
 function updateSortIndicators() {
+  if (table) table.classList.toggle("sorted", activeSort.col !== "editorial");
   sortHeaders.forEach(function (th) {
     th.classList.remove("sort-asc", "sort-desc");
     if (th.dataset.sort === activeSort.col) {
diff --git a/website/static/style.css b/website/static/style.css
index 4e067c06..12ff6cdf 100644
--- a/website/static/style.css
+++ b/website/static/style.css
@@ -868,6 +868,11 @@ kbd {
   text-underline-offset: 0.2em;
 }
 
+/* main.js adds .sorted once a column sort flattens the groups */
+.table:not(.sorted) .repeats-heading {
+  display: none;
+}
+
 .group-count {
   font-family: var(--font-body);
   font-size: var(--text-sm);
diff --git a/website/templates/category.html b/website/templates/category.html
index 7528da00..e8d05860 100644
--- a/website/templates/category.html
+++ b/website/templates/category.html
@@ -76,6 +76,9 @@
 {% endblock %}
 {% block content %}
 {% macro entry_rows(entry, index) %}
+        {# On section and subcategory pages the group heading already names the row's use case #}
+        {% set grouped_page = entry_groups and not group_categories %}
+        {% set section_path = "/categories/" ~ parent_category.slug ~ "/" if parent_category else current_path %}
         <tr
           class="row"
           tabindex="0"
@@ -87,7 +90,7 @@
             <a href="{{ entry.url }}" target="_blank" rel="noopener"
               >{{ entry.name }}</a
             >
-            <span class="mobile-cat"
+            <span class="mobile-cat{% if grouped_page and (not entry.subcategories or category_urls[entry.subcategories[0].value.split(' > ')[0]] == section_path) %} repeats-heading{% endif %}"
               >{% if entry.subcategories %}{{ entry.subcategories[0].name }}{%
               else %}{{ category.name }}{% endif %}</span
             >
@@ -123,13 +126,13 @@
           </td>
           <td class="col-cat">
             {% for subcat in entry.subcategories %}
-            <a class="tag{% if subcat.url == current_path %} active{% endif %}" href="{{ category_urls[subcat.value.split(' > ')[0]] }}#{{ subcat.slug }}">
+            <a class="tag{% if subcat.url == current_path %} active{% endif %}{% if grouped_page and category_urls[subcat.value.split(' > ')[0]] == section_path %} repeats-heading{% endif %}" href="{{ category_urls[subcat.value.split(' > ')[0]] }}#{{ subcat.slug }}">
               {{ subcat.name }}
             </a>
             {% endfor %}
             {% for cat in entry.categories %}
             <a
-              class="tag{% if category_urls[cat] == current_path %} active{% endif %}"
+              class="tag{% if category_urls[cat] == current_path %} active{% endif %}{% if grouped_page and category_urls[cat] == current_path %} repeats-heading{% endif %}"
               href="{{ category_urls[cat] }}"
               >{{ cat }}</a
             >
diff --git a/website/tests/test_build.py b/website/tests/test_build.py
index a322f1c2..78495fa8 100644
--- a/website/tests/test_build.py
+++ b/website/tests/test_build.py
@@ -991,6 +991,7 @@ class TestBuild:
         assert positions == sorted(positions)
         assert '<a class="jump-link" href="#small">Small</a>' in html
         assert '<a href="/categories/widgets/small/">Small</a>' in html
+        assert '<a class="tag repeats-heading" href="/categories/widgets/#small">' in html
         assert '<tr class="desc-row">' in html
 
         subcategory_html = (site / "widgets" / "small" / "index.html").read_text(encoding="utf-8")
@@ -1033,6 +1034,7 @@ class TestBuild:
         dl_heading = html.index('<a href="/categories/deep-learning/">Deep Learning</a>')
         assert ml_heading < html.index(">ml1</a") < dl_heading < html.index(">dl1</a")
         assert html.count(">ml1</a") == 1
+        assert "repeats-heading" not in html
         assert 'class="jump-links"' not in html
 
     def test_build_rejects_redirect_to_missing_page(self, tmp_path):