diff --git a/examples/nextjs-example/.env.example b/examples/nextjs-example/.env.exmaple similarity index 87% rename from examples/nextjs-example/.env.example rename to examples/nextjs-example/.env.exmaple index cc4427a21b..4c18dc2e65 100644 --- a/examples/nextjs-example/.env.example +++ b/examples/nextjs-example/.env.exmaple @@ -2,8 +2,6 @@ GOOGLE_CLIENT_SECRET= GOOGLE_CLIENT_ID= BETTER_AUTH_URL="http://localhost:3000" BETTER_AUTH_SECRET= -TURSO_DATABASE_URL= -TURSO_AUTH_TOKEN= GITHUB_CLIENT_ID= GITHUB_CLIENT_SECRET= RESEND_API_KEY= diff --git a/examples/nextjs-example/app/dashboard/page.tsx b/examples/nextjs-example/app/dashboard/page.tsx index d94dbb5ae1..d97959ae7e 100644 --- a/examples/nextjs-example/app/dashboard/page.tsx +++ b/examples/nextjs-example/app/dashboard/page.tsx @@ -3,21 +3,28 @@ import { headers } from "next/headers"; import { redirect } from "next/navigation"; import UserCard from "./user-card"; import { OrganizationCard } from "./organization-card"; +import AccountSwitcher from "@/components/account-swtich"; export default async function DashboardPage() { - const [session, activeSessions] = await Promise.all([ + const [session, activeSessions, deviceSessions] = await Promise.all([ auth.api.getSession({ headers: await headers(), }), auth.api.listSessions({ headers: await headers(), }), + auth.api.listDeviceSessions({ + headers: await headers(), + }), ]).catch((e) => { throw redirect("/sign-in"); }); return (
+ { + return; + }, + }); + const { data: currentUser } = useSession(); + const [open, setOpen] = useState(false); + + const handleUserSelect = (user: Session) => { + // setCurrentUser(user); + setOpen(false); + }; + + const handleAddAccount = () => { + // Implement add account logic here + console.log("Add account clicked"); + setOpen(false); + }; + const router = useRouter(); + return ( + + + + + + + + + {}} + className="text-sm w-full justify-between" + key={currentUser?.user.id} + > +
+ + + + {currentUser?.user.name.charAt(0)} + + + {currentUser?.user.name} +
+
+
+ + + {sessions + .filter((s) => s.user.id !== currentUser?.user.id) + .map((u, i) => ( + { + await client.multiSession.setActive({ + sessionId: u.session.id, + }); + setOpen(false); + }} + className="text-sm" + > + + + {u.user.name.charAt(0)} + +
+
+

{u.user.name}

+

({u.user.email})

+
+
+
+ ))} +
+
+ + + + { + router.push("/sign-in"); + setOpen(false); + }} + className="cursor-pointer text-sm" + > + + Add Account + + + +
+
+
+ ); +} diff --git a/examples/nextjs-example/components/sign-in.tsx b/examples/nextjs-example/components/sign-in.tsx index 599703a251..ebbf1286c9 100644 --- a/examples/nextjs-example/components/sign-in.tsx +++ b/examples/nextjs-example/components/sign-in.tsx @@ -15,7 +15,7 @@ import { Label } from "@/components/ui/label"; import { PasswordInput } from "@/components/ui/password-input"; import { signIn } from "@/lib/auth-client"; import { DiscordLogoIcon, GitHubLogoIcon } from "@radix-ui/react-icons"; -import { Key, Loader2 } from "lucide-react"; +import { Key, Loader2, TwitchIcon } from "lucide-react"; import Link from "next/link"; import { useRouter } from "next/navigation"; import { useState } from "react"; @@ -124,12 +124,33 @@ export default function SignIn() { onClick={async () => { await signIn.social({ provider: "discord", - callbackURL: "/dashboard", }); }} > +