[api-extractor] Navbar options (API, GitHub, Help) do not show active navigation state

Open
#296 8 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

Assessment

Difficulty
2/5
Estimated time
1-3 hours
Newbie friendliness
38/100
Issue type
Bug
Clarity
Mostly clear
Activity status
Stale
Tech stack
typescript
Domain
documentation, frontend

Research direction

Start by reproducing the navbar behavior on the API Extractor documentation site at https://api-extractor.com/ and inspect the navbar's active-route handling. The work is done when API, GitHub, and Help each visibly indicate the current navigation state after navigation.

Written by the indexing model from the issue text.

Description

Summary

While browsing the API Extractor documentation site, I observed that certain navbar options (API, GitHub, and Help) do not visually reflect the active navigation state. After navigating to these sections, the navbar does not highlight or otherwise indicate the currently selected item, making it unclear which section is active.

Repro steps

  1. Open the API Extractor documentation site : https://api-extractor.com/
  2. Click on navbar options such as API, GitHub, or Help.
  3. Observe the navbar state after navigation. They do not displaying blue coloured activation state.

Expected result:

  • The currently selected navbar option should be visually highlighted or marked as active.

Actual result:

  • The navbar does not show any active state for API, GitHub, or Help options.

Details

This appears to be a UI/navigation state issue where certain navbar links are not included in the active-route detection logic. These links may be external routes or handled differently, so the active class/state is not being applied.

Screenshots

API route displaying docs option active
Image
Github route displaying docs option active
Image
Help route displaying docs option active
Image
A possible fix could involve:
  • Ensuring these routes are included in the active route matching logic.
  • Applying consistent active state handling for both internal and external navigation items.
Dominant language
TypeScript
Stars
39
Forks
86
Avg merge
1d 14h
Merged PRs (30d)
2

Contributor guide

No contributing guide indexed for this repository

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

More from microsoft/rushstack-websites

All issues in microsoft/rushstack-websites

Similar issues

More TypeScript issues

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.