StytchB2B prebuilt ui not showing SSO button in Next.js

Questions
1

I’ve added the StytchB2B component from @stytch/nextjs/b2b with the following config

config: {
    authFlowType: AuthFlowType.Organization,
    products: [B2BProducts.sso, B2BProducts.oauth],
    oauthOptions: {
      discoveryRedirectURL: REDIRECT_URL,
      providers: ['google', 'microsoft']
    },
    ssoOptions: {
      loginRedirectURL: REDIRECT_URL,
      signupRedirectURL: REDIRECT_URL
    },
  },

Following is a screenshot of the rendered UI, which isn’t rendering the SSO button. I’m probably missing something. Any help would be appreciated.

image

2

Hey Joseito – thanks for posting!

It looks like the UI component might not be correctly identifying the Organization that you’re launching the authentication flow for. Because of that, it may not be showing the SSO button because it can’t identify which SSO connection(s) to use.

Is your Organization slug value present in the URL where you’re launching the UI component (for example, https://yourdomain.com/auth/exampleslug)? If so, did you add an Organization URL template to the Frontend SDKs tab in the Stytch Dashboard?

For some additional information about this, I’d recommend checking out our Organization flow UI components guide.

Please let me know if you have additional questions, or if the above doesn’t seem to address the issue, and I’ll be happy to follow up!