-
-
{session?.user.name || '—'}
+
+
+
+ setUserName(e.target.value)}
+ placeholder="Your name"
+ />
{session?.user.email || '—'}
+ {nameError && {nameError}
}
+ {nameSaved && (
+
+ Name saved
+
+ )}
+
+
+
diff --git a/components/auth/LoginForm.tsx b/components/auth/LoginForm.tsx
index e8500a8..553978c 100644
--- a/components/auth/LoginForm.tsx
+++ b/components/auth/LoginForm.tsx
@@ -11,6 +11,7 @@ import {
Camera,
AlertTriangle,
ChevronDown,
+ Loader2,
} from 'lucide-react';
const logo = '/logo.png';
@@ -52,6 +53,7 @@ export function LoginForm({ onSignUp, onForgotPassword }: Props) {
const [password, setPassword] = useState('');
const [error, setError] = useState('');
const [loading, setLoading] = useState(false);
+ const [appleLoading, setAppleLoading] = useState(false);
const [resendCooldown, setResendCooldown] = useState(0);
const [resendLoading, setResendLoading] = useState(false);
const aboutRef = useRef
(null);
@@ -90,7 +92,9 @@ export function LoginForm({ onSignUp, onForgotPassword }: Props) {
}
async function handleApple() {
- await signIn.social({ provider: 'apple', callbackURL: window.location.origin, errorCallbackURL: window.location.origin });
+ setAppleLoading(true);
+ const res = await signIn.social({ provider: 'apple', callbackURL: window.location.origin, errorCallbackURL: window.location.origin });
+ if (res?.error) setAppleLoading(false);
}
function scrollToAbout() {
@@ -212,11 +216,16 @@ export function LoginForm({ onSignUp, onForgotPassword }: Props) {
variant="outline"
className="w-full flex items-center gap-3"
onClick={handleApple}
+ disabled={appleLoading}
>
-
- Sign in with Apple
+ {appleLoading ? (
+
+ ) : (
+
+ )}
+ {appleLoading ? 'Signing in…' : 'Sign in with Apple'}
diff --git a/lib/auth-client.ts b/lib/auth-client.ts
index 0daea0f..51e8a43 100644
--- a/lib/auth-client.ts
+++ b/lib/auth-client.ts
@@ -9,6 +9,7 @@ export const {
signOut,
signUp,
useSession,
+ updateUser,
requestPasswordReset,
resetPassword,
sendVerificationEmail,