feat(sentry): add sentry error tracking

.env.example

@@ -0,0 +1 @@
+SENTRY_DSN=

.gitignore

@@ -37,3 +37,5 @@ airgap_cordova_secure_storage_deploy.pub
 .DS_Store
 Thumbs.db
 UserInterfaceState.xcuserstate
+
+.env

config/uglifyjs.config.js

@@ -0,0 +1,16 @@
+module.exports = {
+  /**
+   * mangle: uglify 2's mangle option
+   */
+  mangle: {
+    reserved: ['Buffer', 'BigInteger', 'Point', 'ECPubKey', 'ECKey', 'sha512_asm', 'asm', 'ECPair', 'HDNode', 'BigNumber']
+  },
+
+  /**
+   * compress: uglify 2's compress option
+   */
+  compress: {
+    toplevel: true,
+    pure_getters: true
+  }
+}

config/webpack.config.js

@@ -0,0 +1,23 @@
+const dotenv = require('dotenv')
+const useDefaultConfig = require('@ionic/app-scripts/config/webpack.config.js')
+const webpack = require('webpack')
+const webpackMerge = require('webpack-merge')
+
+dotenv.config()
+
+module.exports = {
+  dev: webpackMerge(useDefaultConfig.dev, {
+    plugins: [
+      new webpack.EnvironmentPlugin({
+        SENTRY_DSN: process.env.SENTRY_DSN || ''
+      })
+    ]
+  }),
+  prod: webpackMerge(useDefaultConfig.prod, {
+    plugins: [
+      new webpack.EnvironmentPlugin({
+        SENTRY_DSN: process.env.SENTRY_DSN || ''
+      })
+    ]
+  })
+}

package.json

@@ -24,8 +24,9 @@
     "format": "prettier --write \"src/**/*.ts\" \"src/**/*.js\" \"test/**/*.js\""
   },
   "config": {
+    "ionic_webpack": "./config/webpack.config.js",
     "ionic_copy": "./config/copy.config.js",
-    "ionic_uglifyjs": "./uglifyjs.config.js",
+    "ionic_uglifyjs": "./config/uglifyjs.config.js",
     "ionic_ts_config": "tsconfig.json"
   },
   "husky": {
@@ -55,6 +56,7 @@
     "@ionic/storage": "^2.1.3",
     "@ngx-translate/core": "9.1.1",
     "@ngx-translate/http-loader": "2.0.1",
+    "@sentry/browser": "^4.2.4",
     "@types/node": "8.0.31",
     "@zxing/ngx-scanner": "1.2.1",
     "airgap-coin-lib": "github:airgap-it/airgap-coin-lib#ca31908b921e22f22f39c1f3a3a23877755fff74",
@@ -81,6 +83,7 @@
     "cordova-plugin-whitelist": "^1.3.3",
     "cordova-plugin-x-socialsharing": "^5.4.1",
     "cordova-sqlite-storage": "^2.4.0",
+    "dotenv": "^6.1.0",
     "es6-promise-plugin": "^4.2.2",
     "ethereum-blockies": "git+https://github.com/MyEtherWallet/blockies.git",
     "ethereumjs-tx": "1.3.6",
@@ -99,6 +102,7 @@
     "sw-toolbox": "3.6.0",
     "tslint-config-prettier": "^1.15.0",
     "typestrict": "0.0.8",
+    "webpack-merge": "^4.1.4",
     "websocket": "^1.0.26",
     "zone.js": "0.8.18"
   },

src/app/app.component.ts

@@ -9,6 +9,9 @@ import { TabsPage } from '../pages/tabs/tabs'
 import { TransactionConfirmPage } from '../pages/transaction-confirm/transaction-confirm'
 import { WalletImportPage } from '../pages/wallet-import/wallet-import'
 
+import { configureScope } from '@sentry/browser'
+import { AppVersion } from '@ionic-native/app-version'
+
 @Component({
   templateUrl: 'app.html'
 })
