Files
supabase/examples/auth/expo-social-auth/components/social-auth-buttons/apple/expo-apple-sign-in-button.tsx
MDL 3139f85b5d docs(react-native): Expo cross-platform social sign-in with complete example (#38178)
* docs(react-native): create the basic expo project

* docs(react-native): cross-platform Apple social sign-in

* docs(react-native): cross-platform Google social sign-in

* docs(react-native): fix typos

* docs(react-native): remove wrong entry in the `Connection` component

* Correct typos

* Prettier

* Draft

* Draft

* docs(react-native): use kebab-case file naming convention in Expo guide

- use kebab-case file naming convention in Expo guide
- add trailing semicolon to align with the standard Expo template conventions

* docs(react-native): use kebab-case file naming convention in Expo social auth example

* docs(react-native): update the packages of the Expo social auth example

* Fix

* Draft

* Changes

* Correct log message

---------

Co-authored-by: Chris Chinchilla <chris.ward@supabase.io>
Co-authored-by: Chris Chinchilla <chris@chrischinchilla.com>
2025-09-19 16:53:35 +02:00

70 lines
2.1 KiB
TypeScript

import { supabase } from '@/lib/supabase';
import type { SignInWithIdTokenCredentials } from '@supabase/supabase-js';
import * as AppleAuthentication from 'expo-apple-authentication';
import { router } from 'expo-router';
import { Platform, StyleSheet } from 'react-native';
async function onAppleButtonPress() {
// Performs login request
try {
const appleAuthRequestResponse = await AppleAuthentication.signInAsync({
requestedScopes: [
AppleAuthentication.AppleAuthenticationScope.FULL_NAME,
AppleAuthentication.AppleAuthenticationScope.EMAIL,
],
});
console.log('Apple sign in successful:', { appleAuthRequestResponse })
if (appleAuthRequestResponse.identityToken && appleAuthRequestResponse.authorizationCode) {
const signInWithIdTokenCredentials: SignInWithIdTokenCredentials = {
provider: 'apple',
token: appleAuthRequestResponse.identityToken,
access_token: appleAuthRequestResponse.authorizationCode,
}
const { data, error } = await supabase.auth.signInWithIdToken(signInWithIdTokenCredentials)
if (error) {
console.error('Error signing in with Apple:', error)
}
if (data) {
console.log('Apple sign in successful:', data)
router.navigate('/(tabs)/explore')
}
}
} catch (e: any) {
if (e.code === 'ERR_REQUEST_CANCELED') {
console.error('Error signing in with Apple:', e)
} else {
console.error('Error signing in with Apple:', e)
}
}
}
export default function ExpoAppleSignInButton() {
if (Platform.OS !== 'ios') { return <></> }
return <AppleAuthentication.AppleAuthenticationButton
buttonType={AppleAuthentication.AppleAuthenticationButtonType.SIGN_IN}
buttonStyle={AppleAuthentication.AppleAuthenticationButtonStyle.BLACK}
cornerRadius={5}
style={styles.button}
onPress={() => onAppleButtonPress()}
/>
}
const styles = StyleSheet.create({
container: {
flex: 1,
alignItems: 'center',
justifyContent: 'center',
},
button: {
width: 160, height: 45
},
});