Settings

The Settings system in the Flutter application is designed to be highly customizable, modular, and user-friendly. It leverages Riverpod for state management and SharedPreferences for persistence, providing a seamless experience for managing user preferences.

Architecture Overview

The settings system is built on a modular architecture where each category has its own dedicated page and provider.

• State Management: Uses StateNotifier and Riverpod for reactive updates across the app.
• Persistence: Preferences are saved locally using SharedPreferences.
• UI Components: Built using custom design tokens (DesignTokens) for consistent styling across light and dark modes.
• Localization: Fully integrated with standard Flutter localization (AppLocalizations).

Settings Categories

1. General Settings

Managed by lib/pages/settings/general/page.dart and UserPreferencesProvider.

2. Appearance Settings

Managed by lib/pages/settings/appearance/page.dart and ThemeProvider.

This section is the most visually rich part of the settings, offering:

• Theme Mode: Switch between Light, Dark, or System-defined modes.
• Design Themes: Choose from predefined themes such as Modern, Retro, or Cozy (defined in AppTheme).
• Accent Colors: Personalize the primary application colors (Emerald, Blue, Indigo, etc.).
• Display Options:
  • Text Size: Slider-based control for system-wide text scaling.
  • Bold Text: Toggle for high-contrast/bold typography.
  • Reduce Motion: Option to limit animations for accessibility.
  • Compact Mode: Switch between comfortable and information-dense layouts.

3. Notification Settings

Managed by lib/pages/settings/notifications/page.dart and NotificationSettingsProvider.

4. Security Settings

Managed by lib/pages/settings/security/page.dart and SecurityProvider.

Comprehensive security management including:

• Authentication:
  • Change Password: Dedicated flow for updating account credentials.
  • Biometric Login: Integration with Face ID / Fingerprint via local auth.
  • Two-Factor Auth (2FA): Toggle for enhanced account protection.
• Session Management:
  • View all active devices and login locations.
  • Ability to revoke specific sessions or "Sign out from all devices."
• Login History: A detailed log of successful and failed login attempts.
• Danger Zone: A secure process for permanent account deletion.

Technical Implementation

Accessing Settings State

To access or observe settings in your widgets, use the dedicated providers:

// Example: Accessing Theme Mode
final themeMode = ref.watch(themeModeProvider);

// Example: Accessing User Preferences
final userPrefs = ref.watch(userPreferencesProvider);

Modifying Settings

Always use the provided notifier methods to ensure state is updated and persisted correctly:

// Updating Theme Mode
ref.read(themeModeProvider.notifier).setMode(AppThemeMode.dark);

// Updating Privacy Preference
ref.read(userPreferencesProvider.notifier).setShareUsageData(true);

Help Center

While accessible via the Settings menu, the Help Center is treated as a separate feature set. It includes:

• Frequently Asked Questions (FAQ)
• Contact Support
• Feedback Submission
• Live Chat Integration

For more details, refer to the Help Center Documentation.

Best Practices for Developers

1. Always Persist: Ensure any new setting is added to SharedPreferences in the notifier's update method.
2. Reactive UI: Use ref.watch to ensure the UI updates instantly when a setting changes.
3. Localization: Never hardcode strings; always add new labels to the app_en.arb (and other translation) files.
4. Design Tokens: Use ref.watch(designTokensProvider) for all styling to respect theme and accessibility settings (like Bold Text).