From 84ca1f93e147042c11522c3e143fbaa2fa08c214 Mon Sep 17 00:00:00 2001
From: jtgi <j@jtgi.me>
Date: Fri, 26 Jul 2024 14:20:58 +0900
Subject: [PATCH] fix: login does not poll for status callback

---
 .../auth-kit/src/components/ActionButton/ActionButton.tsx   | 4 +++-
 .../auth-kit/src/components/SignInButton/SignInButton.tsx   | 2 +-
 packages/auth-kit/src/components/styles.css.ts              | 6 ++++++
 3 files changed, 10 insertions(+), 2 deletions(-)

diff --git a/packages/auth-kit/src/components/ActionButton/ActionButton.tsx b/packages/auth-kit/src/components/ActionButton/ActionButton.tsx
index e706978..48cac2e 100644
--- a/packages/auth-kit/src/components/ActionButton/ActionButton.tsx
+++ b/packages/auth-kit/src/components/ActionButton/ActionButton.tsx
@@ -4,12 +4,14 @@ import { Button } from "../Button.tsx";
 export function ActionButton({
   label,
   onClick,
+  initializing
 }: {
   label: string;
   onClick: () => void;
+  initializing: boolean;
 }) {
   return (
-    <Button kind="primary" onClick={onClick}>
+    <Button kind="primary" onClick={onClick} disabled={initializing}>
       <FarcasterLogo height={20} fill="white" />
       <span style={{ marginLeft: 9 }}>{label}</span>
     </Button>
diff --git a/packages/auth-kit/src/components/SignInButton/SignInButton.tsx b/packages/auth-kit/src/components/SignInButton/SignInButton.tsx
index fb62de0..d2e0213 100644
--- a/packages/auth-kit/src/components/SignInButton/SignInButton.tsx
+++ b/packages/auth-kit/src/components/SignInButton/SignInButton.tsx
@@ -103,7 +103,7 @@ export function SignInButton({
         />
       ) : (
         <>
-          <ActionButton onClick={onClick} label="Sign in" />
+          <ActionButton initializing={!url} onClick={onClick} label={'Sign in' }/>
           {url && (
             <QRCodeDialog
               open={showDialog && !isMobile()}
diff --git a/packages/auth-kit/src/components/styles.css.ts b/packages/auth-kit/src/components/styles.css.ts
index bbb6b55..39d6b16 100644
--- a/packages/auth-kit/src/components/styles.css.ts
+++ b/packages/auth-kit/src/components/styles.css.ts
@@ -36,6 +36,12 @@ export const button = {
   fontWeight: 600,
   display: "flex",
   alignItems: "center",
+
+  ":disabled": {
+    cursor: "not-allowed",
+    opacity: 0.75,
+  },
+  transition: "opacity 0.2s",
 };
 
 export const resetButton = style({