fix: address CodeRabbit review comments

Author: g-k-s-03

frontend/src-tauri/src/main.rs

@@ -9,7 +9,6 @@ use tauri::path::BaseDirectory;
 use tauri::tray::{MouseButton, MouseButtonState, TrayIconBuilder, TrayIconEvent};
 use tauri::{Manager, Window, WindowEvent};
 use tauri_plugin_autostart::ManagerExt;
-use tauri_plugin_shell::ShellExt;
 
 const ENDPOINTS: [(&str, &str, &str); 2] = [
     (
@@ -137,6 +136,7 @@ fn prod(app: &tauri::AppHandle, resource_path: &std::path::Path) -> Result<(), S
     println!("Sync spawned with PID {}", sync_child.pid());
 
     use tauri_plugin_shell::process::CommandEvent;
+    use tauri_plugin_shell::ShellExt;
     tauri::async_runtime::spawn(async move {
         while let Some(event) = backend_rx.recv().await {
             match event {
@@ -240,9 +240,14 @@ fn main() {
             let menu = Menu::with_items(app, &[&show_item, &separator, &quit_item])?;
 
             TrayIconBuilder::new()
-                .icon(app.default_window_icon().unwrap().clone())
+                .icon(
+                    app.default_window_icon()
+                        .ok_or("no default window icon")?
+                        .clone(),
+                )
                 .tooltip("PictoPy")
                 .menu(&menu)
+                .menu_on_left_click(false)
                 .on_menu_event(|app, event| match event.id.as_ref() {
                     "show" => {
                         if let Some(w) = app.get_webview_window("main") {

frontend/src/pages/SettingsPage/components/SystemSettingsCard.tsx

@@ -4,26 +4,35 @@ import { invoke } from '@tauri-apps/api/core';
 import SettingsCard from './SettingsCard';
 
 const SystemSettingsCard: React.FC = () => {
-  const [autostart, setAutostart] = useState(false);
+  // null = unknown / error reading state
+  const [autostart, setAutostart] = useState<boolean | null>(null);
   const [loading, setLoading] = useState(true);
+  const [pending, setPending] = useState(false);
 
   useEffect(() => {
     invoke<boolean>('is_autostart_enabled')
       .then(setAutostart)
-      .catch(() => setAutostart(false))
+      .catch(() => setAutostart(null))
       .finally(() => setLoading(false));
   }, []);
 
   const handleToggle = async () => {
+    if (autostart === null) return;
     const next = !autostart;
+    setPending(true);
     try {
       await invoke(next ? 'enable_autostart' : 'disable_autostart');
       setAutostart(next);
     } catch (err) {
       console.error('Failed to toggle autostart:', err);
+    } finally {
+      setPending(false);
     }
   };
 
+  const isDisabled = loading || pending || autostart === null;
+  const isChecked = autostart === true;
+
   return (
     <SettingsCard
       icon={Monitor}
@@ -32,24 +41,28 @@ const SystemSettingsCard: React.FC = () => {
     >
       <div className="flex items-center justify-between py-1">
         <div>
-          <div className="font-medium">Launch at startup</div>
-          <div className="text-muted-foreground text-sm">
+          <div id="autostart-label" className="font-medium">
+            Launch at startup
+          </div>
+          <div id="autostart-desc" className="text-muted-foreground text-sm">
             Automatically start PictoPy when you log in. The window starts
             minimized to the system tray.
           </div>
         </div>
 
         <button
           role="switch"
-          aria-checked={autostart}
-          disabled={loading}
+          aria-checked={isChecked}
+          aria-labelledby="autostart-label"
+          aria-describedby="autostart-desc"
+          disabled={isDisabled}
           onClick={handleToggle}
           className={[
             'relative inline-flex h-6 w-11 shrink-0 cursor-pointer items-center rounded-full',
             'transition-colors duration-200 ease-in-out',
             'focus:outline-none focus-visible:ring-2 focus-visible:ring-offset-2',
             'disabled:cursor-not-allowed disabled:opacity-50',
-            autostart
+            isChecked
               ? 'bg-primary focus-visible:ring-primary'
               : 'bg-gray-200 focus-visible:ring-gray-500 dark:bg-gray-700',
           ].join(' ')}
@@ -58,7 +71,7 @@ const SystemSettingsCard: React.FC = () => {
             className={[
               'inline-block h-4 w-4 rounded-full bg-white shadow-md',
               'transition-transform duration-200 ease-in-out',
-              autostart ? 'translate-x-6' : 'translate-x-1',
+              isChecked ? 'translate-x-6' : 'translate-x-1',
             ].join(' ')}
           />
         </button>