feat(apps/web): Add aria labels. Increase size for action icon button…

…s to fix minimum target size issue.
cartesi · Jan 30, 2025 · 7b665dc · 7b665dc
1 parent 40da9e3
commit 7b665dc
Showing 1 changed file with 14 additions and 2 deletions.
diff --git a/apps/web/src/components/applications/applicationsTable.tsx b/apps/web/src/components/applications/applicationsTable.tsx
@@ -62,7 +62,11 @@ const ApplicationDataColumn: FC<ColumnProps> = ({ application }) => {
                         href={`/applications/${appId}`}
                         data-testid="applications-summary-link"
                     >
-                        <ActionIcon variant="default">
+                        <ActionIcon
+                            variant="default"
+                            aria-label="View application summary"
+                            size="lg"
+                        >
                             <TbStack2 />
                         </ActionIcon>
                     </Link>
@@ -72,7 +76,11 @@ const ApplicationDataColumn: FC<ColumnProps> = ({ application }) => {
                         href={`/applications/${appId}/inputs`}
                         data-testid="applications-link"
                     >
-                        <ActionIcon variant="default">
+                        <ActionIcon
+                            variant="default"
+                            aria-label="View application inputs"
+                            size="lg"
+                        >
                             <TbInbox />
                         </ActionIcon>
                     </Link>
@@ -82,6 +90,8 @@ const ApplicationDataColumn: FC<ColumnProps> = ({ application }) => {
                         <ActionIcon
                             data-testid="remove-connection"
                             variant="default"
+                            aria-label="Remove connection"
+                            size="lg"
                             onClick={() => removeConnection(appId)}
                         >
                             <TbPlugConnectedX />
@@ -92,6 +102,8 @@ const ApplicationDataColumn: FC<ColumnProps> = ({ application }) => {
                         <ActionIcon
                             data-testid="add-connection"
                             variant="default"
+                            aria-label="Add connection"
+                            size="lg"
                             onClick={() => showConnectionModal(appId)}
                         >
                             <TbPlugConnected />