fix: improve Tailscale error handling in UI components and refine backend state mapping

server/service/extensions/tailscale/service.go

@@ -20,11 +20,13 @@ const (
 )
 
 var StateMap = map[string]proto.TailscaleState{
-	"NoState":    proto.TailscaleNotRunning,
-	"Starting":   proto.TailscaleNotRunning,
-	"NeedsLogin": proto.TailscaleNotLogin,
-	"Running":    proto.TailscaleRunning,
-	"Stopped":    proto.TailscaleStopped,
+	"NoState":          proto.TailscaleNotRunning,
+	"Starting":         proto.TailscaleNotRunning,
+	"NeedsLogin":       proto.TailscaleNotLogin,
+	"NeedsMachineAuth": proto.TailscaleNotLogin,
+	"InUseOtherUser":   proto.TailscaleNotLogin,
+	"Running":          proto.TailscaleRunning,
+	"Stopped":          proto.TailscaleStopped,
 }
 
 func NewService() *Service {

web/src/pages/desktop/menu/settings/tailscale/device.tsx

@@ -55,6 +55,9 @@ export const Device = ({ status, onLogout }: DeviceProps) => {
 
         onLogout();
       })
+      .catch((err) => {
+        setErrMsg(err?.message || 'Failed to logout');
+      })
       .finally(() => {
         setIsLogging(false);
       });

web/src/pages/desktop/menu/settings/tailscale/index.tsx

@@ -41,6 +41,9 @@ export const Tailscale = ({ setIsLocked }: TailscaleProps) => {
 
         setStatus(rsp.data);
       })
+      .catch((err) => {
+        setErrMsg(err?.message || 'Failed to get status');
+      })
       .finally(() => {
         setIsLoading(false);
       });

web/src/pages/desktop/menu/settings/tailscale/install.tsx

@@ -29,9 +29,12 @@ export const Install = ({ setIsLocked, onSuccess }: InstallProps) => {
         }
 
         onSuccess();
+        setState('');
+      })
+      .catch(() => {
+        setState('failed');
       })
       .finally(() => {
-        setState('');
         setIsLocked(false);
       });
   }

web/src/pages/desktop/menu/settings/tailscale/login.tsx

@@ -38,6 +38,9 @@ export const Login = ({ onSuccess }: LoginProps) => {
         window.open(url, '_blank');
         setTimeout(() => setLoginUrl(''), 10 * 60 * 1000);
       })
+      .catch((err) => {
+        setErrMsg(err?.message || 'Failed to login');
+      })
       .finally(() => {
         setIsLoading(false);
       });

web/src/pages/desktop/menu/settings/tailscale/run.tsx

@@ -29,6 +29,9 @@ export const Run = ({ onSuccess }: RunProps) => {
 
         onSuccess();
       })
+      .catch((err) => {
+        setErrMsg(err?.message || 'Failed to run tailscale');
+      })
       .finally(() => {
         setIsLoading(false);
       });

web/src/pages/desktop/menu/settings/tailscale/uninstall.tsx

@@ -45,6 +45,7 @@ export const Uninstall = ({ onSuccess }: UninstallProps) => {
       <Modal
         title={title}
         open={isModalOpen}
+        centered={true}
         okType="danger"
         okText={t('settings.tailscale.okBtn')}
         cancelText={t('settings.tailscale.cancelBtn')}