Reclaim Connect

Reclaim Connect enables applications to request data from users without writing any complex code themselves.

Integrate Reclaim Connect in Your Front End

Reclaim Connect exposes a set of React components that can be integrated into your front end application. It is available as an NPM package. To install it, run the following command in your project directory:

npm install @reclaimprotocol/reclaim-connect-react

GenerateProof Component

The GenerateProof component enables you to request data from users. It renders a button that, when clicked, opens a modal with a QR code. Users can scan the QR code with the Reclaim mobile app to submit the requested data. The component also provides a callback function that you can use to execute logic when the proof is successfully submitted.

To use the GenerateProof component, follow these steps:

import { GenerateProof } from '@reclaimprotocol/reclaim-connect-react';

import React, { type ReactNode } from 'react';
import { GenerateProof } from '@reclaimprotocol/reclaim-connect-react';
 
function App (): ReactNode {
  return (
    <GenerateProof
      appID='6d6c04eb-237b-4599-8797-94d48b0ac612'
      userID='dasq2easdase-asdq2e3' //optional
      onProofSubmission={(proofs, sessionId) => {}}
      onProofSubmissionFailed={() => {}}
    />
  );
}
 
export default App;

Props

customize = {{ 
  triggerButton: { 
    text: 'Click here', 
    style: { 
     // CSS style (key value pair)  
    } 
  },
  modalHeader: { 
    text: 'SCAN the QR to submit proof', 
    style: {
     // CSS style (key value pair)
    } 
  },
  proofSubmissionDetails: { 
    successText: 'Success', 
    failureText: 'Failed', 
    style: {
    // CSS style (key value pair)  
    } 
  } 
}}