wip

SampleApp/App.tsx

@@ -1,118 +1,32 @@
-/**
- * Sample React Native App
- * https://github.com/facebook/react-native
- *
- * @format
- */
+/*Copyright 2022 Square Inc.
 
-import React from 'react';
-import type {PropsWithChildren} from 'react';
-import {
-  SafeAreaView,
-  ScrollView,
-  StatusBar,
-  StyleSheet,
-  Text,
-  useColorScheme,
-  View,
-} from 'react-native';
+ Licensed under the Apache License, Version 2.0 (the "License");
+ you may not use this file except in compliance with the License.
+ You may obtain a copy of the License at
 
-import {
-  Colors,
-  DebugInstructions,
-  Header,
-  LearnMoreLinks,
-  ReloadInstructions,
-} from 'react-native/Libraries/NewAppScreen';
+ http://www.apache.org/licenses/LICENSE-2.0
 
-type SectionProps = PropsWithChildren<{
-  title: string;
-}>;
+ Unless required by applicable law or agreed to in writing, software
+ distributed under the License is distributed on an "AS IS" BASIS,
+ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ See the License for the specific language governing permissions and
+ limitations under the License.
+*/
+import * as React from 'react';
+import { NavigationContainer } from '@react-navigation/native';
+import { createNativeStackNavigator } from '@react-navigation/native-stack';
+import HomeScreen from './app/screens/HomeScreen';
 
