LinchDesktopProvider

概述

LinchDesktopProvider 是 Linch Desktop Core 的根 Provider，负责：

初始化 i18n（国际化）
应用主题 CSS 变量
初始化 Sentry（如果启用）
包裹 DatabaseProvider（如果启用）
包裹 ErrorBoundary（错误边界）

导入

import { LinchDesktopProvider } from '@linch-tech/desktop-core';

Props

interface LinchDesktopProviderProps {
  /**
   * 应用配置
   */
  config: Partial<LinchDesktopConfig>;

  /**
   * 子组件
   */
  children: ReactNode;
}

基本用法

import { LinchDesktopProvider } from '@linch-tech/desktop-core';
import { config } from './config';

function App() {
  return (
    <LinchDesktopProvider config={config}>
      <YourApp />
    </LinchDesktopProvider>
  );
}

与路由配合

LinchDesktopProvider 应该包裹在路由组件之外：

import { BrowserRouter, Routes, Route } from 'react-router-dom';
import { LinchDesktopProvider, Shell } from '@linch-tech/desktop-core';
import { config } from './config';

function App() {
  return (
    <LinchDesktopProvider config={config}>
      <BrowserRouter>
        <Routes>
          <Route element={<Shell />}>
            <Route path="/" element={<Home />} />
            <Route path="/settings" element={<Settings />} />
          </Route>
        </Routes>
      </BrowserRouter>
    </LinchDesktopProvider>
  );
}

初始化顺序

Provider 按以下顺序初始化功能：

i18n - 初始化国际化，合并基座和应用翻译
Theme - 应用主题 CSS 变量（颜色、圆角、字体）
Sentry - 如果配置启用，初始化错误监控
Database - 如果配置启用，初始化数据库和迁移

Provider 结构

LinchDesktopProvider
├── ConfigProvider (配置上下文)
│   └── ErrorBoundary (错误边界)
│       └── DatabaseProvider (如果启用)
│           └── children

访问配置

在子组件中使用 useConfig hook 访问配置：

import { useConfig } from '@linch-tech/desktop-core';

function MyComponent() {
  const config = useConfig();

  return (
    <div>
      <h1>{config.brand.name}</h1>
      <p>Version: {config.brand.version}</p>
    </div>
  );
}

错误处理

ErrorBoundary 自动捕获子组件中的 React 错误，并显示友好的错误界面：

// 如果 MyBuggyComponent 抛出错误，ErrorBoundary 会捕获并显示错误信息
<LinchDesktopProvider config={config}>
  <MyBuggyComponent />
</LinchDesktopProvider>

注意事项

LinchDesktopProvider 应该只在应用中使用一次，且位于组件树的最顶层。

如果你需要在 Provider 外部使用配置（如在路由定义中），可以将配置作为单独的模块导出，然后在需要的地方导入。

LinchDesktopProvider

目录