Adding Sentry + better error handling, follows #11

.gitignore

@@ -56,4 +56,5 @@ buck-out/
 *.jsbundle
 
 # MasonToday
-sample.js
+sample.js
+sentry.properties

App.js

@@ -1,7 +1,12 @@
 import { createStackNavigator } from 'react-navigation';
+import { Sentry } from 'react-native-sentry';
 
 import { EventListPage, EventDetailsPage } from 'masontoday/src/components';
 
+if (!__DEV__) {
+    Sentry.config('https://4f6e0cb23ab04d5a89c5d6b99b2cb6f2@sentry.io/1279094').install();
+}
+
 const App = createStackNavigator(
     {
         EventList: {

android/app/build.gradle

@@ -77,6 +77,7 @@ project.ext.react = [
 ]
 
 apply from: "../../node_modules/react-native/react.gradle"
+apply from: "../../node_modules/react-native-sentry/sentry.gradle"
 
 /**
  * Set this to true to create two separate APKs instead of one:
@@ -137,6 +138,7 @@ android {
 }
 
 dependencies {
+    compile project(':react-native-sentry')
     compile project(':react-native-app-settings')
     compile project(':react-native-add-calendar-event')
     compile fileTree(dir: "libs", include: ["*.jar"])

android/app/src/main/java/com/masontoday/MainApplication.java

@@ -3,6 +3,7 @@
 import android.app.Application;
 
 import com.facebook.react.ReactApplication;
+import io.sentry.RNSentryPackage;
 import com.krazylabs.OpenAppSettingsPackage;
 import com.vonovak.AddCalendarEventPackage;
 import com.facebook.react.ReactNativeHost;
@@ -25,6 +26,7 @@ public boolean getUseDeveloperSupport() {
     protected List<ReactPackage> getPackages() {
       return Arrays.<ReactPackage>asList(
           new MainReactPackage(),
+            new RNSentryPackage(),
             new OpenAppSettingsPackage(),
             new AddCalendarEventPackage()
       );

android/settings.gradle

@@ -1,4 +1,6 @@
 rootProject.name = 'masontoday'
+include ':react-native-sentry'
+project(':react-native-sentry').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-sentry/android')
 include ':react-native-app-settings'
 project(':react-native-app-settings').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-app-settings/android')
 include ':react-native-add-calendar-event'

ios/masontoday.xcodeproj/project.pbxproj

@@ -39,6 +39,8 @@
 		ADBDB9381DFEBF1600ED6528 /* libRCTBlob.a in Frameworks */ = {isa = PBXBuildFile; fileRef = ADBDB9271DFEBF0700ED6528 /* libRCTBlob.a */; };
 		74124A57D9614CA287F548C8 /* libRNAddCalendarEvent.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 43D5E67A80C840F991DEE362 /* libRNAddCalendarEvent.a */; };
 		9F775E5C174B4301A62EABFE /* libRNOpenAppSettings.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 5CCE84CC72314FB0BE8F5F74 /* libRNOpenAppSettings.a */; };
+		F32E18BB7AD949559315AC8B /* libRNSentry.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 0ADC2D979BD64B709A3B86DE /* libRNSentry.a */; };
+		D77F3D242EDF43EBA842EEF9 /* libz.tbd in Frameworks */ = {isa = PBXBuildFile; fileRef = A7D7F88FEA994BD78E15F0DD /* libz.tbd */; };
 /* End PBXBuildFile section */
 
 /* Begin PBXContainerItemProxy section */
@@ -348,6 +350,9 @@
 		43D5E67A80C840F991DEE362 /* libRNAddCalendarEvent.a */ = {isa = PBXFileReference; name = "libRNAddCalendarEvent.a"; path = "libRNAddCalendarEvent.a"; sourceTree = "<group>"; fileEncoding = undefined; lastKnownFileType = archive.ar; explicitFileType = undefined; includeInIndex = 0; };
 		3CAA1388F4A9492AB338D139 /* RNOpenAppSettings.xcodeproj */ = {isa = PBXFileReference; name = "RNOpenAppSettings.xcodeproj"; path = "../node_modules/react-native-app-settings/ios/RNOpenAppSettings.xcodeproj"; sourceTree = "<group>"; fileEncoding = undefined; lastKnownFileType = wrapper.pb-project; explicitFileType = undefined; includeInIndex = 0; };
 		5CCE84CC72314FB0BE8F5F74 /* libRNOpenAppSettings.a */ = {isa = PBXFileReference; name = "libRNOpenAppSettings.a"; path = "libRNOpenAppSettings.a"; sourceTree = "<group>"; fileEncoding = undefined; lastKnownFileType = archive.ar; explicitFileType = undefined; includeInIndex = 0; };
