IntenseWebs/grafana
3
0
Fork 0
mirror of https://github.com/grafana/grafana.git synced 2025-02-25 18:55:37 -06:00
Code Issues Packages Projects Releases Wiki Activity

Accessibility: Enable rule jsx-a11y/no-noninteractive-element-interactions (#58077)

Browse Source 
* fixes for no-noninteractive-element-interactions

* remaining fixes

* add type="button"

* fix unit tests
This commit is contained in:
Ashley Harrison
2022-11-03 10:55:58 +00:00
committed by GitHub
parent 65bd5c65d8
commit 514d3111f4
16 changed files with 79 additions and 65 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
public/app/features/dashboard/components/LinksSettings/LinkSettingsList.tsx
View File

@@ -53,7 +53,7 @@ export const LinkSettingsList: React.FC<LinkSettingsListProps> = ({ dashboard, o
return (
<>
<table className="filter-table filter-table--hover">
<table role="grid" className="filter-table filter-table--hover">
<thead>
<tr>
<th>Type</th>
@@ -64,28 +64,28 @@ export const LinkSettingsList: React.FC<LinkSettingsListProps> = ({ dashboard, o
<tbody>
{links.map((link, idx) => (
<tr key={`${link.title}-${idx}`}>
<td className="pointer" onClick={() => onEdit(idx)}>
<td role="gridcell" className="pointer" onClick={() => onEdit(idx)}>
<Icon name="external-link-alt" /> &nbsp; {link.type}
</td>
<td>
<td role="gridcell">
<HorizontalGroup>
{link.title && <span>{link.title}</span>}
{link.type === 'link' && <span>{link.url}</span>}
{link.type === 'dashboards' && <TagList tags={link.tags ?? []} />}
</HorizontalGroup>
</td>
<td style={{ width: '1%' }}>
<td style={{ width: '1%' }} role="gridcell">
{idx !== 0 && <IconButton name="arrow-up" aria-label="arrow-up" onClick={() => moveLink(idx, -1)} />}
</td>
<td style={{ width: '1%' }}>
<td style={{ width: '1%' }} role="gridcell">
{links.length > 1 && idx !== links.length - 1 ? (
<IconButton name="arrow-down" aria-label="arrow-down" onClick={() => moveLink(idx, 1)} />
) : null}
</td>
<td style={{ width: '1%' }}>
<td style={{ width: '1%' }} role="gridcell">
<IconButton aria-label="copy" name="copy" onClick={() => duplicateLink(link, idx)} />
</td>
<td style={{ width: '1%' }}>
<td style={{ width: '1%' }} role="gridcell">
<DeleteButton
aria-label={`Delete link with title "${link.title}"`}
size="sm"