Service to support app reviews on apps stores

.env

@@ -2,3 +2,4 @@ VUE_APP_NAME=BEEP
 VUE_APP_INITIAL_STATUSBAR_COLOR=#FFFFFF
 VUE_APP_UNSAFE_STATUSBAR_COLOR=#FF5C5D
 VUE_APP_SAFE_STATUSBAR_COLOR=#47BD8F
+VUE_APP_STORE_REVIEWS_ENABLED=true

package.json

@@ -23,13 +23,18 @@
     "build-ios-ci": "npx cap sync && npx cap copy ios"
   },
   "dependencies": {
+    "@capacitor/android": "1.0.0-beta.7",
     "@capacitor/cli": "1.0.0-beta.7",
     "@capacitor/core": "1.0.0-beta.7",
     "@capacitor/ios": "1.0.0-beta.7",
-    "@capacitor/android": "1.0.0-beta.7",
     "@ionic/core": "4.0.0-beta.8",
     "@modus/ionic-vue": "1.0.11",
     "axios": "0.18.0",
+    "cordova-plugin-dialogs": "^2.0.1",
+    "cordova-plugin-globalization": "^1.11.0",
+    "cordova-plugin-inappbrowser": "^3.0.0",
+    "cordova-plugin-market": "git+https://github.com/xmartlabs/cordova-plugin-market.git",
+    "cordova-plugin-nativestorage": "^2.3.2",
     "register-service-worker": "^1.0.0",
     "sha1": "1.1.1",
     "vue": "^2.5.16",

src/main.js

@@ -5,6 +5,7 @@ import router from './router'
 import helpers from './helpers'
 import './registerServiceWorker'
 import BreachService from './breachesService'
+import ReviewAppService from './reviewAppService'
 
 import { Capacitor, Plugins, StatusBarStyle } from '@capacitor/core'
 const { SplashScreen, StatusBar, Network } = Plugins
@@ -21,6 +22,9 @@ initCapacitor()
 // Initialize helpers
 Vue.prototype.$helpers = helpers
 Vue.prototype.$breachesService = BreachService
+Vue.prototype.$reviewAppService = ReviewAppService
+
+document.addEventListener('deviceready', () => Vue.prototype.$reviewAppService.init(), false)
 
 // Create a Vue app instance
 new Vue({

src/reviewAppService.js

@@ -0,0 +1,93 @@
+import capacitorConfig from '../capacitor.config.json'
+import { Capacitor, Plugins, Device } from '@capacitor/core'
+import helpers from './helpers'
+const { Modals, Browser } = Plugins
+const { NativeStorage, cordova } = window
+
+const iOSAppId = 'id1434675665'
+const DEV_ITUNES_URL = `https://itunes.apple.com/us/app/apple-store/${iOSAppId}`
+const STORE_URL_FORMAT_IOS8 = `https://itunes.apple.com/WebObjects/MZStore.woa/wa/viewContentsUserReviews?pageNumber=0&sortOrdering=1&type=Purple+Software&mt=8&id=${iOSAppId}`
+const STORE_URL_PREFIX_IOS9 = `https://itunes.apple.com/app/viewContentsUserReviews/${iOSAppId}?action=write-review`
+
+const isWeb = Capacitor.platform === 'web'
+const isIOS = Capacitor.platform === 'ios'
+const storeReviewDoneStorageKey = 'storeReviewDone'
+
+export default {
+  storeReviewsEnabled: process.env.VUE_APP_STORE_REVIEWS_ENABLED === 'true',
+  revisionsDone: 0,
+  storeReviewDone: false,
+  osVersion: 0,
+  async init() {
+    NativeStorage.getItem(storeReviewDoneStorageKey, value => (this.storeReviewDone = value))
+    if (!isWeb && isIOS) {
+      const deviceInfo = await Device.getInfo()
+      const { osVersion } = deviceInfo
+      this.osVersion = parseInt(osVersion.split('.')[0])
+    }
+  },
+  getStoreHint() {
+    switch (Capacitor.platform) {
+      case 'ios':
+        if (Capacitor.DEBUG) {
+          return DEV_ITUNES_URL
+        }
+        if (this.osVersion < 9) {
+          return STORE_URL_FORMAT_IOS8
+        } else {
+          return STORE_URL_PREFIX_IOS9
+        }
+      case 'android':
+        return capacitorConfig.appId
+    }
+    return ''
+  },
+  registerReview() {
+    this.revisionsDone++
+  },
+  tryPromptAppReview(forceReview = false) {
+    // We only prompt for an app review if:
+    // a. The feature is enabled
+    // b. We are on a non web environment
+    // c. The user has executed only one account/password review
+    // d. The user has not accepted to provied a review for the app on the app stores yet
+    // OR
+    // a. The feature is enabled
+    // b. The review request is forced (like when is triggered manually by the user, from a global menu for instance)
+    if (
+      this.storeReviewsEnabled &&
+      !isWeb &&
+      ((this.revisionsDone === 1 && !this.storeReviewDone) || forceReview)
+    ) {
+      this.doPromptAppReview()
+    }
+  },
+  doPromptAppReview() {
+    Modals.confirm({
+      title: 'Have some feedback?',
+      message: 'Do you want to review this app?',
+      okButtonTitle: 'Sure',
+      cancelButtonTitle: 'Not now',
+    })
+      .then(doReview => {
+        if (doReview) {
+          const url = this.getStoreHint()
+          if (isIOS) {
+            Browser.open({ url })
+              .then(() => this.setReviewDone())
+              .catch(helpers.err)
+          } else {
+            cordova.plugins.market.open(url)
+            this.setReviewDone()
+          }
+        }
+        return
+      })
+      .catch(helpers.err)
+  },
+  setReviewDone() {
+    NativeStorage.setItem(storeReviewDoneStorageKey, true, () => {
+      this.storeReviewDone = true
+    })
+  },
+}

src/views/Acc.vue

@@ -62,6 +62,7 @@ export default {
     },
   },
   mounted() {
+    this.$reviewAppService.tryPromptAppReview()
     this.$breachesService.clear()
   },
   methods: {
@@ -89,6 +90,7 @@ export default {
         .get(this.getURL())
         .then(response => {
           this.$breachesService.breaches = response.data
+          this.$reviewAppService.registerReview()
           this.$router.push('/breaches')
 
           return response
@@ -97,6 +99,7 @@ export default {
           // 404 means account not pwned
           this.$breachesService.breaches = []
           if (err.response && err.response.status === 404) {
+            this.$reviewAppService.registerReview()
             this.$router.push('/safe')
             return
           }

src/views/Pwd.vue

@@ -87,6 +87,7 @@ export default {
   },
   mounted() {
     this.modal = () => import('@/components/HashProtectedModal.vue')
+    this.$reviewAppService.tryPromptAppReview()
     this.$breachesService.clear()
   },
   methods: {
@@ -120,6 +121,7 @@ export default {
         .get(this.getURL(hash.substr(0, 5)))
         .then(res => {
           const count = this.search(hash.substr(5).toUpperCase(), res.data)
+          this.$reviewAppService.registerReview()
           if (count > 0) {
             this.$router.push(`/unsafe?count=${count}`)
           } else {