feat: enhance font size toggle functionality in UserPreferencesContext
- Implemented optimistic UI updates for font size changes, cycling through small, medium, and large options. - Added error handling to revert to original preferences if the server action fails, improving user experience. - Updated dependencies in the toggleFontSize function to include preferences.viewPreferences for better state management.
This commit is contained in:
@@ -130,9 +130,31 @@ export function UserPreferencesProvider({ children, initialPreferences }: UserPr
|
||||
|
||||
const toggleFontSize = useCallback(() => {
|
||||
startTransition(async () => {
|
||||
await toggleFontSizeAction();
|
||||
const originalPreferences = preferences.viewPreferences;
|
||||
|
||||
// Optimistic update - cycle through font sizes
|
||||
const fontSizes: ('small' | 'medium' | 'large')[] = ['small', 'medium', 'large'];
|
||||
const currentIndex = fontSizes.indexOf(preferences.viewPreferences.fontSize);
|
||||
const nextIndex = (currentIndex + 1) % fontSizes.length;
|
||||
const newFontSize = fontSizes[nextIndex];
|
||||
|
||||
setPreferences(prev => ({
|
||||
...prev,
|
||||
viewPreferences: { ...prev.viewPreferences, fontSize: newFontSize }
|
||||
}));
|
||||
|
||||
try {
|
||||
const result = await toggleFontSizeAction();
|
||||
if (!result.success) {
|
||||
console.error('Erreur server action:', result.error);
|
||||
setPreferences(prev => ({ ...prev, viewPreferences: originalPreferences }));
|
||||
}
|
||||
} catch (error) {
|
||||
console.error('Erreur lors du toggle de la taille de police:', error);
|
||||
setPreferences(prev => ({ ...prev, viewPreferences: originalPreferences }));
|
||||
}
|
||||
});
|
||||
}, []);
|
||||
}, [preferences.viewPreferences]);
|
||||
|
||||
// === COLUMN VISIBILITY ===
|
||||
|
||||
|
||||
Reference in New Issue
Block a user