|
| 1 | +--- |
| 2 | +title: Settings |
| 3 | +description: Learn how users can customize the application's appearance, language, and feed display. |
| 4 | +--- |
| 5 | +import { Card, CardGrid } from '@astrojs/starlight/components'; |
| 6 | + |
| 7 | +The Settings section provides users with granular control over their application experience, allowing them to tailor the appearance, language, and content display to their personal preferences. |
| 8 | + |
| 9 | +## Core Components |
| 10 | + |
| 11 | +- **`SettingsBloc`**: This BLoC is the central hub for all user-configurable settings. It is responsible for loading the `UserAppSettings` object for the current user from the repository. If no settings exist (e.g., for a new user), it creates a default set and persists them. It handles events for every individual setting change, updating the state and saving the changes back to the repository. |
| 12 | + |
| 13 | +- **`SettingsPage`**: The main entry point for the settings feature. It provides a menu of setting categories, such as Language, Appearance, and Feed Display. |
| 14 | + |
| 15 | +- **Sub-Pages**: The settings are organized into several dedicated sub-pages for clarity: |
| 16 | + - `LanguageSettingsPage`: Allows the user to select their preferred language. |
| 17 | + - `AppearanceSettingsPage`: A menu that leads to theme and font settings. |
| 18 | + - `ThemeSettingsPage`: For choosing between light/dark/system themes and selecting an accent color. |
| 19 | + - `FontSettingsPage`: For adjusting text size, font family, and font weight. |
| 20 | + - `FeedSettingsPage`: For configuring how headlines are displayed in the feed (e.g., image style). |
| 21 | + |
| 22 | +## Key Functionalities |
| 23 | + |
| 24 | +<CardGrid> |
| 25 | + <Card title="Persistent User Settings" icon="save"> |
| 26 | + All settings are managed through the `UserAppSettings` model and are persisted per-user via the `DataRepository`. When a user changes a setting, the `SettingsBloc` updates its state and immediately calls the repository to save the change, ensuring preferences are retained across sessions. |
| 27 | + </Card> |
| 28 | + <Card title="Comprehensive Appearance Control" icon="palette"> |
| 29 | + Users have extensive control over the app's look and feel. They can switch between light, dark, and system themes, choose from multiple accent colors, select different font families, adjust the global text size, and even change the font weight for better readability. |
| 30 | + </Card> |
| 31 | + <Card title="Feed Customization" icon="feed"> |
| 32 | + The `FeedSettingsPage` allows users to customize how headlines are presented in their feed. For example, they can choose between different image styles: a large image at the top, a small thumbnail, or a text-only view for a more compact layout. |
| 33 | + </Card> |
| 34 | + <Card title="Reactive UI Updates" icon="cycle"> |
| 35 | + When a setting is changed in the `SettingsBloc`, it also notifies the main `AppBloc` via an `AppSettingsRefreshed` event. This triggers the `AppBloc` to reload the settings and apply the changes globally, ensuring that the entire application UI instantly reflects the user's new preferences. |
| 36 | + </Card> |
| 37 | +</CardGrid> |
0 commit comments