Merge branch 'native/4588-spike-store-rating' into 'master'

Store review #4588

See merge request minds/mobile-native!2018

Author: msantang78

AppInitManager.ts

@@ -21,6 +21,7 @@ import mindsConfigService from './src/common/services/minds-config.service';
 import openUrlService from '~/common/services/open-url.service';
 import { hasVariation, updateGrowthBookAttributes } from 'ExperimentsProvider';
 import checkTOS from '~/tos/checkTOS';
+import { storeRatingService } from 'modules/store-rating';
 
 /**
  * App initialization manager
@@ -44,6 +45,8 @@ export class AppInitManager {
 
     openUrlService.init();
 
+    storeRatingService.track('appSession');
+
     try {
       logService.info('[App] init session');
       const token = await sessionService.init();

__tests__/common/services/image-picker.service.js

@@ -20,6 +20,7 @@ jest.mock('react-native', () => ({
   },
   Platform: {
     OS: 'android',
+    select: obj => 'android',
   },
 }));
 

ios/Podfile.lock

@@ -40,6 +40,8 @@ PODS:
     - ReactCommon/turbomodule/core
   - EXSensors (11.4.0):
     - ExpoModulesCore
+  - EXStoreReview (5.3.0):
+    - ExpoModulesCore
   - FBLazyVector (0.69.7)
   - FBReactNativeSpec (0.69.7):
     - RCT-Folly (= 2021.06.28.00-v2)
@@ -693,6 +695,7 @@ DEPENDENCIES:
   - ExpoLinearGradient (from `../node_modules/expo-linear-gradient/ios`)
   - ExpoModulesCore (from `../node_modules/expo-modules-core/ios`)
   - EXSensors (from `../node_modules/expo-sensors/ios`)
+  - EXStoreReview (from `../node_modules/expo-store-review/ios`)
   - FBLazyVector (from `../node_modules/react-native/Libraries/FBLazyVector`)
   - FBReactNativeSpec (from `../node_modules/react-native/React/FBReactNativeSpec`)
   - Flipper (= 0.169.0)
@@ -877,6 +880,8 @@ EXTERNAL SOURCES:
     :path: "../node_modules/expo-modules-core/ios"
   EXSensors:
     :path: "../node_modules/expo-sensors/ios"
+  EXStoreReview:
+    :path: "../node_modules/expo-store-review/ios"
   FBLazyVector:
     :path: "../node_modules/react-native/Libraries/FBLazyVector"
   FBReactNativeSpec:
@@ -1054,7 +1059,7 @@ SPEC CHECKSUMS:
   boost: a7c83b31436843459a1961bfd74b96033dc77234
   CocoaAsyncSocket: 065fd1e645c7abab64f7a6a2007a48038fdc6a99
   CodePush: ef496b6fd053012e985e3d4a0ab9f9dbf2739eac
-  DoubleConversion: 5189b271737e1565bdce30deb4a08d647e3f5f54
+  DoubleConversion: 831926d9b8bf8166fd87886c4abab286c2422662
   EXApplication: e418d737a036e788510f2c4ad6c10a7d54d18586
   EXAV: 596506c9bee54ad52f2f3b625cdaeb9d9f2dd6b7
   EXConstants: 7c44785d41d8e959d527d23d29444277a4d1ee73
@@ -1068,6 +1073,7 @@ SPEC CHECKSUMS:
   ExpoLinearGradient: 1a3af07c6dab3c612967a294836df9ae717431df
   ExpoModulesCore: 5a973701f4400d70254bc836305228731c829010
   EXSensors: a34fb0d416eae3ecaaab43ec64dca0854227d3bf
+  EXStoreReview: cbb6b2202bb6f831cd3234d9d8b995cec0eb32f2
   FBLazyVector: 6b7f5692909b4300d50e7359cdefbcd09dd30faa
   FBReactNativeSpec: affcf71d996f6b0c01f68883482588297b9d5e6e
   Flipper: 55f10244ce1a82d4adc1cb817bc492f11e22f6ff
@@ -1081,7 +1087,7 @@ SPEC CHECKSUMS:
   FlipperKit: 1868c4faed64da1c779da268417515127dbde450
   FMDB: 2ce00b547f966261cd18927a3ddb07cb6f3db82a
   fmt: ff9d55029c625d3757ed641535fd4a75fedc7ce9
-  glog: 3d02b25ca00c2d456734d0bcff864cbc62f6ae1a
+  glog: 476ee3e89abb49e07f822b48323c51c57124b572
   GoogleDataTransport: 1c8145da7117bd68bbbed00cf304edb6a24de00f
   GoogleMLKit: 85ffdc9641d05311c76dbba5bbf93059087be12f
   GoogleToolboxForMac: 8bef7c7c5cf7291c687cf5354f39f9db6399ad34
@@ -1108,7 +1114,7 @@ SPEC CHECKSUMS:
   Permission-PhotoLibrary: 5b34ca67279f7201ae109cef36f9806a6596002d
   PromisesObjC: ab77feca74fa2823e7af4249b8326368e61014cb
   Protobuf: 02524ec14183fe08fb259741659e79683788158b
-  RCT-Folly: b9d9fe1fc70114b751c076104e52f3b1b5e5a95a
+  RCT-Folly: 4d8508a426467c48885f1151029bc15fa5d7b3b8
   RCTRequired: 54bff6aa61efd9598ab59d2a823c382b4fe13d27
   RCTSilentSwitch: bc3867bfe1d9bd19391d15ce0d27f208b6731e52
   RCTSystemSetting: 5107b7350d63b3f7b42a1277d07e4e5d9df879be
@@ -1189,6 +1195,6 @@ SPEC CHECKSUMS:
   Yoga: 0b84a956f7393ef1f37f3bb213c516184e4a689d
   YogaKit: f782866e155069a2cca2517aafea43200b01fd5a
 
-PODFILE CHECKSUM: cb358b8be853ffb5ace41a3401194ce0721de1b3
+PODFILE CHECKSUM: b3aad2fe2c34bf0342ed93736b65129c71a3197f
 
 COCOAPODS: 1.11.3

locales/en.json

@@ -1824,6 +1824,9 @@
     }
   },
   "failedTryAgain": "Sorry, failed to load. please try again",
+  "storeRating": {
+    "prompt": "Are you enjoying Minds?"
+  },
   "codePush": {
     "prompt": {
       "title": "New update available",

package.json

@@ -74,7 +74,9 @@
     "expo-av": "^12.0.4",
     "expo-image-manipulator": "^10.4.0",
     "expo-linear-gradient": "^11.4.0",
+    "expo-linking": "^3.2.3",
     "expo-sensors": "~11.4.0",
+    "expo-store-review": "^5.3.0",
     "i18n-js": "^3.8.0",
     "i18next": "^22.0.2",
     "jest-circus": "^27.0.6",

src/comments/v2/CommentsStore.ts

@@ -23,6 +23,7 @@ import type GroupModel from '../../groups/GroupModel';
 import { showNotification } from '../../../AppMessages';
 import i18n from '../../common/services/i18n.service';
 import { isNetworkError } from '../../common/services/api.service';
+import { storeRatingService } from 'modules/store-rating';
 
 const COMMENTS_PAGE_SIZE = 12;
 
@@ -423,6 +424,7 @@ export default class CommentsStore {
       this.setShowInput(false);
       this.embed.clearRichEmbedAction();
       this.attachment.clear();
+      storeRatingService.track('comment', true);
 
       if (this.entity.incrementCommentsCounter) {
         this.entity.incrementCommentsCounter();

src/common/BaseModel.ts

@@ -11,6 +11,7 @@ import type UserModel from '../channel/UserModel';
 import type FeedStore from './stores/FeedStore';
 import AbstractModel from './AbstractModel';
 import MetadataService from './services/metadata.service';
+import { storeRatingService } from 'modules/store-rating';
 
 /**
  * Base model
@@ -176,7 +177,7 @@ export default class BaseModel extends AbstractModel {
    * @param {string} direction
    */
   @action
