- Added `ToastProvider` to `RootLayout` for improved user feedback on theme changes. - Updated `ThemeProvider` to display toast notifications with theme names and icons upon theme changes. - Refactored theme-related imports to streamline code and improve maintainability. - Simplified background cycling logic in `useBackgroundCycle` to utilize centralized background definitions. - Cleaned up unused background definitions in `BackgroundContext` for better clarity and performance.
77 lines
2.6 KiB
TypeScript
77 lines
2.6 KiB
TypeScript
// Types de thèmes
|
|
export type Theme = 'light' | 'dark' | 'dracula' | 'monokai' | 'nord' | 'gruvbox' | 'tokyo_night' | 'catppuccin' | 'rose_pine' | 'one_dark' | 'material' | 'solarized';
|
|
|
|
// Configuration des thèmes
|
|
export const THEME_CONFIG = {
|
|
// Thème par défaut
|
|
default: 'dark' as Theme,
|
|
|
|
// Thème light
|
|
light: 'light' as Theme,
|
|
|
|
// Liste de tous les thèmes dark disponibles
|
|
darkThemes: [
|
|
'dark',
|
|
'dracula',
|
|
'monokai',
|
|
'nord',
|
|
'gruvbox',
|
|
'tokyo_night',
|
|
'catppuccin',
|
|
'rose_pine',
|
|
'one_dark',
|
|
'material',
|
|
'solarized'
|
|
] as Theme[],
|
|
|
|
// Tous les thèmes disponibles
|
|
allThemes: [
|
|
'light',
|
|
'dark',
|
|
'dracula',
|
|
'monokai',
|
|
'nord',
|
|
'gruvbox',
|
|
'tokyo_night',
|
|
'catppuccin',
|
|
'rose_pine',
|
|
'one_dark',
|
|
'material',
|
|
'solarized'
|
|
] as Theme[],
|
|
|
|
// Métadonnées des thèmes (déplacées vers ui-config.ts)
|
|
metadata: {
|
|
light: { name: 'Light', description: 'Thème clair par défaut', icon: '☀️' },
|
|
dark: { name: 'Dark', description: 'Thème sombre classique', icon: '🌙' },
|
|
dracula: { name: 'Dracula', description: 'Inspiré du thème Dracula', icon: '🧛' },
|
|
monokai: { name: 'Monokai', description: 'Inspiré du thème Monokai', icon: '🎨' },
|
|
nord: { name: 'Nord', description: 'Palette Nord arctique', icon: '❄️' },
|
|
gruvbox: { name: 'Gruvbox', description: 'Palette Gruvbox retro', icon: '🎭' },
|
|
tokyo_night: { name: 'Tokyo Night', description: 'Nuit tokyoïte', icon: '🌃' },
|
|
catppuccin: { name: 'Catppuccin', description: 'Palette pastel douce', icon: '🐱' },
|
|
rose_pine: { name: 'Rose Pine', description: 'Palette rose et pin', icon: '🌹' },
|
|
one_dark: { name: 'One Dark', description: 'Inspiré d\'Atom One Dark', icon: '🌑' },
|
|
material: { name: 'Material', description: 'Inspiré de Material Design', icon: '📱' },
|
|
solarized: { name: 'Solarized', description: 'Palette Solarized', icon: '☀️' }
|
|
}
|
|
} as const;
|
|
|
|
// Fonctions utilitaires
|
|
export const getNextDarkTheme = (currentTheme: Theme): Theme => {
|
|
const currentIndex = THEME_CONFIG.darkThemes.indexOf(currentTheme);
|
|
if (currentIndex === -1) {
|
|
return THEME_CONFIG.darkThemes[0];
|
|
}
|
|
const nextIndex = (currentIndex + 1) % THEME_CONFIG.darkThemes.length;
|
|
return THEME_CONFIG.darkThemes[nextIndex];
|
|
};
|
|
|
|
export const isDarkTheme = (theme: Theme): boolean => {
|
|
return THEME_CONFIG.darkThemes.includes(theme);
|
|
};
|
|
|
|
export const getThemeMetadata = (theme: Theme) => {
|
|
return THEME_CONFIG.metadata[theme] || { name: theme, description: 'Thème personnalisé', icon: '🎨' };
|
|
};
|