typescript
// SignupForm.tsx
const SignupForm: React.FC = () => {
  // ...
  const onThirdPartySignup = async (providerId: string) => {
    const authUrl = await getAuthorisationURLWithQueryParamsAndSetState({
      providerId,
      authorisationURL: `${process.env.NEXT_PUBLIC_APP_URL}/auth/callback/google`,
      userContext: { test: 'abc', signup: true },
    })
    router.push(authUrl)
  }
  // ...
}

// frontendConfig.ts

frontendConfig = () => {
  return {
    appInfo,
    recipeList: [
  
        ThirdPartyEmailPasswordReact.init({
        onHandleEvent: async (context) => {
          console.log(JSON.stringify(context, null, 2))
        },
        getRedirectionURL: async (context) => {
          console.log(JSON.stringify(context, null, 2))
          return '/register'
        },
        signInAndUpFeature: {
          providers: [
            ThirdPartyEmailPasswordReact.Google.init(),
          ],
        },
      }),
      SessionReact.init(),
    ],
    // this is so that the SDK uses the next router for navigation
    windowHandler: (oI) => {
      return {
        ...oI,
        location: {
          ...oI.location,
          setHref: (href) => {
            Router.push(href)
          },
        },
      }
    },
  }
}

getRedirectionURL

getAuthorisationURLWithQueryParamsAndSetState