Fix: Remove Empty Anchor Link in Jump-To Menu on Reference Pages

[reshma045]

Summary
This PR resolves the accessibility issue reported in #881 by removing an empty link in the jump-to navigation on reference pages like /reference/p5.sound/. The issue was caused by a JumpToLink with no label, resulting in a screen reader announcing only “link” with no context.

Issue: Closes #881

What Was Changed

Modified ReferenceLayout.astro to:

• Filter out jump-to links that have no label (undefined) when categoryData.length === 1.
• This situation occurs on reference pages that only contain a single category (like p5.sound), where the first subcategory has no name, resulting in a duplicate unnamed link.
• Also included a fallback label ("Details") from UI translations to ensure accessibility compliance for any remaining edge cases.

How to Test

• Go to /reference/p5.sound/
• Open the jump-to menu or inspect the headings/links with a screen reader.
• No unnamed or empty links should appear in the navigation.

[coseeian]

Could you please describe the purpose of the fixed “Details” link? Is it intended to navigate to another resource? When I click it, nothing happens.

[reshma045]

The "Details" label is a fallback that only appears if a jump-to link’s label is undefined, which shouldn't happen under normal circumstances due to the filtering I added. It's there purely for accessibility compliance to ensure that no empty link is ever rendered, in case any edge cases are missed.
In this specific fix, when categoryData.length === 1, the first unnamed subcategory link (which previously caused the empty link) is now filtered out. So the "Details" fallback should not be visible in typical usage. If it's still appearing and doesn't link to a valid section, I will investigate further and improve the logic to avoid rendering it altogether. Please let me know if you’d prefer I remove the fallback label completely instead of showing a generic one.

[coseeian]

When I press Shift+Tab on the "p5.Amplitude" link, I see a "Details" link (Details). However, clicking this link does not navigate to any section.

[reshma045]

Thanks! The fallback "Details" label was being rendered even though it didn’t link to a valid section. I’ve now updated the logic to completely skip all links with undefined labels, removing the fallback entirely. This should prevent any non-functional links like "Details" from appearing.

[coseeian]

There is no longer a "Details" link element, but a new issue has appeared: now, when tabbing, the focus lands on the entire navigation container. You need to press Tab again to move into the actual navigation content. When the focus is on the navigation container, the screen reader announces all the content within the container at once.
I suggest removing this focusable container to improve the user experience.

[reshma045]

Hey @coseeian, Sorry for the delay. I took some time to properly check the issue and make sure I was fixing it the right way. I've now updated the code so that links with undefined labels are completely skipped, without falling back to the "Details" label. This makes sure there are no non-functional or confusing links in the jump-to menu anymore. Please check and let me know if there's anything else. Thanks!

[reshma045]

Hi @ksen0 @coseeian, can you please review my PR now? Thanks

[coseeian]

I have reviewed this PR and all the issues mentioned have been addressed. I think it’s OK.