@@ -23,7 +26,8 @@ export class MyApp {
     statusBar: StatusBar,
     splashScreen: SplashScreen,
     private translate: TranslateService,
-    private deeplinks: Deeplinks
+    private deeplinks: Deeplinks,
+    private appVersion: AppVersion
   ) {
     this.translate.setDefaultLang('en')
     this.platform
@@ -33,33 +37,42 @@ export class MyApp {
           statusBar.styleLightContent()
           statusBar.backgroundColorByHexString('#00e8cc')
           splashScreen.hide()
+          configureScope(scope => {
+            scope.addEventProcessor(async event => {
+              event.release = await this.appVersion.getVersionNumber()
+              return event
+            })
+          })
+        } else {
+          configureScope(scope => {
+            scope.addEventProcessor(async event => {
+              event.release = 'browser'
+              return event
+            })
+          })
         }
       })
       .catch(err => console.log(err))
   }
 
-  ngAfterViewInit() {
-    this.platform
-      .ready()
-      .then(() => {
-        this.deeplinks
-          .routeWithNavController(this.nav, {
-            '/broadcast': TransactionConfirmPage,
-            '/import': WalletImportPage
-          })
-          .subscribe(
-            match => {
-              // match.$route - the route we matched, which is the matched entry from the arguments to route()
-              // match.$args - the args passed in the link
-              // match.$link - the full link data
-              console.log('Successfully matched route', match)
-            },
-            nomatch => {
-              // nomatch.$link - the full link data
-              console.error("Got a deeplink that didn't match", nomatch)
-            }
-          )
+  async ngAfterViewInit() {
+    await this.platform.ready()
+    this.deeplinks
+      .routeWithNavController(this.nav, {
+        '/broadcast': TransactionConfirmPage,
+        '/import': WalletImportPage
       })
-      .catch(err => console.log(err))
+      .subscribe(
+        match => {
+          // match.$route - the route we matched, which is the matched entry from the arguments to route()
+          // match.$args - the args passed in the link
+          // match.$link - the full link data
+          console.log('Successfully matched route', JSON.stringify(match))
+        },
+        nomatch => {
+          // nomatch.$link - the full link data
+          console.error("Got a deeplink that didn't match", JSON.stringify(nomatch))
+        }
+      )
   }
 }

src/app/app.module.ts

@@ -11,7 +11,7 @@ import { StatusBar } from '@ionic-native/status-bar'
 import { TranslateLoader, TranslateModule } from '@ngx-translate/core'
 import { TranslateHttpLoader } from '@ngx-translate/http-loader'
 import { QRCodeModule } from 'angularx-qrcode'
-import { IonicApp, IonicErrorHandler, IonicModule } from 'ionic-angular'
+import { IonicApp, IonicModule } from 'ionic-angular'
 import { MaterialIconsModule } from 'ionic2-material-icons'
 
 import { ComponentsModule } from '../components/components.module'
@@ -43,6 +43,7 @@ import { IonicStorageModule } from '@ionic/storage'
 import { WalletEditPopoverComponent } from '../components/wallet-edit-popover/wallet-edit-popover.component'
 import { SettingsProvider } from '../providers/settings/settings'
 import { Clipboard } from '@ionic-native/clipboard'
+import { SentryErrorHandler } from '../providers/sentry-error-handler/sentry-error-handler'
 
 export function createTranslateLoader(http: HttpClient) {
   return new TranslateHttpLoader(http, './assets/i18n/', '.json')
@@ -120,7 +121,7 @@ export function createTranslateLoader(http: HttpClient) {
     BarcodeScanner,
     Keyboard,
     Deeplinks,
-    { provide: ErrorHandler, useClass: IonicErrorHandler },
+    { provide: ErrorHandler, useClass: SentryErrorHandler },
     ScannerProvider,
     AppVersion,
     WalletsProvider,