Last Login Method

The last-login-method integration floats a compact "Last" indicator over the matching username, email, or social sign-in control. It reads the method after hydration, so server-rendered auth pages do not produce a hydration mismatch.

Setup

import { betterAuth } from "better-auth"
import { lastLoginMethod } from "better-auth/plugins"

export const auth = betterAuth({
  // ...
  plugins: [
    lastLoginMethod() 
  ]
})

import { createAuthClient } from "better-auth/react"
import { lastLoginMethodClient } from "better-auth/client/plugins"

export const authClient = createAuthClient({
  plugins: [
    lastLoginMethodClient() 
  ]
})

bunx --bun shadcn@latest add https://better-auth-ui.com/r/last-login-method.json

import { lastLoginMethodPlugin } from "@/lib/auth/last-login-method-plugin"

<AuthProvider
  authClient={authClient}
  navigate={navigate}
  plugins={[
    lastLoginMethodPlugin() 
  ]}
>
  {children}
</AuthProvider>

The sign-in view now marks the username or email control, or the matching social provider, when Better Auth has stored a previous method. Sign-up controls do not show the indicator.

Localization

Override the full and compact labels through the UI plugin:

lastLoginMethodPlugin({
  localization: {
    lastUsed: "Previously used",
    lastUsedShort: "Previous"
  }
})

Custom methods

Better Auth tracks email and social providers by default. If customResolveMethod stores another method, place the copied <LastUsedBadge /> beside its sign-in control:

import { LastUsedBadge } from "@/components/auth/last-login-method/last-used-badge"

<LastUsedBadge method="magic-link" />

Pass an array when one control represents more than one stored method:

<LastUsedBadge method={["email", "username"]} />

Cookie consent

Whether the plugin's browser-readable cookie is non-essential and requires consent depends on your jurisdiction and how your application uses it. Consult qualified legal counsel for guidance. When consent is required, configure Better Auth's beforeStoreCookie option to return a stored user-consent flag or an equivalent condition. Authentication still works when the hook returns false.