feat: add acknowledgment checkbox for version changes in advanced settings

Author: adamshiervani

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

@@ -31,6 +31,7 @@ export default function SettingsAdvancedRoute() {
   const [appVersion, setAppVersion] = useState<string>("");
   const [systemVersion, setSystemVersion] = useState<string>("");
   const [resetConfig, setResetConfig] = useState(false);
+  const [versionChangeAcknowledged, setVersionChangeAcknowledged] = useState(false);
 
   const settings = useSettingsStore();
 
@@ -354,7 +355,15 @@ export default function SettingsAdvancedRoute() {
                   checked={resetConfig}
                   onChange={e => setResetConfig(e.target.checked)}
                 />
-                </div>
+              </div>
+
+              <div>
+                <CheckboxWithLabel
+                  label="I understand version changes may break my device and require factory reset"
+                  checked={versionChangeAcknowledged}
+                  onChange={e => setVersionChangeAcknowledged(e.target.checked)}
+                />
+              </div>
 
               <Button
                 size="SM"
@@ -363,7 +372,8 @@ export default function SettingsAdvancedRoute() {
                 disabled={
                   (updateTarget === "app" && !appVersion) ||
                   (updateTarget === "system" && !systemVersion) ||
-                  (updateTarget === "both" && (!appVersion || !systemVersion))
+                  (updateTarget === "both" && (!appVersion || !systemVersion)) ||
+                  !versionChangeAcknowledged
                 }
                 onClick={handleVersionUpdate}
               />