feat: enhance keyboard shortcuts and background image handling

- Added `GlobalKeyboardShortcuts` component to manage global keyboard shortcuts.
- Introduced new keyboard shortcut (Shift + B) for changing the background.
- Updated `BackgroundImageSelector` to preserve custom background URLs and allow restoration of previously set backgrounds.
- Improved local storage handling for custom backgrounds to enhance user experience.
This commit is contained in:
Julien Froidefond
2025-10-02 13:52:18 +02:00
parent d4e8dc144b
commit 9094aca1ff
6 changed files with 169 additions and 9 deletions

View File

@@ -0,0 +1,103 @@
'use client';
import { useUserPreferences } from '@/contexts/UserPreferencesContext';
// Liste des backgrounds prédéfinis pour le cycle
const BACKGROUND_CYCLE = [
'none',
'theme-subtle',
'theme-primary',
'theme-accent',
'theme-success',
'theme-purple',
'theme-diagonal',
'theme-radial',
'theme-sunset',
'theme-ocean',
'theme-forest',
'theme-galaxy'
];
export function useBackgroundCycle() {
const { preferences, updateViewPreferences } = useUserPreferences();
const cycleBackground = () => {
const currentBackground = preferences?.viewPreferences?.backgroundImage;
// Construire la liste complète des backgrounds (prédéfinis + personnalisé)
const allBackgrounds = [...BACKGROUND_CYCLE];
// Ajouter l'image personnalisée préservée si elle existe
const preservedCustomUrl = localStorage.getItem('preservedCustomBackground');
console.log('Debug cycle:', {
currentBackground,
preservedCustomUrl,
localStorageKeys: Object.keys(localStorage)
});
if (preservedCustomUrl && !BACKGROUND_CYCLE.includes(preservedCustomUrl)) {
allBackgrounds.push(preservedCustomUrl);
}
// Ajouter aussi l'image actuelle si elle est personnalisée ET différente de celle préservée
if (currentBackground &&
!BACKGROUND_CYCLE.includes(currentBackground) &&
currentBackground !== preservedCustomUrl) {
allBackgrounds.push(currentBackground);
}
const currentIndex = allBackgrounds.findIndex(bg => bg === currentBackground);
// Si on ne trouve pas l'index, c'est qu'on est sur "none" (undefined)
// Dans ce cas, on commence au début de la liste
let actualCurrentIndex = currentIndex;
if (currentIndex === -1) {
actualCurrentIndex = -1; // On est sur "none", on va commencer à l'index 0
}
const nextIndex = (actualCurrentIndex + 1) % allBackgrounds.length;
const nextBackground = allBackgrounds[nextIndex];
// Si c'est 'none', on met undefined
const backgroundImage = nextBackground === 'none' ? undefined : nextBackground;
// Si on est sur "none" (undefined) et qu'on va vers "none", on va vers le suivant
if (currentBackground === undefined && nextBackground === 'none') {
const nextNextIndex = (nextIndex + 1) % allBackgrounds.length;
const nextNextBackground = allBackgrounds[nextNextIndex];
const finalBackgroundImage = nextNextBackground === 'none' ? undefined : nextNextBackground;
console.log('Cycle result:', {
allBackgrounds,
currentIndex,
actualCurrentIndex,
nextIndex,
nextBackground,
backgroundImage,
currentBackground,
nextNextIndex,
nextNextBackground,
finalBackgroundImage
});
updateViewPreferences({ backgroundImage: finalBackgroundImage });
return;
}
console.log('Cycle result:', {
allBackgrounds,
currentIndex,
actualCurrentIndex,
nextIndex,
nextBackground,
backgroundImage,
currentBackground
});
updateViewPreferences({ backgroundImage });
};
return {
cycleBackground
};
}

View File

@@ -21,6 +21,7 @@ interface KeyboardShortcutsActions {
onSave?: () => void;
onBackup?: () => void;
onOpenSearch?: () => void;
onCycleBackground?: () => void;
}
export function useGlobalKeyboardShortcuts(actions: KeyboardShortcutsActions = {}) {
@@ -56,6 +57,10 @@ export function useGlobalKeyboardShortcuts(actions: KeyboardShortcutsActions = {
event.preventDefault();
actions.onOpenSearch?.();
return;
case 'B':
event.preventDefault();
actions.onCycleBackground?.();
return;
}
}