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.

src/components/settings/BackgroundImageSelector.tsx

@@ -87,11 +87,20 @@ export function BackgroundImageSelector() {
   const [customUrl, setCustomUrl] = useState('');
   const [showCustomInput, setShowCustomInput] = useState(false);
   const [showAdvancedOptions, setShowAdvancedOptions] = useState(false);
+  const [preservedCustomUrl, setPreservedCustomUrl] = useState<string>('');
 
   const currentBackground = preferences?.viewPreferences?.backgroundImage;
   const backgroundBlur = preferences?.viewPreferences?.backgroundBlur || 0;
   const backgroundOpacity = preferences?.viewPreferences?.backgroundOpacity || 100;
 
+  // Préserver l'URL personnalisée si elle existe
+  useEffect(() => {
+    if (currentBackground && !PRESET_BACKGROUNDS.some(preset => preset.id === currentBackground)) {
+      setPreservedCustomUrl(currentBackground);
+      localStorage.setItem('preservedCustomBackground', currentBackground);
+    }
+  }, [currentBackground]);
+
   const handlePresetSelect = (presetId: string) => {
     const backgroundImage = presetId === 'none' ? undefined : presetId;
     updateViewPreferences({ backgroundImage });
@@ -100,14 +109,24 @@ export function BackgroundImageSelector() {
   const handleCustomUrlSubmit = () => {
     if (!customUrl.trim()) return;
     
-    updateViewPreferences({ backgroundImage: customUrl.trim() });
+    const url = customUrl.trim();
+    updateViewPreferences({ backgroundImage: url });
+    setPreservedCustomUrl(url);
+    localStorage.setItem('preservedCustomBackground', url);
     setCustomUrl('');
     setShowCustomInput(false);
   };
 
-
   const handleRemoveCustom = () => {
     updateViewPreferences({ backgroundImage: undefined });
+    setPreservedCustomUrl('');
+    localStorage.removeItem('preservedCustomBackground');
+  };
+
+  const handleRestoreCustom = () => {
+    if (preservedCustomUrl) {
+      updateViewPreferences({ backgroundImage: preservedCustomUrl });
+    }
   };
 
   const handleBlurChange = (blur: number) => {
@@ -212,13 +231,25 @@ export function BackgroundImageSelector() {
                   Ajoutez votre propre image de fond
                 </p>
               </div>
-              <Button
-                onClick={() => setShowCustomInput(!showCustomInput)}
-                variant="secondary"
-                size="sm"
-              >
-                {showCustomInput ? 'Masquer' : 'Ajouter'}
-              </Button>
+              <div className="flex gap-2">
+                {preservedCustomUrl && (
+                  <Button
+                    onClick={handleRestoreCustom}
+                    variant="secondary"
+                    size="sm"
+                    className="text-xs"
+                  >
+                    Restaurer
+                  </Button>
+                )}
+                <Button
+                  onClick={() => setShowCustomInput(!showCustomInput)}
+                  variant="secondary"
+                  size="sm"
+                >
+                  {showCustomInput ? 'Masquer' : 'Ajouter'}
+                </Button>
+              </div>
             </div>
 
             {showCustomInput && (