diff --git a/src/App.js b/src/App.js index 83dcd1a..512df35 100644 --- a/src/App.js +++ b/src/App.js @@ -21,6 +21,15 @@ function App() { .then(() => defineCustomElements(window)) .catch(() => {}); + // Init dark mode + if (localStorage.getItem('theme') === 'dark') { + document.body.classList.add('dark-mode'); + document.documentElement.setAttribute('data-theme', 'dark'); + } else { + document.body.classList.remove('dark-mode'); + document.documentElement.setAttribute('data-theme', 'light'); + } + // écouter un événement custom pour synchroniser l'état d'authentification const onAuthChanged = () => { try { diff --git a/src/components/header/AppHeader.js b/src/components/header/AppHeader.js index 4c1744b..3e2f4ad 100644 --- a/src/components/header/AppHeader.js +++ b/src/components/header/AppHeader.js @@ -36,7 +36,8 @@ const MENU_GROUPS = [ label: 'Configuration', items: [ { label: 'Gestion des parametres', href: '/parametres', match: ['/parametres'] }, - { label: 'Gestion des menus regionaux', href: '/menu', match: ['/menu'] } + { label: 'Gestion des menus regionaux', href: '/menu', match: ['/menu'] }, + { label: 'Mise à jour systeme', href: '/systeme-maj', match: ['/systeme-maj'] } ] }, { @@ -119,6 +120,22 @@ export default function AppHeader({ isLoggedIn, userName }) { const [isNotificationsOpen, setIsNotificationsOpen] = useState(false); const [notifications, setNotifications] = useState([]); const [notificationCount, setNotificationCount] = useState(0); + const [isDarkMode, setIsDarkMode] = useState(() => localStorage.getItem('theme') === 'dark'); + + const toggleDarkMode = () => { + setIsDarkMode(prev => { + const next = !prev; + localStorage.setItem('theme', next ? 'dark' : 'light'); + if (next) { + document.body.classList.add('dark-mode'); + document.documentElement.setAttribute('data-theme', 'dark'); + } else { + document.body.classList.remove('dark-mode'); + document.documentElement.setAttribute('data-theme', 'light'); + } + return next; + }); + }; useEffect(() => { const handleResize = () => { @@ -313,6 +330,7 @@ export default function AppHeader({ isLoggedIn, userName }) { else if (section === 'gares') permSection = 'gares'; else if (section === 'quais') permSection = 'quais'; else if (section === 'annonces-sonores') permSection = 'annonces_sonores'; + else if (section === 'systeme-maj') permSection = 'systeme_maj'; return hasAccessTo(user, permSection); } @@ -407,6 +425,16 @@ export default function AppHeader({ isLoggedIn, userName }) { )}
+ + {isLoggedIn && (