-function Section({children, title}: SectionProps): React.JSX.Element {
-  const isDarkMode = useColorScheme() === 'dark';
-  return (
-    <View style={styles.sectionContainer}>
-      <Text
-        style={[
-          styles.sectionTitle,
-          {
-            color: isDarkMode ? Colors.white : Colors.black,
-          },
-        ]}>
-        {title}
-      </Text>
-      <Text
-        style={[
-          styles.sectionDescription,
-          {
-            color: isDarkMode ? Colors.light : Colors.dark,
-          },
-        ]}>
-        {children}
-      </Text>
-    </View>
-  );
-}
-
-function App(): React.JSX.Element {
-  const isDarkMode = useColorScheme() === 'dark';
-
-  const backgroundStyle = {
-    backgroundColor: isDarkMode ? Colors.darker : Colors.lighter,
-  };
+const Stack = createNativeStackNavigator();
 
+function App() {
   return (
-    <SafeAreaView style={backgroundStyle}>
-      <StatusBar
-        barStyle={isDarkMode ? 'light-content' : 'dark-content'}
-        backgroundColor={backgroundStyle.backgroundColor}
-      />
-      <ScrollView
-        contentInsetAdjustmentBehavior="automatic"
-        style={backgroundStyle}>
-        <Header />
-        <View
-          style={{
-            backgroundColor: isDarkMode ? Colors.black : Colors.white,
-          }}>
-          <Section title="Step One">
-            Edit <Text style={styles.highlight}>App.tsx</Text> to change this
-            screen and then come back to see your edits.
-          </Section>
-          <Section title="See Your Changes">
-            <ReloadInstructions />
-          </Section>
-          <Section title="Debug">
-            <DebugInstructions />
-          </Section>
-          <Section title="Learn More">
-            Read the docs to discover what to do next:
-          </Section>
-          <LearnMoreLinks />
-        </View>
-      </ScrollView>
-    </SafeAreaView>
+    <NavigationContainer>
+      <Stack.Navigator>
+        <Stack.Screen name="Home" component={HomeScreen} />
+      </Stack.Navigator>
+    </NavigationContainer>
   );
 }
 
-const styles = StyleSheet.create({
-  sectionContainer: {
-    marginTop: 32,
-    paddingHorizontal: 24,
-  },
-  sectionTitle: {
-    fontSize: 24,
-    fontWeight: '600',
-  },
-  sectionDescription: {
-    marginTop: 8,
-    fontSize: 18,
-    fontWeight: '400',
-  },
-  highlight: {
-    fontWeight: '700',
-  },
-});
-
 export default App;

SampleApp/android/build.gradle

@@ -4,7 +4,7 @@ buildscript {
         minSdkVersion = 21
         compileSdkVersion = 34
         targetSdkVersion = 34
-        ndkVersion = "25.1.8937393"
+        ndkVersion = "34.0.0"
         kotlinVersion = "1.8.0"
     }
     repositories {

SampleApp/app/ChargeCustomerCardError.js

@@ -0,0 +1,21 @@
+/*
+ Copyright 2022 Square Inc.
+
+ Licensed under the Apache License, Version 2.0 (the "License");
+ you may not use this file except in compliance with the License.
+ You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+ Unless required by applicable law or agreed to in writing, software
+ distributed under the License is distributed on an "AS IS" BASIS,
+ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ See the License for the specific language governing permissions and
+ limitations under the License.
+*/
+export default class ChargeCustomerCardError extends Error {
+  constructor(message) {
+    super(message);
+    this.name = 'ChargeCustomerCardError';
+  }
+}

SampleApp/app/ChargeError.js

@@ -0,0 +1,21 @@
+/*
+ Copyright 2022 Square Inc.
+
+ Licensed under the Apache License, Version 2.0 (the "License");
+ you may not use this file except in compliance with the License.
+ You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+ Unless required by applicable law or agreed to in writing, software
+ distributed under the License is distributed on an "AS IS" BASIS,
+ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ See the License for the specific language governing permissions and
+ limitations under the License.
+*/
+export default class ChargeError extends Error {
+  constructor(message) {
+    super(message);
+    this.name = 'ChargeError';
+  }
+}

SampleApp/app/Constants.js

@@ -0,0 +1,38 @@
+/*
+ Copyright 2022 Square Inc.
+
+ Licensed under the Apache License, Version 2.0 (the "License");
+ you may not use this file except in compliance with the License.
+ You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+ Unless required by applicable law or agreed to in writing, software
+ distributed under the License is distributed on an "AS IS" BASIS,
+ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ See the License for the specific language governing permissions and
+ limitations under the License.
+*/
+const SQUARE_APP_ID = 'sq0idp-279w1ejUbhuatNoaumEidg';
+const SQUARE_LOCATION_ID = '8KCT0W4CF2S3E';
+// Make sure to remove trailing `/` since the CHARGE_SERVER_URL puts it
+const CHARGE_SERVER_HOST = 'REPLACE_ME';
+const CHARGE_SERVER_URL = `${CHARGE_SERVER_HOST}/chargeForCookie`;
+const GOOGLE_PAY_LOCATION_ID = 'REPLACE_ME';
+const APPLE_PAY_MERCHANT_ID = 'REPLACE_ME';
+// constants require for card on file transactions
+const CREATE_CUSTOMER_CARD_SERVER_URL = `${CHARGE_SERVER_HOST}/createCustomerCard`;
+const CHARGE_CUSTOMER_CARD_SERVER_URL = `${CHARGE_SERVER_HOST}/chargeCustomerCard`;
+const CUSTOMER_ID = 'REPLACE_ME';
+
+module.exports = {
+  SQUARE_APP_ID,
+  SQUARE_LOCATION_ID,
+  CHARGE_SERVER_HOST,
+  CHARGE_SERVER_URL,
+  GOOGLE_PAY_LOCATION_ID,
+  APPLE_PAY_MERCHANT_ID,
+  CUSTOMER_ID,
+  CREATE_CUSTOMER_CARD_SERVER_URL,
+  CHARGE_CUSTOMER_CARD_SERVER_URL,
+};

SampleApp/app/CreateCustomerCardError.js

@@ -0,0 +1,21 @@
+/*
+ Copyright 2022 Square Inc.
+
+ Licensed under the Apache License, Version 2.0 (the "License");
+ you may not use this file except in compliance with the License.
+ You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+ Unless required by applicable law or agreed to in writing, software
+ distributed under the License is distributed on an "AS IS" BASIS,
+ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ See the License for the specific language governing permissions and
+ limitations under the License.
+*/
+export default class CreateCustomerCardError extends Error {
+  constructor(message) {
+    super(message);
+    this.name = 'CreateCustomerCardError';
+  }
+}

SampleApp/app/Utilities.tsx

@@ -0,0 +1,85 @@
+/*
+ Copyright 2022 Square Inc.
+
+ Licensed under the Apache License, Version 2.0 (the "License");
+ you may not use this file except in compliance with the License.
+ You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+ Unless required by applicable law or agreed to in writing, software
+ distributed under the License is distributed on an "AS IS" BASIS,
+ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ See the License for the specific language governing permissions and
+ limitations under the License.
+*/
+/* eslint no-bitwise: ["error", { "allow": ["|", "&"] }] */
+import {Alert} from 'react-native';
+
+export function uuidv4() {
+  return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, c => {
+    const r = (Math.random() * 16) | 0;
+    const v = c === 'x' ? r : (r & 0x3) | 0x8;
+    return v.toString(16);
+  });
+}
+
+export function printCurlCommand(
+  nonce: string,
+  appId: string,
+  verificationToken = undefined,
+) {
+  // set host url based on application id
+  //   production: https://connect.squareup.com
+  //   sandbox: https://connect.squareupsandbox.com
+  const hostUrl = appId.startsWith('sandbox')
+    ? 'https://connect.squareupsandbox.com'
+    : 'https://connect.squareup.com';
+  const uuid = uuidv4();
+  if (verificationToken === undefined) {
+    console.log(`Run this curl command to charge the nonce:
+          curl --request POST ${hostUrl}/v2/payments \\
+          --header "Content-Type: application/json" \\
+          --header "Authorization: Bearer YOUR_ACCESS_TOKEN" \\
+          --header "Accept: application/json" \\
+          --data '{
+          "idempotency_key": "${uuid}",
+          "amount_money": {
+          "amount": 100,
+          "currency": "USD"},
+          "source_id": "${nonce}"
+          }'`);
+  } else {
+    console.log(`Run this curl command to charge the nonce:
+          curl --request POST ${hostUrl}/v2/payments \\
+          --header "Content-Type: application/json" \\
+          --header "Authorization: Bearer YOUR_ACCESS_TOKEN" \\
+          --header "Accept: application/json" \\
+          --data '{
+          "idempotency_key": "${uuid}",
+          "amount_money": {
+          "amount": 100,
+          "currency": "USD"},
+          "source_id": "${nonce}",
+          "verification_token": "${verificationToken}"
+          }'`);
+  }
+}
+
+export async function showAlert(
+  title: string,
+  message = '',
+  onPress = () => {},
+) {
+  Alert.alert(
+    title,
+    message,
+    [
+      {
+        text: 'OK',
+        onPress: onPress,
+      },
+    ],
+    {cancelable: false},
+  );
+}

SampleApp/app/components/AddressView.tsx

@@ -0,0 +1,34 @@
+/*
+ Copyright 2022 Square Inc.
+
+ Licensed under the Apache License, Version 2.0 (the "License");
+ you may not use this file except in compliance with the License.
+ You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+ Unless required by applicable law or agreed to in writing, software
+ distributed under the License is distributed on an "AS IS" BASIS,
+ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ See the License for the specific language governing permissions and
+ limitations under the License.
+*/
+import React from 'react';
+import {Text, StyleSheet} from 'react-native';
+import PropTypes from 'prop-types';
+
+AddressView.propTypes = {
+  address: PropTypes.string.isRequired,
+};
+
+export default function AddressView({address}: {address: string}) {
+  return <Text style={styles.address}>{address}</Text>;
+}
+
+const styles = StyleSheet.create({
+  address: {
+    color: '#7B7B7B',
+    fontSize: 15,
+    marginTop: 4,
+  },
+});