From 6ccc2246acf754940da998b5f3cd7b39b60f1860 Mon Sep 17 00:00:00 2001
From: Alex Yang <himself65@outlook.com>
Date: Mon, 3 Nov 2025 17:47:25 -0800
Subject: [PATCH] chore(demo): enable apple login (#5746)

---
 demo/nextjs/.env.example           |  2 ++
 demo/nextjs/components/sign-in.tsx | 24 ++++++++++++++++++++++++
 demo/nextjs/lib/auth.ts            |  4 ++++
 3 files changed, 30 insertions(+)

diff --git a/demo/nextjs/.env.example b/demo/nextjs/.env.example
index 8474dbd15c..e37756838b 100644
--- a/demo/nextjs/.env.example
+++ b/demo/nextjs/.env.example
@@ -4,6 +4,8 @@ BETTER_AUTH_URL=
 BETTER_AUTH_SECRET=
 TURSO_DATABASE_URL=
 TURSO_AUTH_TOKEN=
+APPLE_CLIENT_ID=
+APPLE_CLIENT_SECRET=
 GITHUB_CLIENT_ID=
 GITHUB_CLIENT_SECRET=
 RESEND_API_KEY=
diff --git a/demo/nextjs/components/sign-in.tsx b/demo/nextjs/components/sign-in.tsx
index c55fe96b9d..19f8de96dd 100644
--- a/demo/nextjs/components/sign-in.tsx
+++ b/demo/nextjs/components/sign-in.tsx
@@ -127,6 +127,30 @@ export default function SignIn() {
 							"justify-between flex-col",
 						)}
 					>
+						<Button
+							variant="outline"
+							className={cn("w-full gap-2 flex relative")}
+							onClick={async () => {
+								await signIn.social({
+									provider: "apple",
+									callbackURL: "/dashboard",
+								});
+							}}
+						>
+							<svg
+								xmlns="http://www.w3.org/2000/svg"
+								width="1em"
+								height="1em"
+								viewBox="0 0 24 24"
+							>
+								<path
+									fill="currentColor"
+									d="M17.05 20.28c-.98.95-2.05.8-3.08.35c-1.09-.46-2.09-.48-3.24 0c-1.44.62-2.2.44-3.06-.35C2.79 15.25 3.51 7.59 9.05 7.31c1.35.07 2.29.74 3.08.8c1.18-.24 2.31-.93 3.57-.84c1.51.12 2.65.72 3.4 1.8c-3.12 1.87-2.38 5.98.48 7.13c-.57 1.5-1.31 2.99-2.54 4.09zM12.03 7.25c-.15-2.23 1.66-4.07 3.74-4.25c.29 2.58-2.34 4.5-3.74 4.25"
+								></path>
+							</svg>
+							<span>Sign in with Apple</span>
+							{client.isLastUsedLoginMethod("apple") && <LastUsedIndicator />}
+						</Button>
 						<Button
 							variant="outline"
 							className={cn("w-full gap-2 flex relative")}
diff --git a/demo/nextjs/lib/auth.ts b/demo/nextjs/lib/auth.ts
index 65d27e4ab8..30ee1060de 100644
--- a/demo/nextjs/lib/auth.ts
+++ b/demo/nextjs/lib/auth.ts
@@ -106,6 +106,10 @@ export const auth = betterAuth({
 		},
 	},
 	socialProviders: {
+		apple: {
+			clientId: process.env.APPLE_CLIENT_ID || "",
+			clientSecret: process.env.APPLE_CLIENT_SECRET || "",
+		},
 		facebook: {
 			clientId: process.env.FACEBOOK_CLIENT_ID || "",
 			clientSecret: process.env.FACEBOOK_CLIENT_SECRET || "",