diff --git a/src/renderer/src/App.tsx b/src/renderer/src/App.tsx
index c5e70a92..1727f5bb 100644
--- a/src/renderer/src/App.tsx
+++ b/src/renderer/src/App.tsx
@@ -8,6 +8,7 @@ import { PersistGate } from 'redux-persist/integration/react'
 import Sidebar from './components/app/Sidebar'
 import TopViewContainer from './components/TopView'
 import AntdProvider from './context/AntdProvider'
+import PostHogProvider from './context/PostHogProvider'
 import StyleSheetManager from './context/StyleSheetManager'
 import { SyntaxHighlighterProvider } from './context/SyntaxHighlighterProvider'
 import { ThemeProvider } from './context/ThemeProvider'
@@ -24,32 +25,34 @@ import TranslatePage from './pages/translate/TranslatePage'
 function App(): React.ReactElement {
   return (
     <Provider store={store}>
-      <StyleSheetManager>
-        <ThemeProvider>
-          <AntdProvider>
-            <SyntaxHighlighterProvider>
-              <PersistGate loading={null} persistor={persistor}>
-                <TopViewContainer>
-                  <HashRouter>
-                    <NavigationHandler />
-                    <Sidebar />
-                    <Routes>
-                      <Route path="/" element={<HomePage />} />
-                      <Route path="/agents" element={<AgentsPage />} />
-                      <Route path="/paintings" element={<PaintingsPage />} />
-                      <Route path="/translate" element={<TranslatePage />} />
-                      <Route path="/files" element={<FilesPage />} />
-                      <Route path="/knowledge" element={<KnowledgePage />} />
-                      <Route path="/apps" element={<AppsPage />} />
-                      <Route path="/settings/*" element={<SettingsPage />} />
-                    </Routes>
-                  </HashRouter>
-                </TopViewContainer>
-              </PersistGate>
-            </SyntaxHighlighterProvider>
-          </AntdProvider>
-        </ThemeProvider>
-      </StyleSheetManager>
+      <PostHogProvider>
+        <StyleSheetManager>
+          <ThemeProvider>
+            <AntdProvider>
+              <SyntaxHighlighterProvider>
+                <PersistGate loading={null} persistor={persistor}>
+                  <TopViewContainer>
+                    <HashRouter>
+                      <NavigationHandler />
+                      <Sidebar />
+                      <Routes>
+                        <Route path="/" element={<HomePage />} />
+                        <Route path="/agents" element={<AgentsPage />} />
+                        <Route path="/paintings" element={<PaintingsPage />} />
+                        <Route path="/translate" element={<TranslatePage />} />
+                        <Route path="/files" element={<FilesPage />} />
+                        <Route path="/knowledge" element={<KnowledgePage />} />
+                        <Route path="/apps" element={<AppsPage />} />
+                        <Route path="/settings/*" element={<SettingsPage />} />
+                      </Routes>
+                    </HashRouter>
+                  </TopViewContainer>
+                </PersistGate>
+              </SyntaxHighlighterProvider>
+            </AntdProvider>
+          </ThemeProvider>
+        </StyleSheetManager>
+      </PostHogProvider>
     </Provider>
   )
 }
diff --git a/src/renderer/src/context/PostHogProvider.tsx b/src/renderer/src/context/PostHogProvider.tsx
new file mode 100644
index 00000000..edcfa385
--- /dev/null
+++ b/src/renderer/src/context/PostHogProvider.tsx
@@ -0,0 +1,24 @@
+import { useAppSelector } from '@renderer/store'
+import { PostHogProvider as PostHogReactProvider } from 'posthog-js/react'
+import { FC } from 'react'
+
+const POSTHOG_OPTIONS = {
+  api_key: 'phc_G0omsYajA6A9BY5c0rnU04ZaZck25xpR0DqKhwfF39n',
+  api_host: 'https://us.i.posthog.com'
+}
+
+const PostHogProvider: FC<{ children: React.ReactNode }> = ({ children }) => {
+  const enableDataCollection = useAppSelector((state) => state.settings.enableDataCollection)
+
+  if (enableDataCollection) {
+    return (
+      <PostHogReactProvider apiKey={POSTHOG_OPTIONS.api_key} options={POSTHOG_OPTIONS}>
+        {children}
+      </PostHogReactProvider>
+    )
+  }
+
+  return children
+}
+
+export default PostHogProvider