feat: Enhance protocol status handling and repair functionality in About and SSOLogin components

src/app/pages/auth/SSOLogin.tsx

@@ -1,7 +1,8 @@
 import { Avatar, AvatarImage, Box, Button, Text } from 'folds';
 import { IIdentityProvider, SSOAction, createClient } from 'matrix-js-sdk';
-import React, { useMemo } from 'react';
+import React, { useCallback, useMemo, useState } from 'react';
 import { useAutoDiscoveryInfo } from '../../hooks/useAutoDiscoveryInfo';
+import { openExternalUrl } from '../../utils/tauri';
 
 type SSOLoginProps = {
   providers?: IIdentityProvider[];
@@ -13,12 +14,39 @@ export function SSOLogin({ providers, redirectUrl, action, saveScreenSpace }: SS
   const discovery = useAutoDiscoveryInfo();
   const baseUrl = discovery['m.homeserver'].base_url;
   const mx = useMemo(() => createClient({ baseUrl }), [baseUrl]);
+  const [launchingProviderId, setLaunchingProviderId] = useState<string | null>(null);
 
   const getSSOIdUrl = (ssoId?: string): string => {
     const existingDeviceId = localStorage.getItem('cinny_device_id') ?? undefined;
     return mx.getSsoLoginUrl(redirectUrl, 'sso', ssoId, action, existingDeviceId);
   };
 
+  const handleContinue = useCallback(
+    async (providerId?: string) => {
+      if (launchingProviderId) {
+        return;
+      }
+
+      const currentProviderId = providerId ?? '__default__';
+      setLaunchingProviderId(currentProviderId);
+
+      try {
+        if (window.electron?.protocol?.repair) {
+          await window.electron.protocol.repair();
+        }
+      } catch (error) {
+        console.warn('[SSOLogin] Protocol repair failed before SSO launch:', error);
+      }
+
+      try {
+        await openExternalUrl(getSSOIdUrl(providerId));
+      } finally {
+        setLaunchingProviderId(null);
+      }
+    },
+    [getSSOIdUrl, launchingProviderId]
+  );
+
   const withoutIcon = providers
     ? providers.find(
         (provider) => !provider.icon || !mx.mxcUrlToHttp(provider.icon, 96, 96, 'crop', false)
@@ -41,11 +69,13 @@ export function SSOLogin({ providers, redirectUrl, action, saveScreenSpace }: SS
               <Avatar
                 style={{ cursor: 'pointer' }}
                 key={id}
-                as="a"
-                href={getSSOIdUrl(id)}
+                as="button"
                 aria-label={buttonTitle}
                 size="300"
                 radii="300"
+                onClick={() => {
+                  handleContinue(id);
+                }}
               >
                 <AvatarImage src={iconUrl!} alt={name} title={buttonTitle} />
               </Avatar>
@@ -56,12 +86,14 @@ export function SSOLogin({ providers, redirectUrl, action, saveScreenSpace }: SS
             <Button
               style={{ width: '100%' }}
               key={id}
-              as="a"
-              href={getSSOIdUrl(id)}
               size="500"
               variant="Secondary"
               fill="Soft"
               outlined
+              disabled={Boolean(launchingProviderId)}
+              onClick={() => {
+                handleContinue(id);
+              }}
               before={
                 iconUrl && (
                   <Avatar size="200" radii="300">
@@ -79,12 +111,14 @@ export function SSOLogin({ providers, redirectUrl, action, saveScreenSpace }: SS
       ) : (
         <Button
           style={{ width: '100%' }}
-          as="a"
-          href={getSSOIdUrl()}
           size="500"
           variant="Secondary"
           fill="Soft"
           outlined
+          disabled={Boolean(launchingProviderId)}
+          onClick={() => {
+            handleContinue();
+          }}
         >
           <Text align="Center" size="B500" truncate>
             Continue with SSO