+		F7C861F864F64E1C8BB100ED /* RNSentry.xcodeproj */ = {isa = PBXFileReference; name = "RNSentry.xcodeproj"; path = "../node_modules/react-native-sentry/ios/RNSentry.xcodeproj"; sourceTree = "<group>"; fileEncoding = undefined; lastKnownFileType = wrapper.pb-project; explicitFileType = undefined; includeInIndex = 0; };
+		0ADC2D979BD64B709A3B86DE /* libRNSentry.a */ = {isa = PBXFileReference; name = "libRNSentry.a"; path = "libRNSentry.a"; sourceTree = "<group>"; fileEncoding = undefined; lastKnownFileType = archive.ar; explicitFileType = undefined; includeInIndex = 0; };
+		A7D7F88FEA994BD78E15F0DD /* libz.tbd */ = {isa = PBXFileReference; name = "libz.tbd"; path = "usr/lib/libz.tbd"; sourceTree = SDKROOT; fileEncoding = undefined; lastKnownFileType = sourcecode.text-based-dylib-definition; explicitFileType = undefined; includeInIndex = 0; };
 /* End PBXFileReference section */
 
 /* Begin PBXFrameworksBuildPhase section */
@@ -378,6 +383,8 @@
 				139FDEF61B0652A700C62182 /* libRCTWebSocket.a in Frameworks */,
 				74124A57D9614CA287F548C8 /* libRNAddCalendarEvent.a in Frameworks */,
 				9F775E5C174B4301A62EABFE /* libRNOpenAppSettings.a in Frameworks */,
+				F32E18BB7AD949559315AC8B /* libRNSentry.a in Frameworks */,
+				D77F3D242EDF43EBA842EEF9 /* libz.tbd in Frameworks */,
 			);
 			runOnlyForDeploymentPostprocessing = 0;
 		};
@@ -527,6 +534,7 @@
 			isa = PBXGroup;
 			children = (
 				2D16E6891FA4F8E400B85C8A /* libReact.a */,
+				A7D7F88FEA994BD78E15F0DD /* libz.tbd */,
 			);
 			name = Frameworks;
 			sourceTree = "<group>";
@@ -566,6 +574,7 @@
 				139FDEE61B06529A00C62182 /* RCTWebSocket.xcodeproj */,
 				7ACAAF0ABE4E407986069E22 /* RNAddCalendarEvent.xcodeproj */,
 				3CAA1388F4A9492AB338D139 /* RNOpenAppSettings.xcodeproj */,
+				F7C861F864F64E1C8BB100ED /* RNSentry.xcodeproj */,
 			);
 			name = Libraries;
 			sourceTree = "<group>";
@@ -613,6 +622,14 @@
 			name = Products;
 			sourceTree = "<group>";
 		};
+		4D58E8380F4842A2B209F009 /* Frameworks */ = {
+			isa = PBXGroup;
+			children = (
+			);
+			name = Frameworks;
+			path = Application;
+			sourceTree = "<group>";
+		};
 /* End PBXGroup section */
 
 /* Begin PBXNativeTarget section */
@@ -642,6 +659,7 @@
 				13B07F8C1A680F5B00A75B9A /* Frameworks */,
 				13B07F8E1A680F5B00A75B9A /* Resources */,
 				00DD1BFF1BD5951E006B06BC /* Bundle React Native code and images */,
+				75AFC1783E8D46069D80E4EA /* Upload Debug Symbols to Sentry */,
 			);
 			buildRules = (
 			);
@@ -1092,7 +1110,7 @@
 			);
 			runOnlyForDeploymentPostprocessing = 0;
 			shellPath = /bin/sh;
-			shellScript = "export NODE_BINARY=node\n../node_modules/react-native/scripts/react-native-xcode.sh";
+			shellScript = "export SENTRY_PROPERTIES=sentry.properties\nexport NODE_BINARY=node\n../node_modules/@sentry/cli/bin/sentry-cli react-native xcode ../node_modules/react-native/scripts/react-native-xcode.sh";
 		};
 		2D02E4CB1E0B4B27006451C7 /* Bundle React Native Code And Images */ = {
 			isa = PBXShellScriptBuildPhase;
@@ -1106,7 +1124,21 @@
 			);
 			runOnlyForDeploymentPostprocessing = 0;
 			shellPath = /bin/sh;
