Skip to main content

Prerequisites

  • You need to have the Dynamic Client initialized (See this guide on how to do that).

Usage

import {
  completeSocialAuthentication,
  detectOAuthRedirect,
  type SocialProvider,
  authenticateWithSocial,
} from '@dynamic-labs-sdk/client';

// First, call authenticateWithSocial to redirect the user to the social provider's authorization page
// The redirectUrl should be the URL of your app that the user will be redirected to after they authenticate with the social provider
// It does not need to be a specific page, it can be the root URL of your app
const singInWithSocial = async (provider: SocialProvider) => {
  await authenticateWithSocial({
    provider,
    redirectUrl: 'https://your-app.com/callback',
  });
}

// Use the `detectOAuthRedirect` helper function when you app loads to check if the user is returning from the social provider's authorization page
// If the user is returning, use `completeSocialAuthentication` to complete the authentication process
const detectRedirect = async () => {
  const currentUrl = new URL(window.location.href);
  const isReturning = await detectOAuthRedirect({
    url: currentUrl,
  });

  if (isReturning) {
    await completeSocialAuthentication({
      url: currentUrl,
    });

    // User is now authenticated
  }
}

User data

When a user authenticates with a social provider, the user data is stored in the user object. If the social provider returns an email address, it will be added to the user’s emails list and can be used to authenticate with email.