fix: don't show error view when cancelling oauth (#1087)

This is an intentional action from the user and not an error. Instead,
just return to the main screen.

account-kit/react/package.json

@@ -70,6 +70,7 @@
     "@account-kit/core": "^4.4.0",
     "@account-kit/infra": "^4.4.0",
     "@account-kit/logging": "^4.4.0",
+    "@account-kit/signer": "^4.4.0",
     "@tanstack/react-form": "^0.33.0",
     "@tanstack/zod-form-adapter": "^0.33.0",
     "@wagmi/connectors": "^5.1.15",

account-kit/react/src/components/auth/card/loading/oauth.tsx

@@ -5,11 +5,13 @@ import { capitalize } from "../../../../utils.js";
 import { useAuthContext } from "../../context.js";
 import { useOAuthVerify } from "../../hooks/useOAuthVerify.js";
 import { ConnectionError } from "../error/connection-error.js";
+import { OauthCancelledError } from "@account-kit/signer";
 
 export const CompletingOAuth = () => {
   const { isConnected } = useSignerStatus();
   const { setAuthStep, authStep } = useAuthContext("oauth_completing");
   const { authenticate } = useOAuthVerify({ config: authStep.config });
+  const oauthWasCancelled = authStep.error instanceof OauthCancelledError;
 
   useEffect(() => {
     if (isConnected) {
@@ -18,10 +20,17 @@ export const CompletingOAuth = () => {
       } else {
         setAuthStep({ type: "complete" });
       }
+    } else if (oauthWasCancelled) {
+      setAuthStep({ type: "initial" });
     }
-  }, [authStep.createPasskeyAfter, isConnected, setAuthStep]);
+  }, [
+    authStep.createPasskeyAfter,
+    isConnected,
+    oauthWasCancelled,
+    setAuthStep,
+  ]);
 
-  if (authStep.error) {
+  if (authStep.error && !oauthWasCancelled) {
     return (
       <ConnectionError
         connectionType="oauth"