-			shellScript = "export NODE_BINARY=node\n../node_modules/react-native/scripts/react-native-xcode.sh";
+			shellScript = "export SENTRY_PROPERTIES=sentry.properties\nexport NODE_BINARY=node\n../node_modules/@sentry/cli/bin/sentry-cli react-native xcode ../node_modules/react-native/scripts/react-native-xcode.sh";
+		};
+		75AFC1783E8D46069D80E4EA /* Upload Debug Symbols to Sentry */ = {
+			isa = PBXShellScriptBuildPhase;
+			buildActionMask = 2147483647;
+			files = (
+			);
+			runOnlyForDeploymentPostprocessing = 0;
+			name = "Upload Debug Symbols to Sentry";
+			inputPaths = (
+			);
+			outputPaths = (
+			);
+			shellPath = /bin/sh;
+			shellScript = "export SENTRY_PROPERTIES=sentry.properties\n../node_modules/@sentry/cli/bin/sentry-cli upload-dsym";
 		};
 /* End PBXShellScriptBuildPhase section */
 
@@ -1194,11 +1226,13 @@
 					"$(inherited)",
 					"\"$(SRCROOT)/$(TARGET_NAME)\"",
 					"\"$(SRCROOT)/$(TARGET_NAME)\"",
+					"\"$(SRCROOT)/$(TARGET_NAME)\"",
 				);
 				HEADER_SEARCH_PATHS = (
 					"$(inherited)",
 					"$(SRCROOT)/../node_modules/react-native-add-calendar-event/ios",
 					"$(SRCROOT)/../node_modules/react-native-app-settings/ios",
+					"$(SRCROOT)/../node_modules/react-native-sentry/ios/**",
 				);
 			};
 			name = Debug;
@@ -1221,11 +1255,13 @@
 					"$(inherited)",
 					"\"$(SRCROOT)/$(TARGET_NAME)\"",
 					"\"$(SRCROOT)/$(TARGET_NAME)\"",
+					"\"$(SRCROOT)/$(TARGET_NAME)\"",
 				);
 				HEADER_SEARCH_PATHS = (
 					"$(inherited)",
 					"$(SRCROOT)/../node_modules/react-native-add-calendar-event/ios",
 					"$(SRCROOT)/../node_modules/react-native-app-settings/ios",
+					"$(SRCROOT)/../node_modules/react-native-sentry/ios/**",
 				);
 			};
 			name = Release;
@@ -1249,6 +1285,7 @@
 					"$(inherited)",
 					"$(SRCROOT)/../node_modules/react-native-add-calendar-event/ios",
 					"$(SRCROOT)/../node_modules/react-native-app-settings/ios",
+					"$(SRCROOT)/../node_modules/react-native-sentry/ios/**",
 				);
 			};
 			name = Debug;
@@ -1271,6 +1308,7 @@
 					"$(inherited)",
 					"$(SRCROOT)/../node_modules/react-native-add-calendar-event/ios",
 					"$(SRCROOT)/../node_modules/react-native-app-settings/ios",
+					"$(SRCROOT)/../node_modules/react-native-sentry/ios/**",
 				);
 			};
 			name = Release;
@@ -1302,11 +1340,13 @@
 					"$(inherited)",
 					"\"$(SRCROOT)/$(TARGET_NAME)\"",
 					"\"$(SRCROOT)/$(TARGET_NAME)\"",
+					"\"$(SRCROOT)/$(TARGET_NAME)\"",
 				);
 				HEADER_SEARCH_PATHS = (
 					"$(inherited)",
 					"$(SRCROOT)/../node_modules/react-native-add-calendar-event/ios",
 					"$(SRCROOT)/../node_modules/react-native-app-settings/ios",
+					"$(SRCROOT)/../node_modules/react-native-sentry/ios/**",
 				);
 			};
 			name = Debug;
@@ -1338,11 +1378,13 @@
 					"$(inherited)",
 					"\"$(SRCROOT)/$(TARGET_NAME)\"",
 					"\"$(SRCROOT)/$(TARGET_NAME)\"",
+					"\"$(SRCROOT)/$(TARGET_NAME)\"",
 				);
 				HEADER_SEARCH_PATHS = (
 					"$(inherited)",
 					"$(SRCROOT)/../node_modules/react-native-add-calendar-event/ios",
 					"$(SRCROOT)/../node_modules/react-native-app-settings/ios",
+					"$(SRCROOT)/../node_modules/react-native-sentry/ios/**",
 				);
 			};
 			name = Release;
@@ -1373,11 +1415,13 @@
 					"$(inherited)",
 					"\"$(SRCROOT)/$(TARGET_NAME)\"",
 					"\"$(SRCROOT)/$(TARGET_NAME)\"",
+					"\"$(SRCROOT)/$(TARGET_NAME)\"",
 				);
 				HEADER_SEARCH_PATHS = (
 					"$(inherited)",
 					"$(SRCROOT)/../node_modules/react-native-add-calendar-event/ios",
 					"$(SRCROOT)/../node_modules/react-native-app-settings/ios",
+					"$(SRCROOT)/../node_modules/react-native-sentry/ios/**",
 				);
 			};
 			name = Debug;
