Previously on The V3 Saga
The View Transition had struck back. Crossfade won. The Architecture had awakened from a 1000-line slumber. The Reptile Brain had dreamed away complexity in the dark hours.
But in the sidebar, a new pattern was emerging. One that would make the Lizard Brain smile.
The Breadcrumb Problem
23:00 — The sidebar needed navigation. Not just “back,” but “where am I?” Breadcrumbs. The Squirrel suggested signals.
“Signals for breadcrumbs?” The Lizard Brain’s eye twitched.
“Each level pushes to a signal array! Pop on back! Persist in localStorage!”
“Or,” said the Lizard Brain, “we read the URL.”
Silence.
“The URL already knows where we are. /tab/123/stores/store-postgres?mode=edit. Parse it. Build breadcrumbs. Done.”
The Squirrel protested: “But what about—”
“The URL is the source of truth. It always was.”
The Sidebar Awakens
23:30 — A package emerges. ui/sidebar/. Two files:
sidebar.go — URL parser, builds Config from request
sidebar.templ — Renders breadcrumb, content, footer
The URL speaks:
/stores→ List mode, “New” button/stores/store-postgres→ View mode, “Edit” button/stores/store-postgres?mode=edit→ Edit mode, “Save” button
No signals. No state. Just URL → Config → Render.
func ParseRequest(r *http.Request) Config {
// URL is truth. Parse it. Return config.
}
The Squirrel: “But what about the breadcrumb display? Icons? Text?”
The Icon Revelation
00:30 — A design crystallizes:
- Icons for nouns (resources): 📀 database, 🔑 key
- Icons for verbs (actions): 👁️ view, ✏️ edit, ➕ new, 🖱️ pick
- Parent levels: just icons (clickable)
- Current level: action icon + text
[📀 Stores] › [✏️] store-postgres
↑ ↑ ↑
domain action object
No redundancy. The domain icon doesn’t repeat—it’s visible in the parent. The action icon tells you what you’re doing. The text tells you to what.
The Lizard Brain nods. “Clean.”
The Wicked Idea
01:30 — The picker URLs were ugly:
/credentials/pick?putURL=/tab/123/stores/store-postgres/credential
Query param soup. URL-encoded paths inside query params. The Squirrel suggested base64.
“No,” said the developer. And then, wickedly: “What if…”
/tab/123/stores/store-postgres/credentials/pick
The path IS the context. The credentials domain registers the route:
mux.HandleFunc("GET /tab/{tabID}/{domain}/{resourceID}/credentials/pick", h.Pick)
The handler reads path values. Knows where it came from. Knows where to return. No query params needed.
“But complex nested forms—” the Squirrel began.
“Not every wicked idea works,” the developer admitted. “But this one’s close.”
The Smarter Idea
02:30 — If wicked won’t work universally, make it smart:
type NavContext struct {
TabID string
Domain string
ResourceID string
Action string
Field string
Crumbs []Crumb
}
Middleware parses URL once. Puts NavContext in request context. Everything reads from it.
func NavMiddleware(next http.Handler) http.Handler {
return http.HandlerFunc(func(w http.ResponseWriter, r *http.Request) {
nav := parseNavFromRequest(r)
ctx := context.WithValue(r.Context(), navKey, nav)
next.ServeHTTP(w, r.WithContext(ctx))
})
}
Templ reads context natively. No passing r *http.Request everywhere. No re-parsing URLs. Single source of truth, parsed once, available everywhere.
“Damn I’m smart,” said the developer.
The Lizard Brain didn’t disagree.
The 3AM Commit
02:59 — The sidebar works. Breadcrumbs display. Actions have icons. The store domain is refactored. The architecture holds.
[📀 Stores] › [✏️] store-postgres
A GitHub issue captures the NavContext middleware idea for tomorrow. Issue #156. When caffeine is available.
The commit lands:
feat(v3): Add sidebar package with URL-driven breadcrumb navigation
8 files changed, 648 insertions(+), 79 deletions(-)
The Tally
Time: ~4 hours (23:00 - 03:00)
Sidebar package: created
*Next episode: The NavContext Strikes Back — In which middleware awakens and typed params defeat query string chaos. After coffee.*
---
**See also:**
*The V3 Saga:*
- [The View Transition Strikes Back](/episode/the-view-transition-strikes-back) - The smooth animations that started it all
- [The Lizard Brain vs The Caffeinated Squirrel](/episode/the-lizard-brain-vs-the-caffeinated-squirrel) - Where "fuckit" became philosophy
*The Tech:*
- [CSS View Transitions Module Level 1](https://www.w3.org/TR/css-view-transitions-1/) - The W3C spec that makes the magic possible
- [Datastar View Transition API](https://data-star.dev/examples/view_transition_api) - `data-view-transition` and friends
Breadcrumb design: icons for context, verbs for action
Query param soup: eliminated (mostly)
Wicked ideas: 1 (partially viable)
Smart ideas: 1 (NavContext middleware)
GitHub issues created: 1 (#156)
Lizard Brain approval: granted
Sleep debt: accumulating
The Lessons
Lesson 1: The URL is the source of truth. Stop fighting it. Parse it once, use it everywhere.
Lesson 2: Icons can carry meaning. Nouns vs verbs. Parents vs current. No redundancy.
Lesson 3: Wicked ideas don’t always work universally. But they point toward smarter ideas.
Lesson 4: Middleware + context = clean architecture. Parse once, read many.
Lesson 5: 3AM ideas should be documented in issues, not implemented in production.
The Moral
The URL was always the truth. The signals were a distraction. The breadcrumb was hiding in the path all along.
Sometimes the simplest source of truth is the one staring at you from the address bar.
🦎
Next episode: The NavContext Strikes Back — In which middleware awakens and typed params defeat query string chaos. After coffee.