Apple Native Sign In : { "__isAuthError": true, "name": "AuthApiError", "status": 400 }

[Agrit Tiwari]

Bug report

• I confirm this is a bug with Supabase, not with my own application.
• I confirm I have searched the Docs, GitHub Discussions, and Discord.

Describe the bug

IdentityToken is returned by Apple, but supabase.auth.signInwithIdToken breaks and returns the erro

To Reproduce

Steps to reproduce the behavior, please provide code snippets or a repository:

import * as AppleAuthentication from 'expo-apple-authentication';
import {
  Employee,
  GetLoggedInUserDocument,
  useRegisterUserMutation,
} from 'generated/hooks_and_more';
import { Platform } from 'react-native';
import { useMMKVObject, useMMKVString } from 'react-native-mmkv';
import { captureSentryException } from 'sentry_telemetry/sentryLogger';
import { supabase } from '~/utils/supabase';

export default function AppleSignIn() {
  const [accessToken, setAccessToken] = useMMKVString('access_token');
  const [refreshToken, setRefreshToken] = useMMKVString('refresh_token');
  const [mmkvUser, setMMKVUser] = useMMKVObject<Employee>('mmkv_user');
  const [registerUser, { data: userResponse, loading: registerLoading }] =
    useRegisterUserMutation();
  if (Platform.OS === 'ios')
    return (
      <AppleAuthentication.AppleAuthenticationButton
        buttonType={AppleAuthentication.AppleAuthenticationButtonType.SIGN_IN}
        buttonStyle={AppleAuthentication.AppleAuthenticationButtonStyle.BLACK}
        cornerRadius={5}
        style={{ width: 200, height: 64 }}
        onPress={async () => {
          try {
            const credential = await AppleAuthentication.signInAsync({
              requestedScopes: [
                AppleAuthentication.AppleAuthenticationScope.FULL_NAME,
                AppleAuthentication.AppleAuthenticationScope.EMAIL,
              ],
            });
            // Sign in via Supabase Auth.
            console.log(credential);
            if (credential.identityToken) {
              const {
                error,
                data: { user, session },
              } = await supabase.auth.signInWithIdToken({
                provider: 'apple',
                token: credential.identityToken,
              });
              console.log(JSON.stringify({ error, user }, null, 2));
              if (!error) {
                // User is signed in.
                setAccessToken(session?.access_token || '');
                setRefreshToken(session?.refresh_token || '');
                registerUser({
                  refetchQueries: [{ query: GetLoggedInUserDocument }],
                  onCompleted(data, clientOptions) {
                    setMMKVUser(data?.register);
                    //  setUser(data?.register);
                    //Not deprecating this, As it is used in push notifications and Select services as well.
                    console.log('on registerd in Native Apple Login', accessToken);
                    // user && getAccessToken() && navigation.replace('SetupYourOrganization');
                    // Toast.show('User Created Successfully', {
                    //   duration: Toast.durations.SHORT,
                    //   position: Toast.positions.BOTTOM,
                    //   textColor: 'white',
                    //   backgroundColor: colors?.dark?.green,
                    //   shadow: true,
                    //   animation: true,
                    //   hideOnPress: true,
                    //   delay: 0,
                    // });
                  },
                  onError(error, clientOptions) {
                    console.log('error', error);
                    captureSentryException('Error in creating new user', error as any);
                  },
                });
              }
            } else {
              throw new Error('No identityToken.');
            }
          } catch (e) {
            if (e.code === 'ERR_REQUEST_CANCELED') {
              // handle that the user canceled the sign-in flow
            } else {
              // handle other errors
            }
          }
        }}
      />
    );
  return <>{/* Implement Android Auth options. */}</>;
}

Expected behavior

Expected behavior is for supabase to generate the accessToken and refreshToken for the session

Screenshots

If applicable, add screenshots to help explain your problem.

System information

• OS: macOS
• Browser (if applies) [e.g. chrome, safari]
• Version of supabase-js: [e.g. 6.0.2]
• Version of Node.js: [e.g. 20.10.0]

Additional context

I am using Expo, went through every code snippet out there and this issue particularly #Issue1401

[Agrit Tiwari]

This ticket also related to this ticket #1561