Feature/ios premium

src/components/App/__tests__/App.reducer.test.js

@@ -6,7 +6,7 @@ import {
   FINISH_FIRST_VISIT,
   UPDATE_CONNECTIVITY,
   UPDATE_DISPLAY_SETTINGS,
-  UPDATE_NAVIGATION_SETTINGS,
+  UPDATE_NAVIGATION_SETTINGS
 } from '../App.constants';
 import appReducer from '../App.reducer';
 
@@ -24,9 +24,9 @@ describe('reducer', () => {
         communicatorTour: {
           isCommBoardsEnabled: true,
           isPublicBoardsEnabled: true,
-          isAllMyBoardsEnabled: true,
+          isAllMyBoardsEnabled: true
         },
-        isAnalyticsTourEnabled: true,
+        isAnalyticsTourEnabled: true
       },
       displaySettings: {
         uiSize: DISPLAY_SIZE_STANDARD,
@@ -35,7 +35,7 @@ describe('reducer', () => {
         hideOutputActive: false,
         increaseOutputButtons: false,
         labelPosition: 'Below',
-        darkThemeActive: false,
+        darkThemeActive: false
       },
       navigationSettings: {
         active: false,
@@ -46,12 +46,12 @@ describe('reducer', () => {
         shareShowActive: false,
         quickUnlockActive: false,
         removeOutputActive: false,
-        vocalizeFolders: false,
+        vocalizeFolders: false
       },
       symbolsSettings: {
-        arasaacActive: false,
+        arasaacActive: false
       },
-      userData: {},
+      userData: {}
     };
     uData = { name: 'martin bedouret', email: '[email protected]' };
     mockApp = {
@@ -62,7 +62,7 @@ describe('reducer', () => {
         labelPosition: 'Below',
         fontFamily: DEFAULT_FONT_FAMILY,
         fontSize: 'Standard',
-        darkThemeActive: false,
+        darkThemeActive: false
       },
       isConnected: true,
       isFirstVisit: false,
@@ -75,9 +75,9 @@ describe('reducer', () => {
         shareShowActive: false,
         quickUnlockActive: false,
         removeOutputActive: false,
-        vocalizeFolders: false,
+        vocalizeFolders: false
       },
-      userData: uData,
+      userData: uData
     };
   });
   it('should return the initial state', () => {
@@ -86,57 +86,57 @@ describe('reducer', () => {
   it('should handle login ', () => {
     const login = {
       type: LOGIN_SUCCESS,
-      payload: uData,
+      payload: uData
     };
     expect(appReducer(initialState, login)).toEqual({
       ...initialState,
       userData: uData,
-      isFirstVisit: false,
+      isFirstVisit: false
     });
   });
   it('should handle logout', () => {
     const logout = {
-      type: LOGOUT,
+      type: LOGOUT
     };
     expect(appReducer(initialState, logout)).toEqual(initialState);
   });
   it('should handle updateDisplaySettings', () => {
     const updateDisplaySettings = {
       type: UPDATE_DISPLAY_SETTINGS,
-      payload: mockApp.displaySettings,
+      payload: mockApp.displaySettings
     };
     expect(appReducer(initialState, updateDisplaySettings)).toEqual({
       ...initialState,
-      displaySettings: mockApp.displaySettings,
+      displaySettings: mockApp.displaySettings
     });
   });
   it('should handle updateNavigationSettings', () => {
     const updateNavigationSettings = {
       type: UPDATE_NAVIGATION_SETTINGS,
-      payload: mockApp.navigationSettings,
+      payload: mockApp.navigationSettings
     };
     expect(appReducer(initialState, updateNavigationSettings)).toEqual({
       ...initialState,
-      navigationSettings: mockApp.navigationSettings,
+      navigationSettings: mockApp.navigationSettings
     });
   });
   it('should handle finishFirstVisit ', () => {
     const finishFirstVisit = {
-      type: FINISH_FIRST_VISIT,
+      type: FINISH_FIRST_VISIT
     };
     expect(appReducer(initialState, finishFirstVisit)).toEqual({
       ...initialState,
-      isFirstVisit: false,
+      isFirstVisit: false
     });
   });
   it('should handle updateConnectivity', () => {
     const updateConnectivity = {
       type: UPDATE_CONNECTIVITY,
-      payload: false,
+      payload: false
     };
     expect(appReducer(initialState, updateConnectivity)).toEqual({
       ...initialState,
-      isConnected: false,
+      isConnected: false
     });
   });
 });

src/components/Board/Symbol/Symbol.test.js

@@ -21,7 +21,7 @@ it('renders with correct image source path', () => {
 
 it('renders with label', () => {
   const wrapper = shallow(
-    <Symbol label="dummy label" type="p" labelpos="Below" />,
+    <Symbol label="dummy label" type="p" labelpos="Below" />
   );
   expect(wrapper.find('.Symbol__label')).toHaveLength(1);
 });

src/components/Settings/Settings.component.js

@@ -98,7 +98,7 @@ export class Settings extends PureComponent {
       }
     ];
 
-    if (!isIOS() && !isInFreeCountry) {
+    if (!isInFreeCountry) {
       const subscribeSection = {
         icon: <MonetizationOnIcon />,
         text: messages.subscribe,

src/components/Settings/Subscribe/Subscribe.constants.js

@@ -16,3 +16,4 @@ export const EMPTY_PRODUCT = 'empty_product';
 export const ON_TRIAL_PERIOD = 'on_trial_period';
 export const GOOGLE_PLAY_STORE_URL =
   'https://play.google.com/store/account/subscriptions';
+export const APP_STORE_URL = 'https://www.apple.com/app-store/';

src/components/Settings/Subscribe/Subscribe.container.js

@@ -8,7 +8,7 @@ import { getUser, isLogged } from '../../App/App.selectors';
 import API from '../../../api';
 import messages from './Subscribe.messages';
 
-import { isAndroid } from '../../../cordova-util';
+import { isAndroid, isIOS } from '../../../cordova-util';
 import {
   updateSubscriberId,
   updateSubscription,
@@ -195,7 +195,7 @@ export class SubscribeContainer extends PureComponent {
 
       let localReceipts = '';
       let offers, offer;
-      if (isAndroid()) {
+      if (isAndroid() || isIOS()) {
         const storeProducts = await window.CdvPurchase.store.products;
         const prod = storeProducts.find(p => {
           return p.id === product.subscriptionId;
@@ -207,14 +207,22 @@ export class SubscribeContainer extends PureComponent {
         try {
           await window.CdvPurchase.store.update();
           offers = prod.offers;
-          offer = offers.find(offer => offer.tags[0] === product.tag);
+          const findCallback = isAndroid()
+            ? offer => offer.tags[0] === product.tag
+            : offer => offer.productId === product.subscriptionId;
+          offer = offers.find(findCallback);
         } catch (err) {
           console.error('Cannot subscribe product. Error: ', err.message);
           this.handleError(err);
           return;
         }
       }
 
+      const filterInAppPurchaseIOSTransactions = uniqueReceipt =>
+        uniqueReceipt.transactions.filter(
+          transaction => transaction.transactionId !== 'appstore.application'
+        );
+
       try {
         // update the api
         const requestOrigin =
@@ -225,40 +233,77 @@ export class SubscribeContainer extends PureComponent {
         // check if current subscriber already bought in this device
         if (localReceipts.length) {
           const lastReceipt = localReceipts.slice(-1)[0];
-          if (
-            lastReceipt &&
-            lastReceipt?.transactions[0]?.nativePurchase?.orderId !==
-              subscriber.transaction?.transactionId
-          ) {
-            this.handleError({
-              code: '0001',
-              message: intl.formatMessage(messages.googleAccountAlreadyOwns)
-            });
-            return;
+          if (isAndroid()) {
+            if (
+              lastReceipt &&
+              lastReceipt?.transactions[0]?.nativePurchase?.orderId !==
+                subscriber.transaction?.transactionId
+            ) {
+              this.handleError({
+                code: '0001',
+                message: intl.formatMessage(messages.googleAccountAlreadyOwns)
+              });
+              return;
+            }
+          }
+          if (isIOS()) {
+            //IOS have a unique receipt here => 'lastReceipt'
+            const inAppPurchaseTransactions = filterInAppPurchaseIOSTransactions(
+              localReceipts[0]
+            );
+
+            const lastTransaction = inAppPurchaseTransactions.slice(-1)[0];
+            if (
+              inAppPurchaseTransactions.length > 0 &&
+              lastTransaction?.transactionId !==
+                subscriber.transaction?.transactionId
+            ) {
+              this.handleError({
+                code: '0001',
+                message: intl.formatMessage(messages.appleAccountAlreadyOwns)
+              });
+              return;
+            }
           }
         }
+
         await API.updateSubscriber(apiProduct);
 
         // proceed with the purchase
-        if (isAndroid()) {
+        if (isAndroid() || isIOS()) {
           const order = await window.CdvPurchase.store.order(offer);
           if (order && order.isError) throw order;
           updateSubscription({
             ownedProduct: {
               ...product,
-              platform: 'android-playstore'
+              platform: isAndroid() ? 'android-playstore' : 'app-store'
             }
           });
         }
       } catch (err) {
         if (err.response?.data.error === 'subscriber not found') {
           // check if current subscriber already bought in this device
-          if (localReceipts.length) {
-            this.handleError({
-              code: '0001',
-              message: intl.formatMessage(messages.googleAccountAlreadyOwns)
-            });
-            return;
+          if (isAndroid()) {
+            if (localReceipts.length) {
+              this.handleError({
+                code: '0001',
+                message: intl.formatMessage(messages.googleAccountAlreadyOwns)
+              });
+              return;
+            }
+          }
+          if (isIOS()) {
+            const localInAppPurchaseTransactions = filterInAppPurchaseIOSTransactions(
+              localReceipts[0]
+            );
+
+            if (localInAppPurchaseTransactions.length) {
+              this.handleError({
+                code: '0001',
+                message: intl.formatMessage(messages.appleAccountAlreadyOwns)
+              });
+              return;
+            }
           }
           try {
             const newSubscriber = {
@@ -269,13 +314,13 @@ export class SubscribeContainer extends PureComponent {
             };
             const res = await API.createSubscriber(newSubscriber);
             updateSubscriberId(res._id);
-            if (isAndroid()) {
+            if (isAndroid() || isIOS()) {
               const order = await window.CdvPurchase.store.order(offer);
               if (order && order.isError) throw order;
               updateSubscription({
                 ownedProduct: {
                   ...product,
-                  platform: 'android-playstore'
+                  platform: isAndroid() ? 'android-playstore' : 'app-store'
                 }
               });
             }

src/components/Settings/Subscribe/Subscribe.messages.js

@@ -89,6 +89,11 @@ export default defineMessages({
     id: 'cboard.components.Settings.Subscribe.not_subscribed',
     defaultMessage: 'You are not subscribed. '
   },
+  unverified: {
+    id: 'cboard.components.Settings.Subscribe.unverified',
+    defaultMessage:
+      'An error ocurs during validation of your purchase. Please refresh'
+  },
   refresh: {
     id: 'cboard.components.Settings.Subscribe.refresh',
     defaultMessage: 'Refresh'
@@ -148,6 +153,11 @@ export default defineMessages({
     defaultMessage:
       'It looks like your Google account has already purchased a product. Try restarting the app.'
   },
+  appleAccountAlreadyOwns: {
+    id: 'cboard.components.Settings.Subscribe.appleAccountAlreadyOwns',
+    defaultMessage:
+      'It looks like your Apple account has already purchased a product. Try restarting the app.'
+  },
   fallback: {
     id: 'cboard.components.Settings.Subscribe.fallback',
     defaultMessage: 'Wait please...'

src/components/Settings/Subscribe/SubscriptionInfo.js

@@ -29,8 +29,8 @@ import {
 
 import RefreshIcon from '@material-ui/icons/Refresh';
 import IconButton from '../../UI/IconButton';
-import { isAndroid, isElectron } from '../../../cordova-util';
-import { GOOGLE_PLAY_STORE_URL } from './Subscribe.constants';
+import { isAndroid, isElectron, isIOS } from '../../../cordova-util';
+import { APP_STORE_URL, GOOGLE_PLAY_STORE_URL } from './Subscribe.constants';
 
 const propTypes = {
   ownedProduct: PropTypes.object.isRequired,
@@ -131,13 +131,15 @@ const SubscriptionInfo = ({
       </div>
       <div className="Subscribe__Info__Button__Container">
         <Button
-          variant={isAndroid() ? 'contained' : 'text'}
+          variant={isAndroid() || isIOS() ? 'contained' : 'text'}
           fullWidth={false}
           color="primary"
           disabled={ownedProduct.platform === 'paypal' && status !== ACTIVE}
           onClick={() => {
             if (isAndroid() && ownedProduct.platform === 'android-playstore')
               window.CdvPurchase.store.manageSubscriptions();
+            if (isIOS() && ownedProduct.platform === 'ios-appstore')
+              window.CdvPurchase.store.manageSubscriptions();
             if (ownedProduct.platform === 'paypal') setCancelDialog(true);
             if (!isAndroid() && ownedProduct.platform === 'android-playstore') {
               if (isElectron()) {
@@ -148,6 +150,13 @@ const SubscriptionInfo = ({
                 window.open(GOOGLE_PLAY_STORE_URL, '_blank');
               }
             }
+            if (!isIOS() && ownedProduct.platform === 'ios-appstore') {
+              if (isElectron()) {
+                window.cordova.plugins.DefaultBrowser.open(APP_STORE_URL);
+              } else {
+                window.open(APP_STORE_URL, '_blank');
+              }
+            }
           }}
           style={{ marginLeft: '1em' }}
         >