设置系统提供了一个全面的配置界面,用于用户偏好设置、账户管理、外观定制和服务集成。它使用标签页界面来组织不同的设置类别,并通过 React Context 维护状态。
有关主题编辑器和自定义主题创建的信息,请参阅 UI 组件和前端。有关云保存偏好的详细信息,请参阅 云保存系统。
设置系统围绕一个主 Settings 组件构建,该组件通过标签页界面协调多个设置类别。每个类别都实现为一个独立的 React 组件,并通过共享的 Context Provider 进行管理。
来源: src/renderer/src/pages/settings/settings.tsx18-113 src/renderer/src/pages/settings/settings-account.tsx20-255 src/renderer/src/pages/settings/aparence/settings-appearance.tsx17-123
设置界面根据用户认证状态和功能标志动态组织为类别。类别在 categories 数组中定义,并有条件地渲染。
| 类别 | 组件 | 条件 | 目的 |
|---|---|---|---|
| 通用 | SettingsGeneral | 始终显示 | 基本应用程序偏好设置 |
| 行为 | SettingsBehavior | 始终显示 | 应用程序行为设置 |
| 下载源 | SettingsDownloadSources | 始终显示 | 下载源配置 |
| 外观 | SettingsAppearance | 始终显示 | 主题和 UI 定制 |
| TorBox | SettingsTorBox | 功能标志已启用 | TorBox 服务集成 |
| Real-Debrid | SettingsRealDebrid | 始终显示 | Real-Debrid 服务设置 |
| 账户 | SettingsAccount | 用户已认证 | 账户和订阅管理 |
类别可见性逻辑在 src/renderer/src/pages/settings/settings.tsx27-53 中实现,其中类别是根据 userDetails 的存在和 isTorBoxEnabled 功能标志动态构建的。
来源: src/renderer/src/pages/settings/settings.tsx27-53
设置系统使用 React Context 来管理所有设置组件之间的共享状态。SettingsContext 接口定义了可用的操作
来源: src/renderer/src/context/settings/settings.context.tsx8-22
设置上下文处理 URL 参数,用于深度链接到特定类别
urls 参数设置源 URL 并导航到下载源类别theme、authorId、authorName 参数会触发主题导入流程并导航到外观类别此功能在 src/renderer/src/context/settings/settings.context.tsx64-100 中实现
来源: src/renderer/src/context/settings/settings.context.tsx64-100
The SettingsAccount 组件通过多个部分提供全面的账户管理
来源: src/renderer/src/pages/settings/settings-account.tsx146-254
Hydra Cloud 订阅部分根据订阅状态动态显示不同的状态和操作
此逻辑在 getHydraCloudSectionContent() 函数中实现,位于 src/renderer/src/pages/settings/settings-account.tsx95-141
来源: src/renderer/src/pages/settings/settings-account.tsx95-141
外观设置与主题系统集成,提供主题导入、管理和定制功能
来源: src/renderer/src/pages/settings/aparence/settings-appearance.tsx33-81
外观设置支持直接从 URL 参数导入主题。当存在主题参数时,系统会
ImportThemeModal 以供用户确认此流程在 src/renderer/src/pages/settings/aparence/settings-appearance.tsx50-75 中处理
来源: src/renderer/src/pages/settings/aparence/settings-appearance.tsx50-75
设置更新通过 Context 的 updateUserPreferences 函数进行,该函数在渲染器和主进程之间进行协调
The updateUserPreferences 函数实现在 src/renderer/src/context/settings/settings.context.tsx121-126
来源: src/renderer/src/context/settings/settings.context.tsx121-126
账户设置组件通过 onAccountUpdated 事件监听账户更新,并在发生更改时自动刷新用户详细信息。这确保了 UI 与后端更改保持同步,尤其是在外部身份验证流程之后。
同步逻辑在 src/renderer/src/pages/settings/settings-account.tsx53-66 中实现
来源: src/renderer/src/pages/settings/settings-account.tsx53-66