From 19cfa8d126a2ff54298150529e58e5e4f5495f09 Mon Sep 17 00:00:00 2001
From: tobi <31960611+tsmethurst@users.noreply.github.com>
Date: Wed, 9 Apr 2025 14:14:20 +0200
Subject: [bugfix] Fix a couple accessibility issues with `:focus` elements
 (#3979)

* [bugfix/frontend] Fix accessibility/focus issues in settings + web ui

* fix little error

* tweaks
---
 .../admin/http-header-permissions/overview.tsx     | 23 ++++++++++++----------
 1 file changed, 13 insertions(+), 10 deletions(-)

(limited to 'web/source/settings/views/admin/http-header-permissions')

diff --git a/web/source/settings/views/admin/http-header-permissions/overview.tsx b/web/source/settings/views/admin/http-header-permissions/overview.tsx
index b2d8b7372..0b708aa8c 100644
--- a/web/source/settings/views/admin/http-header-permissions/overview.tsx
+++ b/web/source/settings/views/admin/http-header-permissions/overview.tsx
@@ -65,20 +65,23 @@ export default function HeaderPermsOverview() {
 	} = useGetHeaderAllowsQuery(NoArg, { skip: permType !== "allow" });
 
 	const itemToEntry = (perm: HeaderPermission) => {
+		const onClick = () => {
+			// When clicking on a header perm,
+			// go to the detail view for perm.
+			setLocation(`/${permType}s/${perm.id}`, {
+				// Store the back location in
+				// history so the detail view
+				// can use it to return here.
+				state: { backLocation: location }
+			});
+		};
+		
 		return (
 			<dl
 				key={perm.id}
 				className="entry pseudolink"
-				onClick={() => {
-					// When clicking on a header perm,
-					// go to the detail view for perm.
-					setLocation(`/${permType}s/${perm.id}`, {
-						// Store the back location in
-						// history so the detail view
-						// can use it to return here.
-						state: { backLocation: location }
-					});
-				}}
+				onClick={onClick}
+				onKeyDown={e => e.key === "Enter" && onClick()}
 				role="link"
 				tabIndex={0}
 			>
-- 
cgit v1.2.3