fix library sidebar: hide col: metadata tags, add sticky scroll
Some checks failed
ci/woodpecker/push/deploy Pipeline failed
ci/woodpecker/push/infra-ci Pipeline was successful
coverage 99% coverage
ci/woodpecker/push/ci Pipeline was successful

Two issues making year/sup/source tags at the bottom unusable:

1. col: namespace rendered 138 column-metadata buttons (62% of all
   tags) with 65-char labels, pushing useful tags below the fold.
   These are internal column documentation, not browsing categories.
   Now filtered out of the sidebar tag list.

2. Sidebar had no overflow scroll or sticky positioning. Tags below
   the viewport were unreachable. Now sticky with overflow-y: auto.

Sidebar now shows 85 tags (was 223), all reachable via scroll.

refs #71
This commit is contained in:
kert
2026-03-21 16:11:49 -04:00
parent f6c078c9fb
commit 21a6035bf3

View File

@@ -155,6 +155,8 @@ export default function Library(): JSX.Element {
const counts: Record<string, number> = {}; const counts: Record<string, number> = {};
for (const item of pool) { for (const item of pool) {
for (const t of item.tags) { for (const t of item.tags) {
// Skip col: tags — column metadata, not useful for browsing
if (t.startsWith("col:")) continue;
counts[t] = (counts[t] || 0) + 1; counts[t] = (counts[t] || 0) + 1;
} }
} }
@@ -202,7 +204,7 @@ export default function Library(): JSX.Element {
}} }}
> >
{/* Sidebar */} {/* Sidebar */}
<aside style={{ minWidth: 220, maxWidth: 260, flexShrink: 0 }}> <aside style={{ minWidth: 220, maxWidth: 260, flexShrink: 0, maxHeight: "calc(100vh - 100px)", overflowY: "auto", position: "sticky", top: 80 }}>
<h3>Collections</h3> <h3>Collections</h3>
<ul style={{ listStyle: "none", padding: 0, fontSize: "0.85rem" }}> <ul style={{ listStyle: "none", padding: 0, fontSize: "0.85rem" }}>
<li> <li>