1.0.0 • Published 6 months ago

identity-react-native v1.0.0

Weekly downloads
-
License
MIT
Repository
gitlab
Last release
6 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