Skip to content

Fix login UI issue#468

Merged
krusche merged 1 commit into
developfrom
bugfix/fix-login
May 29, 2025
Merged

Fix login UI issue#468
krusche merged 1 commit into
developfrom
bugfix/fix-login

Conversation

@jfr2102

@jfr2102 jfr2102 commented May 29, 2025

Copy link
Copy Markdown
Contributor

Context

the login screen is currently broken due to null checks for an undefined account.

Changes

  • fix the broken login page
  • improve accessibility allowing tabbing to the login link and adding keyup event

Testing

  • check that you can see the login link again and it works correctly
  • on e.g. chrome you should be able to tab to the login link and press enter to login also now

Screenshots

Before:
image

After:
image
image

<div class="alert alert-warning">
<span>You are not signed in. Click here to </span>
<a class="alert-link" (click)="login()" (keydown.enter)="login()" tabindex="0">sign in</a>
<a class="alert-link" href="javascript:void(0)" (click)="login()" (keyup.enter)="login()">sign in</a>

@jfr2102 jfr2102 May 29, 2025

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

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

adding the href and keyup.enter event improves accessablity and avoid eslint accessablity errors

@jfr2102 jfr2102 requested review from Copilot and krusche May 29, 2025 15:54
@jfr2102 jfr2102 marked this pull request as ready for review May 29, 2025 15:55

Copilot AI left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

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

Pull Request Overview

This PR fixes the login UI issue by addressing account null-checks and enhancing accessibility for the login link.

  • Simplifies the account check in the navbar for cleaner logic.
  • Updates the home component to use a new account condition syntax and adds a keyup event for improved accessibility.

Reviewed Changes

Copilot reviewed 2 out of 2 changed files in this pull request and generated 1 comment.

File Description
src/main/webapp/app/layouts/navbar/navbar.component.html Simplified account check by replacing the explicit null check.
src/main/webapp/app/home/home.component.html Updated account condition syntax and added keyup event handling for login.

<div class="alert alert-warning">
<span>You are not signed in. Click here to </span>
<a class="alert-link" (click)="login()" (keydown.enter)="login()" tabindex="0">sign in</a>
<a class="alert-link" href="javascript:void(0)" (click)="login()" (keyup.enter)="login()">sign in</a>

Copilot AI May 29, 2025

Copy link

Choose a reason for hiding this comment

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

Consider using a button element for the login action instead of an anchor tag with 'javascript:void(0)' to provide better semantic meaning and accessibility for assistive technologies.

Suggested change
<a class="alert-link" href="javascript:void(0)" (click)="login()" (keyup.enter)="login()">sign in</a>
<button class="alert-link" (click)="login()" (keyup.enter)="login()">sign in</button>

Copilot uses AI. Check for mistakes.

@krusche krusche left a comment

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

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

Code looks good 👍🏻

@krusche krusche merged commit 2006a34 into develop May 29, 2025
2 checks passed
@krusche krusche deleted the bugfix/fix-login branch May 29, 2025 16:14
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.

3 participants