Profile Component

Full-featured profile management UI with tabs for profile details and security settings.

Overview

The Profile component is a ready-to-use, customizable profile page that includes user profile information display, email verification status, security settings with MFA management, customizable branding, and loading/error states. Fetch branding data server-side for optimal performance.

Basic Usage

import { Profile } from 'authsafe-nextjs';
import { getBranding } from 'authsafe-nextjs/server';

export default async function ProfilePage() {
  const branding = await getBranding(
    process.env.NEXT_PUBLIC_AUTHSAFE_CLIENT_ID
  );

  return <Profile branding={branding} />;
}