> ## Documentation Index
> Fetch the complete documentation index at: https://www.dynamic.xyz/docs/llms.txt
> Use this file to discover all available pages before exploring further.

# Social Account Linking

> Link and unlink social accounts (Google, Apple, Twitter, etc.) on an authenticated user.

Once a user is signed in, you can let them attach additional social identities to the same account — and remove them later. This is separate from sign-in: see [Authenticate with Social](/javascript/authentication-methods/social) for the initial OAuth flow.

Enable Social Account Linking in the [dashboard](https://app.dynamic.xyz) under **Login & User Profile** before exposing this in your UI. Make sure each provider you offer is fully configured (client ID, secret, redirect URI).

## Listing linked accounts

`getUserSocialAccounts` returns the user's currently linked social credentials, derived from `user.verifiedCredentials` filtered to OAuth-format entries.

<Tabs>
  <Tab title="JavaScript">
    ```javascript theme={"system"}
    import { getUserSocialAccounts } from '@dynamic-labs-sdk/client';

    const accounts = getUserSocialAccounts();

    accounts.forEach((account) => {
      console.log(account.provider);             // e.g. 'google'
      console.log(account.displayName);          // optional
      console.log(account.emails);               // string[]
      console.log(account.verifiedCredentialId); // use to unlink
    });
    ```
  </Tab>

  <Tab title="React">
    `useGetUserSocialAccounts` re-renders when verified credentials change, so the list stays fresh without any manual wiring.

    ```tsx theme={"system"}
    import { useGetUserSocialAccounts } from '@dynamic-labs-sdk/react-hooks';

    function LinkedSocialList() {
      const { data: accounts = [] } = useGetUserSocialAccounts();

      return (
        <ul>
          {accounts.map((account) => (
            <li key={account.verifiedCredentialId}>
              {account.provider}: {account.displayName ?? account.emails[0]}
            </li>
          ))}
        </ul>
      );
    }
    ```
  </Tab>
</Tabs>

## Linking a new account

To attach an additional provider to a signed-in user, use the same `signInWithSocialRedirect` flow as sign-in. When called by an authenticated user, it adds the new credential rather than starting a new session.

```javascript theme={"system"}
import {
  signInWithSocialRedirect,
  detectSocialRedirectUrl,
  completeSocialRedirect,
  type SocialProvider,
} from '@dynamic-labs-sdk/client';

const linkProvider = async (provider: SocialProvider) => {
  await signInWithSocialRedirect({
    provider,
    redirectUrl: `${window.location.origin}/profile`,
  });
};

// On the redirect target page, complete the flow as usual:
const handleRedirect = async () => {
  const url = new URL(window.location.href);
  if (await detectSocialRedirectUrl({ url })) {
    await completeSocialRedirect({ url });
    // The new credential is now in user.verifiedCredentials.
  }
};
```

See [Authenticate with Social](/javascript/authentication-methods/social) for the complete OAuth round-trip.

## Unlinking an account

`unlinkSocialAccount` removes a single linked credential identified by `verifiedCredentialId` (read it from `getUserSocialAccounts`).

<Tabs>
  <Tab title="JavaScript">
    ```javascript theme={"system"}
    import { unlinkSocialAccount, getUserSocialAccounts } from '@dynamic-labs-sdk/client';

    const unlinkProvider = async (provider) => {
      const account = getUserSocialAccounts().find((a) => a.provider === provider);
      if (!account) return;

      await unlinkSocialAccount({
        verifiedCredentialId: account.verifiedCredentialId,
      });
    };
    ```
  </Tab>

  <Tab title="React">
    ```tsx theme={"system"}
    import { type SocialProvider } from '@dynamic-labs-sdk/client';
    import { useUnlinkSocialAccount, useGetUserSocialAccounts } from '@dynamic-labs-sdk/react-hooks';

    function UnlinkButton({ provider }: { provider: SocialProvider }) {
      const { data: accounts = [] } = useGetUserSocialAccounts();
      const { mutate: unlinkSocialAccount, isPending } = useUnlinkSocialAccount();

      const account = accounts.find((a) => a.provider === provider);
      if (!account) return null;

      return (
        <button
          onClick={() => unlinkSocialAccount({ verifiedCredentialId: account.verifiedCredentialId })}
          disabled={isPending}
        >
          {isPending ? 'Unlinking…' : `Unlink ${provider}`}
        </button>
      );
    }
    ```
  </Tab>
</Tabs>

## Supported providers

The `SocialProvider` type covers: `apple`, `discord`, `facebook`, `github`, `google`, `kraken`, `linkedin`, `microsoft`, `epicgames`, `steam`, `tiktok`, `twitch`, `twitter`.

Each provider must be enabled and configured in the dashboard. See the [social providers overview](/overview/social-providers/overview) for per-provider setup.

## Notes

* `getUserSocialAccounts` requires an authenticated user — it throws if `user` is `undefined`. Guard the call by checking `dynamicClient.user` (see [Check if signed in](/javascript/user-session-management#check-if-signed-in)) or `user` from React hooks first.
* Unlinking does **not** sign the user out, even when removing their original sign-in provider — provided they have at least one other credential (a wallet or another social account). The API returns a `VerifyResponse` updating the user's verified credentials.
* Linking a new account does not change the user's primary sign-in method. To change which credential the user authenticates with next time, see the [authentication methods overview](/javascript/authentication-methods/headless-authentication).

## Related functions

* [Authenticate with Social](/javascript/authentication-methods/social) — initial OAuth sign-in
* [Delete User Account](/javascript/reference/client/delete-user)