feat: add analytics init, identify, search tracking, consent header, settings toggle

apps/web/src/App.tsx

@@ -1,9 +1,12 @@
-import { Component, type ErrorInfo, lazy, type ReactNode, Suspense } from "react";
+import { APP_VERSION } from "@ashim/shared";
+import { Component, type ErrorInfo, lazy, type ReactNode, Suspense, useEffect } from "react";
 import { BrowserRouter, Navigate, Route, Routes, useLocation } from "react-router-dom";
 import { Toaster } from "sonner";
 import { ConnectionMonitor } from "./components/common/connection-monitor";
 import { KeyboardShortcutProvider } from "./components/common/keyboard-shortcut-provider";
 import { useAuth } from "./hooks/use-auth";
+import { identify, initAnalytics } from "./lib/analytics";
+import { useAnalyticsStore } from "./stores/analytics-store";
 
 // Lazy-load all pages so each page's JS (and its icons/deps) is only
 // downloaded when the user navigates there, shrinking the main bundle.
@@ -129,6 +132,34 @@ function PageLoader() {
 }
 
 export function App() {
+  const analyticsConfig = useAnalyticsStore((s) => s.config);
+  const analyticsConfigLoaded = useAnalyticsStore((s) => s.configLoaded);
+  const fetchAnalyticsConfig = useAnalyticsStore((s) => s.fetchConfig);
+  const analyticsConsent = useAnalyticsStore((s) => s.consent);
+
+  useEffect(() => {
+    fetchAnalyticsConfig();
+  }, [fetchAnalyticsConfig]);
+
+  useEffect(() => {
+    if (analyticsConfigLoaded && analyticsConfig?.enabled) {
+      initAnalytics(analyticsConfig);
+    }
+  }, [analyticsConfigLoaded, analyticsConfig]);
+
+  useEffect(() => {
+    if (
+      !analyticsConfigLoaded ||
+      !analyticsConfig?.enabled ||
+      analyticsConsent.analyticsEnabled !== true
+    )
+      return;
+    identify(analyticsConfig.instanceId, {
+      $set: { version: APP_VERSION },
+      $set_once: { instance_id: analyticsConfig.instanceId },
+    });
+  }, [analyticsConfigLoaded, analyticsConfig, analyticsConsent.analyticsEnabled]);
+
   return (
     <ErrorBoundary>
       <ConnectionMonitor />