feat: enhance theme management and customization options

- Added support for multiple themes (dracula, monokai, nord, gruvbox, tokyo_night, catppuccin, rose_pine, one_dark, material, solarized) in the application.
- Updated `setTheme` function to accept the new `Theme` type, allowing for more flexible theme selection.
- Introduced `ThemeSelector` component in GeneralSettingsPage for user-friendly theme selection.
- Modified `ThemeProvider` to handle user preferred themes and improved theme toggling logic.
- Updated CSS variables in `globals.css` to support new themes, enhancing visual consistency across the app.

src/components/ui/Header.tsx

@@ -13,7 +13,7 @@ interface HeaderProps {
 }
 
 export function Header({ title = "TowerControl", subtitle = "Task Management", syncing = false }: HeaderProps) {
-  const { theme, toggleTheme } = useTheme();
+  const { theme, toggleTheme, userPreferredTheme } = useTheme();
   const { isConfigured: isJiraConfigured, config: jiraConfig } = useJiraConfig();
   const pathname = usePathname();
   const [mobileMenuOpen, setMobileMenuOpen] = useState(false);
@@ -87,13 +87,15 @@ export function Header({ title = "TowerControl", subtitle = "Task Management", s
               <button
                 onClick={toggleTheme}
                 className="text-[var(--muted-foreground)] hover:text-[var(--primary)] transition-colors p-2 rounded-md hover:bg-[var(--card-hover)]"
-                title={`Switch to ${theme === 'dark' ? 'light' : 'dark'} theme`}
+                title={theme === 'light' ? `Switch to ${userPreferredTheme} theme` : 'Switch to light theme'}
               >
-                {theme === 'dark' ? (
+                {theme === 'light' ? (
+                  // Soleil pour le thème clair
                   <svg className="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                     <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M12 3v1m0 16v1m9-9h-1M4 12H3m15.364 6.364l-.707-.707M6.343 6.343l-.707-.707m12.728 0l-.707.707M6.343 17.657l-.707.707M16 12a4 4 0 11-8 0 4 4 0 018 0z" />
                   </svg>
                 ) : (
+                  // Lune pour tous les thèmes sombres
                   <svg className="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                     <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M20.354 15.354A9 9 0 018.646 3.646 9.003 9.003 0 0012 21a9.003 9.003 0 008.354-5.646z" />
                   </svg>