oAuth

Add oAuth provider

supastarter comes with two OAuth providers out of the box: GitHub and Google. The authentication is powered by Better Auth which supports a wide range of social providers.

You can find a list of all available providers in the Better Auth documentation.

As an example, we will add Facebook as an OAuth provider.

First go to the Facebook developer console and create a new app.

Add the credentials to your .env.local file:

FACEBOOK_CLIENT_ID=your-client-id
FACEBOOK_CLIENT_SECRET=your-client-secret

Then add the Facebook provider to the socialProviders configuration in packages/auth/auth.ts:

socialProviders: {
  google: {
    clientId: process.env.GOOGLE_CLIENT_ID as string,
    clientSecret: process.env.GOOGLE_CLIENT_SECRET as string,
    scope: ["email", "profile"],
  },
  github: {
    clientId: process.env.GITHUB_CLIENT_ID as string,
    clientSecret: process.env.GITHUB_CLIENT_SECRET as string,
    scope: ["user:email"],
  },
  facebook: {
    clientId: process.env.FACEBOOK_CLIENT_ID as string,
    clientSecret: process.env.FACEBOOK_CLIENT_SECRET as string,
    scope: ["email", "public_profile"],
  },
},

You also need to add Facebook to the trusted providers for account linking:

account: {
  accountLinking: {
    enabled: true,
    trustedProviders: ["google", "github", "facebook"],
  },
},

The last step is to add the Facebook button to the social sign-in buttons in your auth UI component in the apps/saas/modules/auth/ directory.

You can learn more about configuring social providers in the Better Auth documentation.