chore(core): add oauth connecting state (#6225)

toeverything · Mar 23, 2024 · 6c9db36 · 6c9db36
1 parent a1532d4
commit 6c9db36
Showing 1 changed file with 4 additions and 1 deletion.
diff --git a/packages/frontend/core/src/components/affine/auth/oauth.tsx b/packages/frontend/core/src/components/affine/auth/oauth.tsx
@@ -5,7 +5,7 @@ import {
 } from '@affine/core/hooks/affine/use-server-config';
 import { OAuthProviderType } from '@affine/graphql';
 import { GithubIcon, GoogleDuotoneIcon } from '@blocksuite/icons';
-import { type ReactElement, useCallback } from 'react';
+import { type ReactElement, useCallback, useState } from 'react';
 
 import { useAuth } from './use-auth';
 
@@ -45,8 +45,10 @@ function OAuthProviders() {
 function OAuthProvider({ provider }: { provider: OAuthProviderType }) {
   const { icon } = OAuthProviderMap[provider];
   const { oauthSignIn } = useAuth();
+  const [isConnecting, setIsConnecting] = useState(false);
 
   const onClick = useCallback(() => {
+    setIsConnecting(true);
     oauthSignIn(provider);
   }, [provider, oauthSignIn]);
 
@@ -61,6 +63,7 @@ function OAuthProvider({ provider }: { provider: OAuthProviderType }) {
       onClick={onClick}
     >
       Continue with {provider}
+      {isConnecting && '...'}
     </Button>
   );
 }