fix(a11y): WCAG 2.1 AA fixes (#2219)

apps/client/src/features/group/components/group-list.tsx

@@ -1,4 +1,4 @@
-import { Table, Group, Text, Anchor } from "@mantine/core";
+import { Table, Group, Text, Anchor, VisuallyHidden } from "@mantine/core";
 import { useGetGroupsQuery } from "@/features/group/queries/group-query";
 import { Link } from "react-router-dom";
 import { IconGroupCircle } from "@/components/icons/icon-people-circle.tsx";
@@ -12,6 +12,8 @@ import { AutoTooltipText } from "@/components/ui/auto-tooltip-text.tsx";
 import { SearchInput } from "@/components/common/search-input.tsx";
 import NoTableResults from "@/components/common/no-table-results.tsx";
 import { usePaginateAndSearch } from "@/hooks/use-paginate-and-search.tsx";
+import rowClasses from "@/components/ui/clickable-table-row.module.css";
+import GroupActionMenu from "@/features/group/components/group-action-menu.tsx";
 
 export default function GroupList() {
   const { t } = useTranslation();
@@ -34,13 +36,16 @@ export default function GroupList() {
             <Table.Tr>
               <Table.Th>{t("Group")}</Table.Th>
               <Table.Th>{t("Members")}</Table.Th>
+              <Table.Th w={60}>
+                <VisuallyHidden>{t("Actions")}</VisuallyHidden>
+              </Table.Th>
             </Table.Tr>
           </Table.Thead>
 
           <Table.Tbody>
             {data?.items.length > 0 ? (
             data?.items.map((group: IGroup, index: number) => (
-              <Table.Tr key={index}>
+              <Table.Tr key={index} className={rowClasses.row}>
                 <Table.Td onMouseEnter={() => prefetchGroupMembers(group.id)}>
                   <Anchor
                     size="sm"
@@ -49,6 +54,7 @@ export default function GroupList() {
                       cursor: "pointer",
                       color: "var(--mantine-color-text)",
                     }}
+                    className={rowClasses.link}
                     component={Link}
                     to={`/settings/groups/${group.id}`}
                   >
@@ -80,10 +86,13 @@ export default function GroupList() {
                     {formatMemberCount(group.memberCount, t)}
                   </Anchor>
                 </Table.Td>
+                <Table.Td>
+                  <GroupActionMenu group={group} />
+                </Table.Td>
               </Table.Tr>
             ))
             ) : (
-              <NoTableResults colSpan={2} />
+              <NoTableResults colSpan={3} />
             )}
           </Table.Tbody>
         </Table>