From 1b519cf00915db8010a8c2d0bf559889f8f700b0 Mon Sep 17 00:00:00 2001 From: dtroupe Date: Mon, 3 Jun 2024 11:52:42 -0700 Subject: [PATCH] lint --- FabricExample/.eslintrc.js | 12 ++- FabricExample/ios/Podfile.lock | 10 +- FabricExample/package-lock.json | 8 +- FabricExample/package.json | 2 +- FabricExample/src/App.tsx | 2 +- .../src/Screens/PlaidEmbeddedLinkScreen.tsx | 95 +++++++++++-------- FabricExample/src/Screens/PlaidLinkScreen.tsx | 61 ++++++++---- FabricExample/src/Styles.js | 15 +++ 8 files changed, 135 insertions(+), 70 deletions(-) diff --git a/FabricExample/.eslintrc.js b/FabricExample/.eslintrc.js index 187894b6..c838cb81 100644 --- a/FabricExample/.eslintrc.js +++ b/FabricExample/.eslintrc.js @@ -1,4 +1,14 @@ module.exports = { root: true, - extends: '@react-native', + extends: [ + 'eslint:recommended', + 'plugin:@typescript-eslint/eslint-recommended', + 'plugin:@typescript-eslint/recommended', + ], + ignorePatterns: [ + 'babel.config.js', + '.eslintrc.js', + 'jest.config.js', + 'metro.config.js', + ], }; diff --git a/FabricExample/ios/Podfile.lock b/FabricExample/ios/Podfile.lock index b2c01abf..1a293fe6 100644 --- a/FabricExample/ios/Podfile.lock +++ b/FabricExample/ios/Podfile.lock @@ -7,7 +7,7 @@ PODS: - hermes-engine (0.74.1): - hermes-engine/Pre-built (= 0.74.1) - hermes-engine/Pre-built (0.74.1) - - Plaid (5.5.0) + - Plaid (5.5.1) - RCT-Folly (2024.01.01.00): - boost - DoubleConversion @@ -936,11 +936,11 @@ PODS: - React-Mapbuffer (0.74.1): - glog - React-debug - - react-native-plaid-link-sdk (11.9.0): + - react-native-plaid-link-sdk (11.10.2): - DoubleConversion - glog - hermes-engine - - Plaid (~> 5.5.0) + - Plaid (~> 5.5.1) - RCT-Folly (= 2024.01.01.00) - RCTRequired - RCTTypeSafety @@ -1515,7 +1515,7 @@ SPEC CHECKSUMS: fmt: 4c2741a687cc09f0634a2e2c72a838b99f1ff120 glog: c5d68082e772fa1c511173d6b30a9de2c05a69a2 hermes-engine: 16b8530de1b383cdada1476cf52d1b52f0692cbc - Plaid: e2760da0ba3f71fae515b9936d20dc188681f37a + Plaid: 276eb2892728a7b33a89f54aa0d62cf532af2c1d RCT-Folly: 02617c592a293bd6d418e0a88ff4ee1f88329b47 RCTDeprecation: efb313d8126259e9294dc4ee0002f44a6f676aba RCTRequired: f49ea29cece52aee20db633ae7edc4b271435562 @@ -1540,7 +1540,7 @@ SPEC CHECKSUMS: React-jsitracing: 233d1a798fe0ff33b8e630b8f00f62c4a8115fbc React-logger: 7e7403a2b14c97f847d90763af76b84b152b6fce React-Mapbuffer: 11029dcd47c5c9e057a4092ab9c2a8d10a496a33 - react-native-plaid-link-sdk: 58883da163f87ac9f7524b22cb37be497df2d417 + react-native-plaid-link-sdk: aa721fc10b14926ee16f805083c2a61ad0c693a5 react-native-safe-area-context: 7f54ad0a774de306ab790c70d9d950321e5c5449 React-nativeconfig: b0073a590774e8b35192fead188a36d1dca23dec React-NativeModulesApple: df46ff3e3de5b842b30b4ca8a6caae6d7c8ab09f diff --git a/FabricExample/package-lock.json b/FabricExample/package-lock.json index 61f719ee..e76c4830 100644 --- a/FabricExample/package-lock.json +++ b/FabricExample/package-lock.json @@ -16,7 +16,7 @@ "react": "18.2.0", "react-native": "0.74.1", "react-native-gesture-handler": "^2.16.2", - "react-native-plaid-link-sdk": "^11.9.0", + "react-native-plaid-link-sdk": "^11.10.2", "react-native-safe-area-context": "4.10.1", "react-native-screens": "3.31.1" }, @@ -11563,9 +11563,9 @@ } }, "node_modules/react-native-plaid-link-sdk": { - "version": "11.9.0", - "resolved": "https://registry.npmjs.org/react-native-plaid-link-sdk/-/react-native-plaid-link-sdk-11.9.0.tgz", - "integrity": "sha512-Ss/oZcchKw18IKm3tsd/6iywFJbuJKuDA6hLP6FjYJGrXFF4TQU3dKbANYl4vBtIOto19CjnzonsJdxZ8Thtvg==", + "version": "11.10.2", + "resolved": "https://registry.npmjs.org/react-native-plaid-link-sdk/-/react-native-plaid-link-sdk-11.10.2.tgz", + "integrity": "sha512-nFR0/A7ba0JCunEGZPnFhkTbJMuAOF6aNL+e0PxeIaQMjqL6GHkj4FPWf2rfzp6nYsLY7q4BOsX9mlLRcBRdBg==", "peerDependencies": { "react": "*", "react-native": "*" diff --git a/FabricExample/package.json b/FabricExample/package.json index 89f38a6a..c482f329 100644 --- a/FabricExample/package.json +++ b/FabricExample/package.json @@ -18,7 +18,7 @@ "react": "18.2.0", "react-native": "0.74.1", "react-native-gesture-handler": "^2.16.2", - "react-native-plaid-link-sdk": "^11.9.0", + "react-native-plaid-link-sdk": "^11.10.2", "react-native-safe-area-context": "4.10.1", "react-native-screens": "3.31.1" }, diff --git a/FabricExample/src/App.tsx b/FabricExample/src/App.tsx index 4a9b13ce..48fb75f6 100644 --- a/FabricExample/src/App.tsx +++ b/FabricExample/src/App.tsx @@ -7,7 +7,7 @@ import { PlaidLinkScreen } from './Screens/PlaidLinkScreen'; const Tab = createBottomTabNavigator(); -export default function App() { +export default function App(): React.JSX.Element{ return ( { - let content +const EmbeddedView = ({token}: {token: string}) => { + let content; - if (token) { - content = - { - console.log('onEvent', event); - }} - onSuccess={(success: LinkSuccess) => { - console.log('onSuccess', success); - }} - onExit={(exit: LinkExit) => { - console.log('onExit', exit); - }} - style={styles.embedded} - /> - - } else { - content = Enter Link Token - } - - return {content} -} + if (token) { + content = ( + + { + console.log('onEvent', event); + }} + onSuccess={(success: LinkSuccess) => { + console.log('onSuccess', success); + }} + onExit={(exit: LinkExit) => { + console.log('onExit', exit); + }} + style={styles.embedded} + /> + + ); + } else { + content = ( + + Enter Link Token + + ); + } -export function PlaidEmbeddedLinkScreen() { + return {content}; +}; - const [text, setText] = React.useState(''); +export function PlaidEmbeddedLinkScreen(): React.JSX.Element { + const [text, setText] = React.useState(''); - return ( - <> - setText(newText)} - value={text} - placeholder="link-sandbox-xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx" - placeholderTextColor={'#D3D3D3'} - /> - - - ); + return ( + <> + setText(newText)} + value={text} + placeholder="link-sandbox-xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx" + placeholderTextColor={'#D3D3D3'} + /> + + + ); } diff --git a/FabricExample/src/Screens/PlaidLinkScreen.tsx b/FabricExample/src/Screens/PlaidLinkScreen.tsx index 59694ff3..e2de3ca3 100644 --- a/FabricExample/src/Screens/PlaidLinkScreen.tsx +++ b/FabricExample/src/Screens/PlaidLinkScreen.tsx @@ -1,31 +1,45 @@ import React from 'react'; -import { TextInput, Text, TouchableOpacity } from 'react-native'; -import { styles } from '../Styles'; +import {TextInput, Text, TouchableOpacity} from 'react-native'; +import {styles} from '../Styles'; import { LinkExit, LinkEvent, LinkLogLevel, LinkSuccess, - openLink, dismissLink, - PlaidLinkProps, + LinkOpenProps, usePlaidEmitter, LinkIOSPresentationStyle, + LinkTokenConfiguration, } from 'react-native-plaid-link-sdk'; -// Create PlaidLinkProps from the provided token string. -function makeLinkTokenProps(token: string): PlaidLinkProps { +import {create, open} from 'react-native-plaid-link-sdk/dist/PlaidLink'; + +function isValidString(str: string): boolean { + if (str && str.trim() !== '') { + return true; + } + return false; +} + +function createLinkTokenConfiguration( + token: string, + noLoadingState = false, +): LinkTokenConfiguration { + console.log(`token: ${token}`); + return { + token: token, + // Hides native activity indicator if true. + noLoadingState: noLoadingState, + }; +} + +function createLinkOpenProps(): LinkOpenProps { return { - tokenConfig: { - token: token, - logLevel: LinkLogLevel.ERROR, - // Hides native activity indicator if true. - noLoadingState: false, - }, onSuccess: (success: LinkSuccess) => { // User was able to successfully link their account. - console.log('Success: ', success); + console.log('Success: ', success); success.metadata.accounts.forEach(it => console.log('accounts', it)); }, onExit: (linkExit: LinkExit) => { @@ -35,10 +49,11 @@ function makeLinkTokenProps(token: string): PlaidLinkProps { }, // MODAL or FULL_SCREEEN presentation on iOS. Defaults to MODAL. iOSPresentationStyle: LinkIOSPresentationStyle.MODAL, + logLevel: LinkLogLevel.ERROR, }; } -export function PlaidLinkScreen() { +export function PlaidLinkScreen(): React.JSX.Element { // Render using the link_token integration. Refer to the docs // https://plaid.com/docs/#create-link-token on how to create // a new link_token. @@ -50,6 +65,7 @@ export function PlaidLinkScreen() { }); const [text, onChangeText] = React.useState(''); + const [disabled, setDisabled] = React.useState(true); return ( <> @@ -63,8 +79,21 @@ export function PlaidLinkScreen() { { - const linkTokenProps = makeLinkTokenProps(text); - openLink(linkTokenProps); + if (isValidString(text)) { + const tokenConfiguration = createLinkTokenConfiguration(text); + create(tokenConfiguration); + setDisabled(false); + } + }}> + Create Link + + { + const openProps = createLinkOpenProps(); + open(openProps); + setDisabled(true); }}> Open Link diff --git a/FabricExample/src/Styles.js b/FabricExample/src/Styles.js index e8e6cecb..443a2cb1 100644 --- a/FabricExample/src/Styles.js +++ b/FabricExample/src/Styles.js @@ -16,6 +16,21 @@ export const styles = StyleSheet.create({ textTransform: 'uppercase', overflow: 'hidden', }, + disabledButton: { + elevation: 8, + backgroundColor: '#2196F3', + width: '90%', + margin: 4, + paddingVertical: 4, + fontSize: 16, + textAlign: 'center', + color: 'white', + borderRadius: 4, + alignSelf: 'center', + textTransform: 'uppercase', + overflow: 'hidden', + opacity: 0.5, + }, input: { height: 40, margin: 12,