# Implement social sign in using OIDC: Apple

Source: https://dev.arcxp.com/subscriptions/identity/build/implement-social-sign-in-oidc-apple/

Add Sign in with Apple to your Arc XP site using the OIDC protocol, including the button component and redirect handler.

To integrate your Apple app account with multiple applications (Web, Mobile, or Desktop) or a single application, you can utilize the Apple OIDC Authentication Provider on the Arc XP platform.

> **Note:**
> 
> Before you start, see [Configure third-party authentication providers, Facebook, Google, Apple, and OIDC](https://dev.arcxp.com/subscriptions/identity/configure/third-party-authentication-providers-facebook-google-apple/#oidc). This documentation provides a comprehensive guide on configuring Sign In with Apple using the OIDC protocol.

If you are using our Arc XP Identity blocks, see [Arc XP Identity Themes Blocks Configuration & Customization Deep Dive](https://dev.arcxp.com/subscriptions/identity/configure/arc-xp-identity-themes-blocks-configuration-customization-deep-dive/#identity-social-sign-on--arc-block). We provide a prebuilt Theme Block that can be used to display the Apple Sign-In button and connect to the Authentication Provider. If you need to build this on your own, consider the following explanation and code.

## Create Apple Sign In Button

After setting up, create an Apple Sign In button on your website for users to sign in with their Apple ID. Utilize our Identity SDKs to implement the Apple Sign In functionality.

```jsx
export default function AppleSignInButton() {
  return (
    <button
      onClick={async () => {
        // Args: clientId, scopes, usePopup, usePKCE
        await Identity.initiateOIDC(clientId, ['name', 'email'], true, true);
      }}
    >
      Sign in with Apple
    </button>
  );
}
```

 );}">

> **Caution:**
> 
> Apple only returns the user’s name on the **first** authorization for a given Apple ID. On subsequent sign-ins the `name` scope will come back empty — capture and persist it during the first sign-in rather than re-requesting it later.

## Apple Sign In Redirect and Login

Once the user signs in with Apple and is redirected to the specified page under the Redirect URI configured in our Authentication Provider, they need to be logged in using Arc XP Identity. Below is an example code snippet for reference.

The following example uses `react-router` v6 (`useSearchParams` / `useNavigate`). Adapt to your router as needed.

```jsx
import { useEffect } from 'react';
import { useSearchParams, useNavigate } from 'react-router-dom';

export const AppleRedirectAndLogin = () => {
  const [searchParams] = useSearchParams();
  const navigate = useNavigate();
  const code = searchParams.get('code');
  const state = searchParams.get('state');

  useEffect(() => {
    // Verify `state` matches the value you stored before calling initiateOIDC
    // to protect against CSRF before exchanging the code.
    Identity.signInWithOIDC(code, state)
      .then(() => navigate('/profile'))
      .catch((err) => {
        console.error('Apple sign-in failed', err);
      });
  }, [code, state, navigate]);

  return <h3>Redirecting...</h3>;
};
```

You should now be set up to use Apple Sign In using the OIDC protocol.