Skip to content

feat(v1): add SubNav breadcrumb component (Phase 1 - Foundation PR 3)#482

Open
vitorvasc wants to merge 5 commits into
open-telemetry:mainfrom
vitorvasc:feat/84-pr3-subnav
Open

feat(v1): add SubNav breadcrumb component (Phase 1 - Foundation PR 3)#482
vitorvasc wants to merge 5 commits into
open-telemetry:mainfrom
vitorvasc:feat/84-pr3-subnav

Conversation

@vitorvasc
Copy link
Copy Markdown
Member

First foundation primitive after the v1 router scaffold (#470). SubNav is the breadcrumb row that sits beneath the navbar on every inner page.

Contributes to #84 and #370.

What's in this PR

  • New <SubNav crumbs={...} actions={...} /> at src/v1/components/layout/sub-nav.tsx:
    • crumbs: BreadcrumbItem[] is required, actions?: ReactNode is an optional right-side slot for page-level controls
    • Last crumb renders as a non-link <span aria-current="page">. Earlier crumbs render as <Link> when href is set, otherwise as plain text
    • Returns null when both crumbs and actions are empty, so route layouts can mount it unconditionally (home passes nothing, inner pages pass their breadcrumb)
    • Lucide ChevronRight separator.
  • Scoped CSS partial at src/v1/styles/sub-nav.css uses the .td-subnav class. Selectors only match elements rendered by <V1App />, so it stays inert in the legacy bundle
  • src/v1/styles/index.css picks up one @import for the new partial plus a comment update
  • Not yet mounted on any route

What's not in this PR

  • Mounting SubNav on any route. Each page-level PR consumes it as it ships

Verification

  • bun run typecheck clean
  • bun run lint clean
  • bun run test src/v1/components/layout/sub-nav.test.tsx passes 5/5 (covers empty, crumbs-only, actions-only, crumbs+actions)
  • bun run test passes 842/842
  • bun run format no reformatting needed

Co-authored with Claude Opus 4.7.

Signed-off-by: Vitor Vasconcellos <vvasconcellos1@gmail.com>
@vitorvasc vitorvasc requested review from a team as code owners May 14, 2026 11:46
@netlify
Copy link
Copy Markdown

netlify Bot commented May 14, 2026

Deploy Preview for otel-ecosystem-explorer ready!

Name Link
🔨 Latest commit cf936b1
🔍 Latest deploy log https://app.netlify.com/projects/otel-ecosystem-explorer/deploys/6a0633a947868900081a3210
😎 Deploy Preview https://deploy-preview-482--otel-ecosystem-explorer.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify project configuration.

Copy link
Copy Markdown
Contributor

Copilot AI left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull request overview

Adds a new <SubNav> breadcrumb component to the v1 sub-app as a foundation primitive. It's not yet mounted on any route; later page-level PRs will consume it.

Changes:

  • New SubNav component with crumbs (required) and optional actions slot, returning null when both are empty.
  • New scoped sub-nav.css partial under .td-subnav, imported from src/v1/styles/index.css.
  • Vitest coverage for empty/crumbs-only/actions-only/combined render paths.

Reviewed changes

Copilot reviewed 4 out of 4 changed files in this pull request and generated no comments.

File Description
ecosystem-explorer/src/v1/components/layout/sub-nav.tsx New SubNav component with breadcrumb landmark and actions slot.
ecosystem-explorer/src/v1/components/layout/sub-nav.test.tsx Unit tests covering the four render permutations.
ecosystem-explorer/src/v1/styles/sub-nav.css Scoped .td-subnav styles for the row.
ecosystem-explorer/src/v1/styles/index.css Imports the new partial; updates header comment.

@vitorvasc vitorvasc mentioned this pull request May 14, 2026
10 tasks
Copy link
Copy Markdown
Contributor

Copilot AI left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull request overview

Copilot reviewed 4 out of 4 changed files in this pull request and generated no new comments.

@vitorvasc vitorvasc enabled auto-merge May 14, 2026 12:34
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants