MOREE!!!!

webui/src/components/SettingsPanel/index.jsx

@@ -18,6 +18,7 @@ import { useSettingsNamespace } from '../../settings/index.js';
 import { useSocket } from '../../context/SocketContext.jsx';
 import { AUDIO_SETTINGS_DEFAULTS, VIDEO_SETTINGS_DEFAULTS } from '../../settings/namespaces.js';
 import { formatKeyLabel } from '../../controls/keymapUtils.js';
+import { trackAnalyticsEvent, trackAnalyticsEventThrottled } from '../../analytics/index.js';
 
 const manualTabs = [
   { key: 'start', label: 'Start OI' },
@@ -142,6 +143,7 @@ export default function SettingsPanel() {
   const handleTransportChange = (event) => {
     const next = event.target.value;
     savePageSettings((current) => ({ ...(current ?? {}), connectionTransport: next }));
+    trackAnalyticsEvent('settings_change', { setting: 'connection_transport', value: next });
     if (!socket?.io?.opts) return;
     socket.io.opts.transports = next === 'polling' ? ['polling'] : ['websocket', 'polling'];
     socket.disconnect();
@@ -152,21 +154,30 @@ export default function SettingsPanel() {
     const raw = Number(event.target.value);
     const next = Number.isFinite(raw) ? Math.max(0, Math.min(1, raw)) : 0;
     saveAudioSettings((current) => ({ ...(current ?? {}), [key]: next }));
+    trackAnalyticsEventThrottled(
+      'settings_change',
+      { setting: key, value: next },
+      { key: `audio:${key}`, throttleMs: 3 * 1000 },
+    );
   };
 
   const handleMainBrushDuckEnabled = (event) => {
     const checked = Boolean(event.target.checked);
     saveAudioSettings((current) => ({ ...(current ?? {}), mainBrushDuckEnabled: checked }));
+    trackAnalyticsEvent('settings_change', { setting: 'mainBrushDuckEnabled', value: checked });
   };
 
   const handleSwapMobileControlColumns = (event) => {
     const checked = Boolean(event.target.checked);
     savePageSettings((current) => ({ ...(current ?? {}), swapMobileControlColumns: checked }));
+    trackAnalyticsEvent('mobile_controls_swap', { enabled: checked });
+    trackAnalyticsEvent('settings_change', { setting: 'swapMobileControlColumns', value: checked });
   };
 
   const handleDriveMacroBackoffEnabled = (event) => {
     const checked = Boolean(event.target.checked);
     savePageSettings((current) => ({ ...(current ?? {}), driveMacroBackoffEnabled: checked }));
+    trackAnalyticsEvent('settings_change', { setting: 'driveMacroBackoffEnabled', value: checked });
   };
 
   const handleVideoFilterChange = (event) => {
@@ -178,6 +189,7 @@ export default function SettingsPanel() {
       ...(current ?? {}),
       colorFilter: nextFilter,
     }));
+    trackAnalyticsEvent('settings_change', { setting: 'videoColorFilter', value: nextFilter });
   };
 
   return (