fa/breadcrumb-the-shire
1
0
Fork 1
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

fix(helpdesk): address code review findings for Risk Radar

Browse Source 
- CR-001/002: Replace hardcoded 'critical', 'Ticket', 'Status' with
  i18n data-label attributes
- CR-004: Add tabindex, role=button, keydown handler to risk cards
  for keyboard accessibility
- CR-005: Add aria-labelledby on detail dialog

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
Felix Schneider
2026-04-06 00:28:09 +02:00
parent 5a4974909b
commit ba356d2d61
2 changed files with 13 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
modules/helpdesk/pages/helpdesk/risk-radar/index(default).phtml
View File

@@ -32,6 +32,10 @@ $periodLabels = [
data-label-overdue="<?php e(t('overdue')); ?>"
data-label-net="<?php e(t('net')); ?>"
data-label-search="<?php e(t('Search customers...')); ?>"
data-label-critical="<?php e(t('critical')); ?>"
data-label-ticket="<?php e(t('Ticket')); ?>"
data-label-status="<?php e(t('Status')); ?>"
data-label-age="<?php e(t('Age')); ?>"
data-label-tickets="<?php e(t('Tickets')); ?>"
data-label-score="<?php e(t('Risk score')); ?>"
>
@@ -114,7 +118,7 @@ $periodLabels = [
<div id="radar-cards" class="helpdesk-risk-radar-grid"></div>
</div>
<dialog id="radar-detail-dialog" class="app-dialog-lg">
<dialog id="radar-detail-dialog" class="app-dialog-lg" aria-labelledby="radar-detail-title">
<div class="app-dialog-header">
<h2 id="radar-detail-title"></h2>
<button type="button" class="app-dialog-close" aria-label="<?php e(t('Close')); ?>">&times;</button>

14
modules/helpdesk/web/js/helpdesk-risk-radar.js
View File

@@ -94,7 +94,7 @@ if (container) {
}
if (kpis.critical > 0) {
const m = h('span', 'helpdesk-risk-card-metric helpdesk-risk-card-metric-warn');
m.textContent = kpis.critical + ' critical';
m.textContent = kpis.critical + ' ' + d('labelCritical', 'critical');
metrics.appendChild(m);
}
const openM = h('span', 'helpdesk-risk-card-metric');
@@ -128,9 +128,11 @@ if (container) {
card.appendChild(driverSection);
}
// Click to open detail
card.style.cursor = 'pointer';
// Click/keyboard to open detail
card.tabIndex = 0;
card.setAttribute('role', 'button');
card.addEventListener('click', () => openDetail(customer));
card.addEventListener('keydown', (e) => { if (e.key === 'Enter' || e.key === ' ') { e.preventDefault(); openDetail(customer); } });
return card;
}
@@ -169,10 +171,10 @@ if (container) {
const table = h('table', 'helpdesk-risk-detail-tickets');
const thead = h('thead');
const headRow = h('tr');
headRow.appendChild(h('th', '', 'Ticket'));
headRow.appendChild(h('th', '', d('labelTicket', 'Ticket')));
headRow.appendChild(h('th', '', d('labelSla', 'SLA')));
headRow.appendChild(h('th', '', 'Status'));
headRow.appendChild(h('th', '', d('labelInactivity', 'Age')));
headRow.appendChild(h('th', '', d('labelStatus', 'Status')));
headRow.appendChild(h('th', '', d('labelAge', 'Age')));
thead.appendChild(headRow);
table.appendChild(thead);
const tbody = h('tbody');