1.0.0 • Published 10 months ago

identity-react-native v1.0.0

Weekly downloads
-
License
MIT
Repository
gitlab
Last release
10 months ago

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-native

Usage

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 | null
  • onAuthStateChanged(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 ID
  • clientSecret: Reclaim Protocol app secret
  • redirectUri: Deep link URI (e.g. myapp://callback)

Security

  • State validation for CSRF protection
  • Secure token storage
  • In-app browser auth flow