feat/header-username - #129
Merged
Merged
Conversation
Authenticated users see Dashboard, Courses, and Log out, but nothing tells them which account they are acting as. The plan reuses the dashboard greeting pattern (sec:authentication) to show the escaped, CSS-truncated username in the header, with a visually hidden "Signed in as" prefix for screen readers. Refs #126
Nothing in the page chrome said which account the user was acting as: the header showed Dashboard, Courses, and Log out, and the username only appeared in the dashboard greeting, which matters when switching between student, instructor, and admin accounts. The authenticated nav now carries the username before the Log out control, reusing the dashboard's sec:authentication pattern, so it is escaped by the attribute processor. A visually hidden prefix makes screen readers announce "Signed in as [name]" while sighted users just see the muted name. The CSS truncates at 12rem with an ellipsis so a 50 character username (the schema cap) cannot distort the header. MockMvc asserts the item renders when authenticated and is absent for anonymous visitors. Fixes #126
…bile Review feedback on the first header username implementation (issue reopened): the username read as just another nav item, and the header broke on mobile, where the Log out button was pushed off-screen once logged in. Root cause: the nav list never wrapped (flex default), and the 12rem username item made the authenticated row overflow. The username and the Log out form move out of the nav into a site-header__account group behind a border divider, so assistive tech browsing the Main landmark only meets real links and the pair wraps as one unit on narrow viewports. The nav list now wraps (this also hardens the anonymous header), and the username width caps at 40vw under the 46rem breakpoint on top of the 12rem desktop cap. The plan document records the amendment, and the MockMvc assertions follow the new markup. Refs #126
Codecov Report✅ All modified and coverable lines are covered by tests. Additional details and impacted files@@ Coverage Diff @@
## dev #129 +/- ##
============================================
+ Coverage 81.59% 81.71% +0.11%
- Complexity 201 202 +1
============================================
Files 38 38
Lines 864 864
Branches 53 53
============================================
+ Hits 705 706 +1
+ Misses 125 124 -1
Partials 34 34 ☔ View full report in Codecov by Harness. 🚀 New features to boost your workflow:
|
4 tasks
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
This PR shows the signed-in username in the site header for authenticated users.
The username and
Log outform of the nav are moved into a separate account. This avoid treating the username as a nav item and to allow proper wrapping on mobile.Signed in asprefix from screen readers.Log outform intosite-headeraccount group with a divider to separate from the navigation.12rem,40vwunder46rem).