olli/olli.puhakka.dev
Watch
1
0
Fork
You've already forked olli.puhakka.dev
 0
Code Issues 5 Pull requests Projects Releases Packages 2 Wiki Activity Actions

Browse the glossary by topic and one term at a time #13

Merged
olli merged 3 commits from feat/glossary-browsing into dev 2026-10-15 01:44:40 +03:00
Conversation 0 Commits 3 Files changed 6 +329 -21
olli-agent commented 2026-10-15 01:43:28 +03:00
Collaborator
Copy link

Two ways to browse the glossary graph, picked from five local spikes (the other three, a neighbourhood diagram, a path finder and per-relation views, are parked), plus a fix found on the way.

Group two-way relations under one heading. A card grouped relations by direction, so a term on both ends of works-with edges listed "Works with" twice (ACME did).

Filter by topic. Terms already had tags; the page now shows them as a row of topic buttons with counts under the filters, and as buttons on each card. Topic names live in graph.json under a new top-level tags, in English and Finnish, and check-glossary.mjs fails on an unknown tag, a missing translation, or a name no term uses.

Focus on a term. A link to a term narrows the list to that term (first) and its neighbours, with a bar and a trail of visited terms. Search, kind, topic, "Show all" and Escape return to the full list; each adds a history entry, so Back returns to the focused term.

Checked: html-validate public/, node scripts/check-glossary.mjs, and headless Chromium at 1100px and 320px in light and dark, EN and FI, Back/Escape/keyboard flows, no console errors and no horizontal scroll at 320px.

Known trade-off: at 320px the topic row wraps to about 13 lines above the list.

Two ways to browse the glossary graph, picked from five local spikes (the other three, a neighbourhood diagram, a path finder and per-relation views, are parked), plus a fix found on the way. **Group two-way relations under one heading.** A card grouped relations by direction, so a term on both ends of `works-with` edges listed "Works with" twice (ACME did). **Filter by topic.** Terms already had `tags`; the page now shows them as a row of topic buttons with counts under the filters, and as buttons on each card. Topic names live in `graph.json` under a new top-level `tags`, in English and Finnish, and `check-glossary.mjs` fails on an unknown tag, a missing translation, or a name no term uses. **Focus on a term.** A link to a term narrows the list to that term (first) and its neighbours, with a bar and a trail of visited terms. Search, kind, topic, "Show all" and Escape return to the full list; each adds a history entry, so Back returns to the focused term. Checked: `html-validate public/`, `node scripts/check-glossary.mjs`, and headless Chromium at 1100px and 320px in light and dark, EN and FI, Back/Escape/keyboard flows, no console errors and no horizontal scroll at 320px. Known trade-off: at 320px the topic row wraps to about 13 lines above the list.
A symmetric edge is stored from one end, so a term can be the source
of some works-with edges and the target of others. The card grouped
relations by direction, and both directions of a symmetric type share
one heading, so ACME listed "Works with" twice. Symmetric types now
form a single group.
Every term already carries tags like identity or llm, but the page
never showed them, so the only ways in were a search word or a kind.
A row of topics with counts now sits under the filters, biggest first,
and each card shows its own topics as buttons that apply the filter.
A card's button moves keyboard focus up to the row, where the choice
can be undone.

The topic names live in graph.json next to the edge types, in English
and Finnish, so the data names its own topics. The check fails on a
tag without a name, a name in only one language, or a name no term
uses.
Focus the glossary on a term and its neighbours
All checks were successful
CI / lint (push) Successful in 3s
Details
CI / image (push) Successful in 4s
Details
CI / verify-staging (push) Successful in 20s
Details
2b430a4143 
Following a relation used to jump to a card somewhere in a list of two
hundred, so browsing the graph meant scrolling past everything
unrelated. A link to a term now narrows the list to that term, shown
first, and the terms it links to, with a bar that says so and a trail
of the last terms visited.

Search, a kind or topic, "Show all" and Escape all return to the full
list. Each adds a history entry, so Back returns to the focused term
instead of leaving the page, and after "Show all" keyboard focus stays
on that term's card.
olli merged commit 2b430a4143 into dev 2026-10-15 01:44:40 +03:00
olli deleted branch feat/glossary-browsing 2026-10-15 01:44:40 +03:00
Sign in to join this conversation.
Reviewers
No reviewers
Labels
Clear labels
No items
No labels
Milestone
Clear milestone
No items
No milestone
Projects
Clear projects
No items
No project
Assignees
Clear assignees
No assignees
1 participant
Notifications
Due date
The due date is invalid or out of range. Please use the format "yyyy-mm-dd".

No due date set.

Dependencies

No dependencies set

Reference
olli/olli.puhakka.dev!13
No description provided.