identity-react-native
v1.0.0
Published
Reclaim Identity React Native Client
Readme
Reclaim Identity for React Native
React Native authentication package for Reclaim Protocol. Handles OAuth 2.0, token management and user data.
Install
npm install identity-react-nativeUsage
Basic Setup
import getReclaimAuth from 'identity-react-native';
const auth = getReclaimAuth(
'your-client-id',
'your-client-secret',
'yourapp://callback'
);Component Example
import React, { useState, useEffect } from 'react';
import { View, Button } from 'react-native';
import getReclaimAuth from 'identity-react-native';
const auth = getReclaimAuth(
'your-client-id',
'your-client-secret',
'yourapp://callback'
);
export default function AuthScreen() {
const [user, setUser] = useState(auth.getCurrentUser());
useEffect(() => {
const unsubscribe = auth.onAuthStateChanged(setUser);
return unsubscribe;
}, []);
const handleSignIn = async () => {
try {
const currentUser = await auth.signIn();
console.log('User:', currentUser);
} catch (e) {
console.error('Sign in error:', e);
}
};
const handleSignOut = async () => {
try {
await auth.signOut();
} catch (err) {
console.error('Sign out error:', err);
}
};
return (
<View style={{ flex: 1, justifyContent: 'center', alignItems: 'center' }}>
<Text>User ID: {user ? JSON.stringify(user.id) : 'Not Signed In'}</Text>
<Text>User Data: {user ? JSON.stringify(user.userData) : 'Not Signed In'}</Text>
{!user && <Button title="Sign In" onPress={handleSignIn} /> }
{user && <Button title="Sign Out" onPress={handleSignOut} /> }
</View>
);
}Custom Hook
import { useState, useEffect } from 'react';
import getReclaimAuth from 'identity-react-native';
export function useReclaimAuth() {
const [user, setUser] = useState(null);
const auth = getReclaimAuth(clientId, clientSecret, redirectUri);
useEffect(() => {
return auth.onAuthStateChanged(setUser);
}, []);
return {
user,
signIn: () => auth.signIn(),
signOut: () => auth.signOut(),
getCurrentUser: () => auth.getCurrentUser()
};
}API
Methods
signIn(): Promise<ReclaimUser>signOut(): Promise<void>getCurrentUser(): ReclaimUser | nullonAuthStateChanged(callback: (user: ReclaimUser | null) => void): () => void
Types
interface ReclaimUser {
id: string;
userData: { [key: string]: string };
additionalData: { [key: string]: string }[];
}Requirements
- React Native 0.64.0+
- expo-web-browser
- expo-file-system
- Configured deep linking
Config
Required:
clientId: Reclaim Protocol app IDclientSecret: Reclaim Protocol app secretredirectUri: Deep link URI (e.g.myapp://callback)
Security
- State validation for CSRF protection
- Secure token storage
- In-app browser auth flow
