chris/frigate
1
0
Fork 0
forked from Github/frigate
Code Pull Requests Packages Activity

Accessibility features (#14518)

Browse Source 
* Add screen reader aria labels to buttons and menu items

* Fix sub_label score in search detail dialog
This commit is contained in:
Josh Hawkins
2024-10-22 17:07:42 -05:00
committed by GitHub
parent c7d9f83638
commit ad308252a1
61 changed files with 358 additions and 115 deletions
Download Patch File Download Diff File Expand all files Collapse all files

19
web/src/components/overlay/detail/SearchDetailDialog.tsx
View File

@@ -296,7 +296,7 @@ function ObjectDetailsTab({
}
if (search.sub_label) {
return Math.round((search.data?.top_score ?? 0) * 100);
return Math.round((search.data?.sub_label_score ?? 0) * 100);
} else {
return undefined;
}
@@ -440,6 +440,7 @@ function ObjectDetailsTab({
/>
{config?.semantic_search.enabled && (
<Button
aria-label="Find similar tracked objects"
onClick={() => {
setSearch(undefined);
@@ -466,6 +467,7 @@ function ObjectDetailsTab({
<div className="flex items-center">
<Button
className="rounded-r-none border-r-0"
aria-label="Regenerate tracked object description"
onClick={() => regenerateDescription("thumbnails")}
>
Regenerate
@@ -473,19 +475,24 @@ function ObjectDetailsTab({
{search.has_snapshot && (
<DropdownMenu>
<DropdownMenuTrigger asChild>
<Button className="rounded-l-none border-l-0 px-2">
<Button
className="rounded-l-none border-l-0 px-2"
aria-label="Expand regeneration menu"
>
<FaChevronDown className="size-3" />
</Button>
</DropdownMenuTrigger>
<DropdownMenuContent>
<DropdownMenuItem
className="cursor-pointer"
aria-label="Regenerate from snapshot"
onClick={() => regenerateDescription("snapshot")}
>
Regenerate from Snapshot
</DropdownMenuItem>
<DropdownMenuItem
className="cursor-pointer"
aria-label="Regenerate from thumbnails"
onClick={() => regenerateDescription("thumbnails")}
>
Regenerate from Thumbnails
@@ -495,7 +502,11 @@ function ObjectDetailsTab({
)}
</div>
)}
<Button variant="select" onClick={updateDescription}>
<Button
variant="select"
aria-label="Save"
onClick={updateDescription}
>
Save
</Button>
</div>
@@ -601,6 +612,7 @@ function ObjectSnapshotTab({
<>
<Button
className="bg-success"
aria-label="Confirm this label for Frigate Plus"
onClick={() => {
setState("uploading");
onSubmitToPlus(false);
@@ -610,6 +622,7 @@ function ObjectSnapshotTab({
</Button>
<Button
className="text-white"
aria-label="Do not confirm this label for Frigate Plus"
variant="destructive"
onClick={() => {
setState("uploading");