Skip to content

Conversation

@lisbet-alvarez
Copy link
Collaborator

@lisbet-alvarez lisbet-alvarez commented Oct 17, 2025

Description

Refactor admin & desktop UIs to use hds app side nav and app header components. This PR also removes components + styles that are no longer needed as a result of the refactor.

Screenshots (if appropriate)

How to Test

  1. Please run a11y tests for both light and dark mode locally and verify everything passes. The only tests that currently fail are existing ones with missing ember-a11y-ignores (handled in a separate PR).
  2. Run e2e tests locally and verify nothing is failing. In CI desktop e2e tests are failing due to changes to admin ui, but should pass once this PR is merged in. Only one flaky admin ui (CE) is failing (unrelated to this PR).

Checklist

  • I have added before and after screenshots for UI changes
  • I have added JSON response output for API changes
  • I have added steps to reproduce and test for bug fixes in the description
  • I have commented on my code, particularly in hard-to-understand areas
  • My changes generate no new warnings
  • I have added tests that prove my fix is effective or that my feature works
  • I have added a11y-tests label to run a11y audit tests if needed

PCI review checklist

  • I have documented a clear reason for, and description of, the change I am making.
  • If applicable, I've documented a plan to revert these changes if they require more than reverting the pull request.
  • If applicable, I've documented the impact of any changes to security controls.
    Examples of changes to security controls include using new access control methods, adding or removing logging pipelines, etc.

@vercel
Copy link

vercel bot commented Oct 17, 2025

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Actions Updated (UTC)
boundary-ui Ready Ready Preview, Comment Feb 10, 2026 10:51pm
boundary-ui-desktop Ready Ready Preview, Comment Feb 10, 2026 10:51pm

Request Review

@lisbet-alvarez lisbet-alvarez changed the title POC: Refactor hds side nav to hds app side nav and header Refactor hds side nav to hds app side nav and header Feb 3, 2026
--token-color-palette-neutral-100
); /* the toggle has a different base surface color, compared to the other controls */

// Hds app side nav color-mappings
Copy link
Collaborator Author

Choose a reason for hiding this comment

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

These mappings are for dark mode and since there is no specific guideline for the side nav in dark mode, I tried to match the colors to the deprecated Hds::SideNav.

color: var(--token-color-palette-neutral-300);
}

.hds-app-side-nav__list-item-link.active {
Copy link
Collaborator Author

Choose a reason for hiding this comment

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

when a side nav list item is active in light mode its a dark blue color but there are color contrast a11y violations if same color is used in dark mode. So used a blue color token that has good contrast.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants