• Stars
    star
    170
  • Rank 222,093 (Top 5 %)
  • Language
    TypeScript
  • License
    MIT License
  • Created almost 5 years ago
  • Updated 29 days ago

Reviews

There are no reviews yet. Be the first to send feedback to the community and the maintainers!

Repository Details

Plaid Link for React Native

Getting Started version

In your react-native project directory:

npm install --save react-native-plaid-link-sdk

For a sample app demonstrating a minimal integration with this SDK, see the Tiny Quickstart (React Native). For a full guide and migration guides please vist our docs.

iOS setup

Add Plaid to your project’s Podfile as follows (likely located at ios/Podfile). The latest version is version.

pod 'Plaid', '~> <insert latest version>'

Then install your cocoapods dependencies:

(cd ios && pod install)

That's it if using a recent react-native version with autolinking support.

Manual Integration

If using a version of react-native without autolinking support, then you will need to:

react-native link react-native-plaid-link-sdk

followed by

  1. In Xcode, in the project navigator, right click LibrariesAdd Files to [your project's name]
  2. Go to node_modules react-native-plaid-link-sdk ios and add RNLinksdk.xcodeproj
  3. In Xcode, in the project navigator, select your project. Add libRNLinksdk.a to your project's Build Phases Link Binary With Libraries
  4. Run your project (Cmd+R)<

OAuth Requirements

⚠️ All integrations must migrate to version 9.0.0 or later of the React Native SDK (requires version 4.1.0 or later of the iOS LinkKit SDK) by September 30, 2023, to maintain support for Chase OAuth on iOS.

For iOS OAuth to work, specific requirements must be met.

  • Redirect URIs must be registered, and set up as universal links (docs)

Android setup

Autolinking unfortunately isn't supported for Android, because the SDK makes use of TurboModules to speed up app cold starts. Have a look at #306 for more context.

1. Register your app id

  1. Log into your Plaid Dashboard at the API page
  2. Next to Allowed Android package names click "Configure" then "Add New Android Package Name"
  3. Enter your package name, for example com.plaid.example
  4. Click "Save Changes", you may be prompted to re-enter your password

2. Add PlaidPackage to your application

  1. Go to android/app/src/main/java/<AppName>/MainApplication.java
  2. Add import com.plaid.PlaidPackage; to the imports section
  3. Add packages.add(new PlaidPackage()); to List<ReactPackage> getPackages();

3. Configure Gradle

  1. Go to the project level android/app/build.gradle
  2. Make sure you are using a min sdk >= 21
  3. Add the following dependencies:
dependencies {
    // ...
    implementation project(':react-native-plaid-link-sdk')
}
  1. Go to android/settings.gradle
  2. Add the following lines:
include ':react-native-plaid-link-sdk'
project(':react-native-plaid-link-sdk').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-plaid-link-sdk/android')
  1. (Optional) Run npx react-native link

React native setup

To initialize PlaidLink, you will need to first create a link_token at /link/token/create. After creating a link_token, you'll need to pass it into your app and use it to launch Link:

import { Text } from 'react-native';
import { PlaidLink, LinkSuccess, LinkExit } from 'react-native-plaid-link-sdk';

const MyPlaidComponent = () => {
  return (
    <PlaidLink
        tokenConfig={{
            token: "#GENERATED_LINK_TOKEN#",
        }}
        onSuccess={(success: LinkSuccess) => { console.log(success) }}
        onExit={(exit: LinkExit) => { console.log(exit) }}
    >
        <Text>Add Account</Text>
    </PlaidLink>
  );
};

PlaidLink wraps the view you provide as a child with a Pressable component and intercepts the onPress event.

OAuth requirements

For Link Token based OAuth support, you must configure your link_token with a redirect_uri to support OAuth on iOS. Other than setting the redirect_uri, which must be a universal link, when you create the link_token no further configuration is required. Notably, no props are required on the React Native side.

For non-Link Token based OAuth support, you must pass two props to the PlaidLink React Native component:

  1. oauthRedirectUri this is the same uri you would pass to the redirect_uri for Link Token based OAuth. It must be registered as a universal link.
  2. oauthNonce this is a 16 character nonce.

In order for the React Native app to respond to the universal link, you will need to update your AppDelegate to inform the React Native Linking library when the universal link is received. See OAuth requirements for more information.

To receive onEvent callbacks:

The React Native Plaid module emits onEvent events throughout the account linking process — see details here. To receive these events in your React Native app, wrap the PlaidLink react component with the following in order to listen for those events:

import React from 'react';
import { Text, NativeEventEmitter, NativeModules, Platform } from 'react-native';

class PlaidEventContainer extends React.Component {

  componentDidMount() {
    const emitter = new NativeEventEmitter(Platform.OS === 'ios' ? NativeModules.RNLinksdk : NativeModules.PlaidAndroid);
    this._listener = emitter.addListener('onEvent', (e) => console.log(e));
  }

  componentWillUnmount() {
    if (this._listener) {
      this._listener.remove();
    }
  }

  ...
}

You can also use the usePlaidEmitter hook in react functional components:

  usePlaidEmitter((event: LinkEvent) => {
    console.log(event)
  })

Versions and release candidates

We create release candidates (e.g. 7.0.0-rc1) as beta previews for developers. These are helpful for customers who either are 1. waiting for a specific fix or 2. extremely eager for specific features. They do not hold the same quality guarantee as our official releases, and should NOT be used in production. The official releases come ~2 weeks after the first release candidate (rc1).

The latest stable version is the highest version without the suffix -rcX.

Updating from previous versions.

When upgrading from a previous major version of this library, see the following notes for additional instructions:

Version compatibility

React Native SDK Android SDK iOS SDK Status
10.4.0 [3.13.2+] >=4.4.0 Active, supports Xcode 14
10.3.0 [3.12.1+] >=4.3.0 Deprecated, supports Xcode 14
10.2.0 [3.12.0+] >=4.3.0 Deprecated, supports Xcode 14
10.1.0 [3.11.0+] >=4.2.0 Deprecated, supports Xcode 14
10.0.0 [3.10.1+] >=4.1.0 Deprecated, supports Xcode 14
9.x.x [3.10.1+] >=4.1.0 Deprecated, supports Xcode 14
8.x.x [3.10.1+] >=3.1.0 Deprecated, supports Xcode 14
7.x.x [3.2.0+] >=2.0.11 Deprecated, supports Xcode <= 13
6.x.x [3.0.0-3.2.0) >=2.0.1 Deprecated
5.x.x [2.1.0-3.0.0) >=1.1.34 Deprecated
4.x.x [2.0.0-2.1.0) <=1.1.33 Deprecated
3.x.x [1.0.0-2.0.0) <=1.1.33 Deprecated
2.x.x [0.3.0-1.0.0) <=1.1.27 Deprecated
1.x.x [0.1.0-0.3.0) <=1.1.24 Deprecated

More Repositories

1

quickstart

Get up and running with Plaid Link and the API in minutes
TypeScript
537
star
2

plaid-node

Node bindings for Plaid
TypeScript
518
star
3

pattern

An example end-to-end Plaid integration to create items and fetch transaction data
TypeScript
441
star
4

plaid-python

Python bindings for Plaid
Python
402
star
5

plaid-postman

Postman collection for the Plaid API
HTML
315
star
6

react-plaid-link

React bindings for Plaid Link
TypeScript
264
star
7

deprecated-link

This repository is now deprecated. To integrate with Plaid, visit the docs.
261
star
8

plaid-ruby

Ruby bindings for Plaid
Ruby
221
star
9

plaid-go

go bindings for Plaid
Go
194
star
10

deprecated-async-problem

🔀 Solutions and non-solutions to JavaScript's async problem
JavaScript
186
star
11

plaid-java

Java bindings for Plaid
Java
124
star
12

plaid-link-ios

Plaid Link iOS SDK
Objective-C
116
star
13

plaid-link-android

Plaid Link Android SDK
Kotlin
100
star
14

tiny-quickstart

A minimal quickstart demonstrating Plaid Link, Balances, and OAuth
JavaScript
77
star
15

plaid-openapi

API version 2020-09-14
74
star
16

support

Plaid Support
66
star
17

plaid-link-examples

Plaid Link Webview, ReactNative examples
Objective-C
60
star
18

pattern-account-funding

Sample code to demonstrate Plaid-powered account funding use cases using the Auth, Identity, and Balance APIs. Includes examples of using Auth partners for end-to-end funds transfers.
TypeScript
44
star
19

envvar

Derive JavaScript values from environment variables
JavaScript
37
star
20

npmserve

fast npm installs for slow clients
Shell
36
star
21

npmserve-server

fast npm installs for slow clients
JavaScript
27
star
22

go-envvar

A go library for managing environment variables. Maps to typed values, supports required and optional vars with defaults.
Go
25
star
23

idv-quickstart

Get up and running with Plaid Identity Verification in minutes
CSS
22
star
24

tutorial-resources

Sample apps and material to go along with Plaid's tutorials
JavaScript
18
star
25

income-sample

Sample app for Income
TypeScript
15
star
26

account-funding-tutorial

TypeScript
13
star
27

sandbox-custom-users

JSON files specifying custom users suitable for testing Plaid integrations on Sandbox
Python
13
star
28

nockingbird

Declarative HTTP mocking (for use with Nock)
CoffeeScript
13
star
29

core-exchange

The Core Exchange spec and generated server code
MDX
12
star
30

pattern-transfers

TypeScript
11
star
31

payment-initiation-pattern-app

Payment Initiation demo app for Europe, based on Plaid Pattern
TypeScript
6
star
32

credit-attributes

Attributes that can be calculated using Plaid's credit products
Python
4
star
33

plaid-node-legacy

⚠️This library has been deprecated and archived. Our current libraries can be found at https://plaid.com/docs/libraries/ or https://github.com/plaid
JavaScript
4
star
34

assets-attributes

Attributes that can be calculated using a Plaid Asset Report
Python
3
star
35

plaid-java-legacy

⚠️This library has been deprecated and archived. Our current libraries can be found at https://plaid.com/docs/libraries/ or https://github.com/plaid
Java
3
star
36

plaid-python-legacy

⚠️This library has been deprecated and archived. Our current libraries can be found at https://plaid.com/docs/libraries/ or https://github.com/plaid
Python
3
star
37

plaid-ruby-legacy

⚠️This library has been deprecated and archived. Our current libraries can be found at https://plaid.com/docs/libraries/ or https://github.com/plaid
Ruby
2
star
38

.github

1
star
39

plaid-go-legacy

⚠️This library has been deprecated and archived. Our current libraries can be found at https://plaid.com/docs/libraries/ or https://github.com/plaid
1
star