fix: SonarQube - refactor DOMContentLoaded (CC 17->5), contraste SCSS

app.js :
- Extraction 5 fonctions du handler DOMContentLoaded :
  initGroupCheckboxes, initStatsPeriodSelector, initConfirmModal,
  initSidebarAndMobileMenu, initCookieBanner
- Complexite cognitive reduite de 17 a ~5

app.scss :
- Sidebar hover : fond opaque #2a2a2a + color #ffffff
  (ratio contraste 13.5:1, min requis 4.5:1)

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
Serreau Jovann
2026-04-08 08:56:46 +02:00
parent aeb2744d7d
commit 598cb2cd3a
2 changed files with 31 additions and 27 deletions

View File

@@ -1,14 +1,14 @@
import "./app.scss"
import { initEntrepriseSearch } from "./modules/entreprise-search.js"
// Membre / Super Admin : mutuellement exclusif
document.addEventListener('DOMContentLoaded', () => {
function initGroupCheckboxes() {
const memberCheckbox = document.querySelector('input[value="gp_member"]');
const adminCheckbox = document.querySelector('input[value="superadmin"]');
if (!memberCheckbox || !adminCheckbox) return;
const otherGroupCheckboxes = () =>
[...document.querySelectorAll('input[name="groups[]"]')].filter(cb => cb !== memberCheckbox);
if (memberCheckbox && adminCheckbox) {
memberCheckbox.addEventListener('change', () => {
/* istanbul ignore next */ if (memberCheckbox.checked) otherGroupCheckboxes().forEach(cb => { cb.checked = false; });
});
@@ -20,7 +20,7 @@ document.addEventListener('DOMContentLoaded', () => {
});
}
// Stats period selector
function initStatsPeriodSelector() {
const periodSelect = document.getElementById('stats-period-select');
const customRange = document.getElementById('stats-custom-range');
if (periodSelect && customRange) {
@@ -28,8 +28,9 @@ document.addEventListener('DOMContentLoaded', () => {
customRange.classList.toggle('hidden', periodSelect.value !== 'custom');
});
}
}
// data-confirm — modal glassmorphism custom
function initConfirmModal() {
const confirmModal = document.createElement('div');
confirmModal.id = 'confirm-modal';
confirmModal.className = 'hidden fixed inset-0 z-[100] flex items-center justify-center';
@@ -82,8 +83,9 @@ document.addEventListener('DOMContentLoaded', () => {
}
});
});
}
// Sidebar dropdown toggle
function initSidebarAndMobileMenu() {
document.querySelectorAll('.sidebar-dropdown-btn').forEach(btn => {
btn.addEventListener('click', () => {
const menu = btn.nextElementSibling;
@@ -93,22 +95,15 @@ document.addEventListener('DOMContentLoaded', () => {
});
});
// Mobile sidebar toggle
const sidebarToggle = document.getElementById('admin-sidebar-toggle');
const sidebar = document.getElementById('admin-sidebar');
const overlay = document.getElementById('admin-overlay');
if (sidebarToggle && sidebar && overlay) {
sidebarToggle.addEventListener('click', () => {
sidebar.classList.toggle('open');
});
overlay.addEventListener('click', () => {
sidebar.classList.remove('open');
});
sidebarToggle.addEventListener('click', () => sidebar.classList.toggle('open'));
overlay.addEventListener('click', () => sidebar.classList.remove('open'));
}
// Mobile menu toggle (public)
const mobileMenuBtn = document.getElementById('mobile-menu-btn');
const mobileMenu = document.getElementById('mobile-menu');
const menuIconOpen = document.getElementById('menu-icon-open');
@@ -121,8 +116,9 @@ document.addEventListener('DOMContentLoaded', () => {
menuIconClose?.classList.toggle('hidden');
});
}
}
// Cookie banner
function initCookieBanner() {
const cookieBanner = document.getElementById('cookie-banner');
const cookieAccept = document.getElementById('cookie-accept');
const cookieRefuse = document.getElementById('cookie-refuse');
@@ -140,6 +136,14 @@ document.addEventListener('DOMContentLoaded', () => {
localStorage.setItem('cookie_consent', 'refused');
cookieBanner?.classList.add('hidden');
});
}
document.addEventListener('DOMContentLoaded', () => {
initGroupCheckboxes();
initStatsPeriodSelector();
initConfirmModal();
initSidebarAndMobileMenu();
initCookieBanner();
// Search (customers & revendeurs)
const renderHit = (h, linkPrefix) => {

View File

@@ -227,8 +227,8 @@ body.glass-bg {
border-left: 4px solid transparent;
&:hover {
background: rgba(255, 255, 255, 0.15);
color: #f5f5f5;
background: #2a2a2a;
color: #ffffff;
border-left-color: var(--gold);
}