-  async toggleVote(direction) {
+  async toggleVote(direction: 'up' | 'down') {
     const voted = direction === 'up' ? this.votedUp : this.votedDown;
     const delta = voted ? -1 : 1;
 
@@ -202,6 +203,11 @@ export default class BaseModel extends AbstractModel {
 
     try {
       await vote(this.guid, direction, params);
+      if (direction === 'up') {
+        storeRatingService.track('upvote', true);
+      } else {
+        storeRatingService.track('downvote');
+      }
     } catch (err) {
       if (!voted) {
         this['thumbs:' + direction + ':user_guids'] = guids.filter(function (

src/compose/createComposeStore.tsx

@@ -21,6 +21,7 @@ import NavigationService from '../navigation/NavigationService';
 import MultiAttachmentStore from '~/common/stores/MultiAttachmentStore';
 import SupermindRequestModel from '../supermind/SupermindRequestModel';
 import { confirm } from '../common/components/Confirm';
+import { storeRatingService } from 'modules/store-rating';
 
 /**
  * Display an error message to the user.
@@ -626,6 +627,8 @@ export default function (props) {
           return this.entity;
         }
 
+        storeRatingService.track('createPost', true);
+
         if (this.supermindRequest) {
           showNotification(i18n.t('supermind.requestSubmitted'), 'success');
         }

src/config/Config.ts

@@ -187,3 +187,31 @@ export const CAPTCHA_ENABLED_ENDPOINTS = [
     origin: 'vote_up',
   },
 ];
+
+/**
+ * used to measure the user's interaction with the app
+ */
+export const USAGE_SCORES = {
+  viewPost: 0.1,
+  appSession: 1,
+  upvote: 2,
+  downvote: -1,
+  remind: 3,
+  createPost: 5,
+  comment: 5,
+};
+
+/**
+ * if user's usage score increased beyond this threshold, they will
+ * get prompted to rate the app
+ */
+export const RATING_APP_SCORE_THRESHOLD = 20;
+
+const APP_STORE_LINK =
+  'itms-apps://apps.apple.com/app/id961771928?action=write-review';
+const PLAY_STORE_LINK = 'market://details?id=com.minds.mobile';
+
+export const STORE_LINK = Platform.select({
+  ios: APP_STORE_LINK,
+  android: PLAY_STORE_LINK,
+}) as string;

src/modules/store-rating/components/RateApp.tsx

@@ -0,0 +1,70 @@
+import React from 'react';
+import { SafeAreaView } from 'react-native-safe-area-context';
+import {
+  BottomSheetButton,
+  pushBottomSheet,
+} from '../../../common/components/bottom-sheet';
+import i18nService from '../../../common/services/i18n.service';
+import { Spacer, H2 } from '../../../common/ui';
+import ThemedStyles from '../../../styles/ThemedStyles';
+
+interface RateAppProps {
+  onConfirm: () => void;
+  onCancel: () => void;
+  onLayout?: ({
+    nativeEvent: {
+      layout: { height },
+    },
+  }: any) => void;
+}
+
+export default function RateApp({
+  onConfirm,
+  onCancel,
+  onLayout,
+}: RateAppProps) {
+  return (
+    <SafeAreaView
+      edges={['bottom']}
+      style={ThemedStyles.style.flexContainer}
+      onLayout={onLayout}>
+      <Spacer horizontal="L" bottom="S">
+        <H2 align="center" bottom="L">
+          {i18nService.t('storeRating.prompt')}
+        </H2>
+      </Spacer>
+      <BottomSheetButton
+        action
+        solid
+        text={i18nService.t('yes')}
+        onPress={onConfirm}
+      />
+      <BottomSheetButton text={i18nService.t('no')} onPress={onCancel} />
+      <Spacer bottom="L" />
+    </SafeAreaView>
+  );
+}
+
+export const rateApp = (
+  props?: Omit<RateAppProps, 'onConfirm' | 'onCancel'>,
+): Promise<boolean | null> => {
+  return new Promise(resolve =>
+    pushBottomSheet({
+      component: (bottomSheetRef, handleContentLayout) => (
+        <RateApp
+          {...props}
+          onLayout={handleContentLayout}
+          onConfirm={() => {
+            resolve(true);
+            bottomSheetRef.close();
+          }}
+          onCancel={() => {
+            resolve(false);
+            bottomSheetRef.close();
+          }}
+        />
+      ),
+      onClose: () => resolve(null),
+    }),
+  );
+};

src/modules/store-rating/index.ts

@@ -0,0 +1,3 @@
+import storeRatingService from './store-rating.service';
+
+export { storeRatingService };

src/modules/store-rating/store-rating.service.ts

@@ -0,0 +1,98 @@
+import * as StoreReview from 'expo-store-review';
+import debounce from 'lodash/debounce';
+import moment from 'moment';
+import { InteractionManager, Linking } from 'react-native';
+import openUrlService from '../../common/services/open-url.service';
+import { storages } from '../../common/services/storage/storages.service';
+import {
+  RATING_APP_SCORE_THRESHOLD,
+  STORE_LINK,
+  USAGE_SCORES,
+} from '../../config/Config';
+import { rateApp } from './components/RateApp';
+
+const SCORES_KEY = 'APP_SCORES';
+const LAST_PROMPTED_AT_KEY = 'STORE_RATING_LAST_PROMPTED_AT';
+
+class StoreRatingService {
+  lastPromptedAt: number | null =
+    storages.app.getInt(LAST_PROMPTED_AT_KEY) || null;
+  points = storages.app.getInt(SCORES_KEY) || 0;
+
+  constructor() {
+    this.debouncedSetStorage = debounce(this.debouncedSetStorage, 2000);
+  }
+
+  track(key: keyof typeof USAGE_SCORES, prompt = false) {
+    this.points += USAGE_SCORES[key];
+
+    if (prompt && this.shouldPrompt) {
+      return setTimeout(() => {
+        InteractionManager.runAfterInteractions(() => {
+          this.prompt();
+        });
+      }, 500);
+    }
+
+    this.debouncedSetStorage(SCORES_KEY, this.points);
+  }
+
+  get shouldPrompt() {
+    if (
+      this.lastPromptedAt &&
+      moment().isBefore(moment(this.lastPromptedAt).add({ days: 120 }))
+    ) {
+      return false;
+    }
+
+    return this.points > RATING_APP_SCORE_THRESHOLD;
+  }
+
+  async redirectToStore() {
+    Linking.openURL(STORE_LINK);
+  }
+
+  async openFeedbackForm() {
+    openUrlService.openLinkInInAppBrowser(
+      'https://mindsdotcom.typeform.com/app-feedback',
+    );
+  }
+
+  async prompt() {
+    const rated = await rateApp();
+    this.lastPromptedAt = Date.now();
+    storages.app.setIntAsync(LAST_PROMPTED_AT_KEY, this.lastPromptedAt);
+
+    if (rated === null) {
+      return null;
+    }
+
+    if (rated) {
+      this.redirectToStore();
+    } else if (rated === false) {
+      this.openFeedbackForm();
+    }
+  }
+
+  async promptNatively() {
+    if (!(await StoreReview.hasAction())) {
+      return false;
+    }
+
+    if (!(await StoreReview.isAvailableAsync())) {
+      return false;
+    }
+
+    await StoreReview.requestReview();
+    this.lastPromptedAt = Date.now();
+    storages.app.setIntAsync(LAST_PROMPTED_AT_KEY, this.lastPromptedAt);
+  }
+
+  debouncedSetStorage(key: string, value: any) {
+    storages.app.setIntAsync(key, value);
+  }
+}
+
+const storeRatingService = new StoreRatingService();
+
+export default storeRatingService;

src/newsfeed/NewsfeedService.ts

@@ -9,6 +9,7 @@ import type ActivityModel from './ActivityModel';
 import type BlogModel from '../blogs/BlogModel';
 import UserModel from '../channel/UserModel';
 import GroupModel from '../groups/GroupModel';
+import { storeRatingService } from 'modules/store-rating';
 
 export default class NewsfeedService {
   async _getFeed(endpoint, offset, limit) {
@@ -130,6 +131,9 @@ export async function setViewed(
       extra,
     );
   }
+
+  storeRatingService.track('viewPost');
+
   return data;
 }