SSO
Install an email-first sign-in view with organization SSO discovery and fallback methods.
The SSO registry item installs a sign-in view that discovers organization SSO from an email address. It redirects to the identity provider when one exists. Otherwise, it shows password, magic-link, email-OTP, and other registered sign-in methods.
Setup
Configure Better Auth
Install @better-auth/sso, add sso() to the server, add ssoClient() to the client, and apply the plugin schema. See the Better Auth SSO guide for provider setup.
import { betterAuth } from "better-auth"
import { sso } from "@better-auth/sso"
export const auth = betterAuth({
plugins: [sso()]
})import { ssoClient } from "@better-auth/sso/client"
import { createAuthClient } from "better-auth/react"
export const authClient = createAuthClient({
plugins: [ssoClient()]
})Install the registry item
npx shadcn@latest add @better-auth-ui/ssoThis installs EmailFirstSignIn and the local ssoPlugin() factory.
Register the UI plugin
Place ssoPlugin() before another plugin that replaces the sign-in view.
import { ssoPlugin } from "@/lib/auth/sso-plugin"
<AuthProvider
authClient={authClient}
navigate={navigate}
plugins={[ssoPlugin(), magicLinkPlugin(), emailOtpPlugin()]}
>
{children}
</AuthProvider>The flow stores the submitted email in session storage. The installed magic-link and email-OTP views use it as their initial email.
Last updated on