feat: Add feature flag for scroll sensitivity settings (#245)

- Integrate feature flag for scroll sensitivity configuration
- Conditionally render scroll sensitivity settings based on app version
- Update useEffect to only fetch scroll sensitivity when feature flag is enabled

ui/src/routes/devices.$id.settings.mouse.tsx

@@ -10,6 +10,8 @@ import { useCallback, useEffect, useState } from "react";
 import { useJsonRpc } from "@/hooks/useJsonRpc";
 import { cx } from "../cva.config";
 import { SelectMenuBasic } from "../components/SelectMenuBasic";
+import { useFeatureFlag } from "../hooks/useFeatureFlag";
+import { FeatureFlag } from "../components/FeatureFlag";
 
 type ScrollSensitivity = "low" | "default" | "high";
 
@@ -21,6 +23,8 @@ export default function SettingsKeyboardMouseRoute() {
     state => state.setScrollSensitivity,
   );
 
+  const { isEnabled: isScrollSensitivityEnabled } = useFeatureFlag("0.3.8");
+
   const [jiggler, setJiggler] = useState(false);
 
   const [send] = useJsonRpc();
@@ -31,11 +35,13 @@ export default function SettingsKeyboardMouseRoute() {
       setJiggler(resp.result as boolean);
     });
 
-    send("getScrollSensitivity", {}, resp => {
+    if (isScrollSensitivityEnabled) {
-      if ("error" in resp) return;
+      send("getScrollSensitivity", {}, resp => {
-      setScrollSensitivity(resp.result as ScrollSensitivity);
+        if ("error" in resp) return;
-    });
+        setScrollSensitivity(resp.result as ScrollSensitivity);
-  }, [send, setScrollSensitivity]);
+      });
+    }
+  }, [isScrollSensitivityEnabled, send, setScrollSensitivity]);
 
   const handleJigglerChange = (enabled: boolean) => {
     send("setJigglerState", { enabled }, resp => {
@@ -82,25 +88,28 @@ export default function SettingsKeyboardMouseRoute() {
             onChange={e => setHideCursor(e.target.checked)}
           />
         </SettingsItem>
-        <SettingsItem
+
-          title="Scroll Sensitivity"
+        <FeatureFlag minAppVersion="0.3.8" name="Scroll Sensitivity">
-          description="Adjust the scroll sensitivity"
+          <SettingsItem
-        >
+            title="Scroll Sensitivity"
-          <SelectMenuBasic
+            description="Adjust the scroll sensitivity"
-            size="SM"
+          >
-            label=""
+            <SelectMenuBasic
-            fullWidth
+              size="SM"
-            value={scrollSensitivity}
+              label=""
-            onChange={onScrollSensitivityChange}
+              fullWidth
-            options={
+              value={scrollSensitivity}
-              [
+              onChange={onScrollSensitivityChange}
-                { label: "Low", value: "low" },
+              options={
-                { label: "Default", value: "default" },
+                [
-                { label: "High", value: "high" },
+                  { label: "Low", value: "low" },
-              ] as { label: string; value: ScrollSensitivity }[]
+                  { label: "Default", value: "default" },
-            }
+                  { label: "High", value: "high" },
-          />
+                ] as { label: string; value: ScrollSensitivity }[]
-        </SettingsItem>
+              }
+            />
+          </SettingsItem>
+        </FeatureFlag>
 
         <SettingsItem
           title="Jiggler"