From 54876612b39811a807f6351831103d3fbdcaf327 Mon Sep 17 00:00:00 2001
From: Jason <farion1231@gmail.com>
Date: Thu, 26 Feb 2026 21:25:14 +0800
Subject: [PATCH] feat: show silent startup option only when launch on startup
 is enabled

Add conditional rendering with animated transition for the silent startup
toggle, so it only appears when the launch on startup option is checked.
---
 src/components/settings/WindowSettings.tsx | 27 ++++++++++++++++------
 1 file changed, 20 insertions(+), 7 deletions(-)

diff --git a/src/components/settings/WindowSettings.tsx b/src/components/settings/WindowSettings.tsx
index cc2cf0dfa..a2597aed9 100644
--- a/src/components/settings/WindowSettings.tsx
+++ b/src/components/settings/WindowSettings.tsx
@@ -2,6 +2,7 @@ import { useTranslation } from "react-i18next";
 import type { SettingsFormState } from "@/hooks/useSettings";
 import { AppWindow, MonitorUp, Power, EyeOff } from "lucide-react";
 import { ToggleRow } from "@/components/ui/toggle-row";
+import { AnimatePresence, motion } from "framer-motion";
 
 interface WindowSettingsProps {
   settings: SettingsFormState;
@@ -27,13 +28,25 @@ export function WindowSettings({ settings, onChange }: WindowSettingsProps) {
           onCheckedChange={(value) => onChange({ launchOnStartup: value })}
         />
 
-        <ToggleRow
-          icon={<EyeOff className="h-4 w-4 text-green-500" />}
-          title={t("settings.silentStartup")}
-          description={t("settings.silentStartupDescription")}
-          checked={!!settings.silentStartup}
-          onCheckedChange={(value) => onChange({ silentStartup: value })}
-        />
+        <AnimatePresence initial={false}>
+          {settings.launchOnStartup && (
+            <motion.div
+              key="silent-startup"
+              initial={{ opacity: 0, y: 10 }}
+              animate={{ opacity: 1, y: 0 }}
+              exit={{ opacity: 0, y: 10 }}
+              transition={{ duration: 0.3 }}
+            >
+              <ToggleRow
+                icon={<EyeOff className="h-4 w-4 text-green-500" />}
+                title={t("settings.silentStartup")}
+                description={t("settings.silentStartupDescription")}
+                checked={!!settings.silentStartup}
+                onCheckedChange={(value) => onChange({ silentStartup: value })}
+              />
+            </motion.div>
+          )}
+        </AnimatePresence>
 
         <ToggleRow
           icon={<MonitorUp className="h-4 w-4 text-purple-500" />}