docs: missing linking to external accounts (oauth) in custom flow

[saidbenmoumen]

So i have looked all over the documentations it lacks a lot in terms of custom flow if someone wants to integrate their own UI & Flow. Most can be mitigated somehow with the current docs but the external accounts oauth (facebook, google, ...) linking after being signed up.

i had to go deep into @clerk's type definitions in node_modules to find that out.. and.. that's not very developer friendly.

here's a basic implementation..

getting current external accounts linked:

const { session } = useSession()
const externalAccounts = session?.user.externalAccounts

triggers the link to a new external account

  async function handleLink(id: OAuthProvider) {
    const newExternalAccount =
      await session?.user.createExternalAccount({
        strategy: `oauth_${id}`,
        redirectUrl: 'path_to_be_redirect_to', // you can use current path or what works for you
      })

    if (newExternalAccount) handleVerify(newExternalAccount)
  }

triggers verification of linked external account

  async function handleVerify(account: ExternalAccountResource) {
    const verificationURL =
      account.verification?.externalVerificationRedirectURL
    if (verificationURL) router.push(verificationURL.href)
  }

handles unlinking

  async function handleUnlink(account: ExternalAccountResource) {
    await account.destroy()
  }

external account status

you can check for what buttons/handlers to show/use when looping through externalAccounts.map((account) => ...) defined eariler with account.verification?.status

hope this gets fixed in the documentation, even a paragraph would be better than nothing :)