@@ -1408,11 +1452,13 @@
 					"$(inherited)",
 					"\"$(SRCROOT)/$(TARGET_NAME)\"",
 					"\"$(SRCROOT)/$(TARGET_NAME)\"",
+					"\"$(SRCROOT)/$(TARGET_NAME)\"",
 				);
 				HEADER_SEARCH_PATHS = (
 					"$(inherited)",
 					"$(SRCROOT)/../node_modules/react-native-add-calendar-event/ios",
 					"$(SRCROOT)/../node_modules/react-native-app-settings/ios",
+					"$(SRCROOT)/../node_modules/react-native-sentry/ios/**",
 				);
 			};
 			name = Release;

ios/masontoday/AppDelegate.m

@@ -9,6 +9,11 @@
 
 #import <React/RCTBundleURLProvider.h>
 #import <React/RCTRootView.h>
+#if __has_include(<React/RNSentry.h>)
+#import <React/RNSentry.h> // This is used for versions of react >= 0.40
+#else
+#import "RNSentry.h" // This is used for versions of react < 0.40
+#endif
 
 @implementation AppDelegate
 
@@ -17,11 +22,13 @@ - (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(
   NSURL *jsCodeLocation;
 
   jsCodeLocation = [[RCTBundleURLProvider sharedSettings] jsBundleURLForBundleRoot:@"index" fallbackResource:nil];
-
-  RCTRootView *rootView = [[RCTRootView alloc] initWithBundleURL:jsCodeLocation
+RCTRootView *rootView = [[RCTRootView alloc] initWithBundleURL:jsCodeLocation
                                                       moduleName:@"masontoday"
                                                initialProperties:nil
                                                    launchOptions:launchOptions];
+
+  [RNSentry installWithRootView:rootView];
+
   rootView.backgroundColor = [[UIColor alloc] initWithRed:1.0f green:1.0f blue:1.0f alpha:1];
 
   self.window = [[UIWindow alloc] initWithFrame:[UIScreen mainScreen].bounds];

package.json

@@ -15,6 +15,7 @@
         "react-native": "0.56.0",
         "react-native-add-calendar-event": "^2.0.2",
         "react-native-app-settings": "^2.0.0",
+        "react-native-sentry": "^0.39.0",
         "react-navigation": "^2.6.2"
     },
     "devDependencies": {

src/api/Live25API.js

@@ -1,4 +1,5 @@
 import masontodayAPI from './masontodayAPI';
+import { ErrorHandling } from 'masontoday/src/utils';
 
 class Live25API {
     constructor() {
@@ -11,7 +12,7 @@ class Live25API {
             const responseJson = await response.json();
             return responseJson;
         } catch (error) {
-            console.log(error);
+            ErrorHandling.networkError();
         }
     }
 }

src/utils/DataManipulation.js

@@ -2,6 +2,8 @@ import { AsyncStorage } from 'react-native';
 import { filter } from 'lodash';
 import moment from 'moment';
 
+import { ErrorHandling } from 'masontoday/src/utils';
+
 const QUALITIES = ['excellent', 'verygood', 'good', 'okay'];
 
 class DataManipulation {
@@ -37,7 +39,8 @@ class DataManipulation {
             const data = JSON.parse(await AsyncStorage.getItem('masontoday:25live'));
             return data;
         } catch (error) {
-            console.error(error);
+            ErrorHandling.genericError(error);
+            return;
         }
     }
 
@@ -47,7 +50,8 @@ class DataManipulation {
         try {
             await AsyncStorage.setItem('masontoday:25live', JSON.stringify(data));
         } catch (error) {
-            console.error(error);
+            ErrorHandling.genericError(error);
+            return;
         }
     }
 }

src/utils/ErrorHandling.js

@@ -0,0 +1,22 @@
+import { Alert } from 'react-native';
+import { Sentry } from 'react-native-sentry';
+
+class ErrorHandling {
+    genericError(error) {
+        Sentry.captureException(error);
+        Alert.alert(
+            'Looks like we ran into a problem!',
+            "Don't worry! We've alerted our devs and they'll fix it ASAP!"
+        );
+        return;
+    }
+    networkError() {
+        Alert.alert(
+            "Looks like you're not connected to internet!",
+            "Don't worry, we've saved data for the next few days so you won't have a problem"
+        );
+        return;
+    }
+}
+
+export default new ErrorHandling();

src/utils/index.js

@@ -1,3 +1,4 @@
 import DataManipulation from './DataManipulation';
+import ErrorHandling from './ErrorHandling';
 
-export { DataManipulation };
+export { DataManipulation, ErrorHandling };