[Issue-1799] Add condition OS version, App version for MKT campaign

package.json

@@ -67,6 +67,7 @@
     "@subwallet/react-ui": "^5.1.2-b77",
     "@subwallet/ui-keyring": "0.1.6",
     "@walletconnect/utils": "2.8.4",
+    "compare-versions": "^6.1.1",
     "deprecated-react-native-prop-types": "^4.0.0",
     "eventemitter3": "^5.0.0",
     "humanize-duration": "^3.31.0",

src/hooks/static-content/useHandleAppBannerMap.ts

@@ -5,6 +5,10 @@ import { useDispatch, useSelector } from 'react-redux';
 import { RootState } from 'stores/index';
 import { AppBannerData } from '@subwallet/extension-base/services/mkt-campaign-service/types';
 import { getCountry } from 'react-native-localize';
+import { Platform } from 'react-native';
+import { getIosVersion } from 'utils/common';
+import { satisfies } from 'compare-versions';
+import { getVersion } from 'react-native-device-info';
 
 export const useHandleAppBannerMap = () => {
   const dispatch = useDispatch();
@@ -50,21 +54,31 @@ export const useHandleAppBannerMap = () => {
     [bannerHistoryMap, dispatch],
   );
 
-  const filteredDataByLocation = useMemo(() => {
-    return appBannerData.filter(({ locations }) => {
+  const filteredData = useMemo(() => {
+    return appBannerData.filter(({ locations, iosVersionRange, appVersionRange }) => {
       if (locations && locations.length) {
         const countryId = getCountry();
         const locationIds = locations.map(item => item.split('_')[1]);
         return locationIds.includes(countryId);
-      } else {
-        return true;
       }
+
+      if (iosVersionRange && Platform.OS === 'ios') {
+        const iosVersion = getIosVersion();
+        return satisfies(iosVersion, iosVersionRange);
+      }
+
+      if (appVersionRange) {
+        const appVersion = getVersion();
+        return satisfies(appVersion, appVersionRange);
+      }
+
+      return true;
     });
   }, [appBannerData]);
 
   const appBannerMap = useMemo(() => {
-    if (filteredDataByLocation) {
-      const result: Record<string, AppBannerData[]> = filteredDataByLocation.reduce((r, a) => {
+    if (filteredData) {
+      const result: Record<string, AppBannerData[]> = filteredData.reduce((r, a) => {
         r[a.position] = r[a.position] || [];
         r[a.position].push(a);
         return r;
@@ -74,7 +88,7 @@ export const useHandleAppBannerMap = () => {
     } else {
       return {};
     }
-  }, [filteredDataByLocation]);
+  }, [filteredData]);
 
   return {
     updateBannerHistoryMap,

src/hooks/static-content/useHandleAppPopupMap.ts

@@ -5,6 +5,10 @@ import { useDispatch, useSelector } from 'react-redux';
 import { RootState } from 'stores/index';
 import { AppPopupData } from '@subwallet/extension-base/services/mkt-campaign-service/types';
 import { getCountry } from 'react-native-localize';
+import { satisfies } from 'compare-versions';
+import { getIosVersion } from 'utils/common';
+import { Platform } from 'react-native';
+import { getVersion } from 'react-native-device-info';
 
 export const useHandleAppPopupMap = () => {
   const { appPopupData, popupHistoryMap } = useSelector((state: RootState) => state.staticContent);
@@ -42,21 +46,31 @@ export const useHandleAppPopupMap = () => {
     [dispatch, popupHistoryMap],
   );
 
-  const filteredDataByLocation = useMemo(() => {
-    return appPopupData.filter(({ locations }) => {
+  const filteredData = useMemo(() => {
+    return appPopupData.filter(({ locations, ios_version_range, app_version_range }) => {
       if (locations && locations.length) {
         const countryId = getCountry();
         const locationIds = locations.map(item => item.split('_')[1]);
         return locationIds.includes(countryId);
-      } else {
-        return true;
       }
+
+      if (ios_version_range && Platform.OS === 'ios') {
+        const iosVersion = getIosVersion();
+        return satisfies(iosVersion, ios_version_range);
+      }
+
+      if (app_version_range) {
+        const appVersion = getVersion();
+        return satisfies(appVersion, app_version_range);
+      }
+
+      return true;
     });
   }, [appPopupData]);
 
   const appPopupMap = useMemo(() => {
-    if (filteredDataByLocation) {
-      const result: Record<string, AppPopupData[]> = filteredDataByLocation.reduce((r, a) => {
+    if (filteredData) {
+      const result: Record<string, AppPopupData[]> = filteredData.reduce((r, a) => {
         r[a.position] = r[a.position] || [];
         r[a.position].push(a);
         return r;
@@ -66,7 +80,7 @@ export const useHandleAppPopupMap = () => {
     } else {
       return {};
     }
-  }, [filteredDataByLocation]);
+  }, [filteredData]);
 
   return {
     updatePopupHistoryMap,

src/utils/common.ts

@@ -1,3 +1,5 @@
+import { Platform } from 'react-native';
+
 export const simpleDeepClone = <T>(s: T) => {
   return JSON.parse(JSON.stringify(s)) as T;
 };
@@ -9,3 +11,11 @@ export function shuffle<T = any>(array: T[]) {
     [array[i], array[j]] = [array[j], array[i]];
   }
 }
+
+export const getIosVersion = (): string => {
+  if (Platform.OS !== 'ios') {
+    return '0';
+  }
+
+  return Platform.Version;
+};

yarn.lock

@@ -8376,6 +8376,11 @@ commondir@^1.0.1:
   resolved "https://registry.yarnpkg.com/commondir/-/commondir-1.0.1.tgz#ddd800da0c66127393cca5950ea968a3aaf1253b"
   integrity sha512-W9pAhw0ja1Edb5GVdIF1mjZw/ASI0AlShXM83UUGe2DVr5TdAPEA1OA8m/g8zWp9x6On7gqufY+FatDbC3MDQg==
 
+compare-versions@^6.1.1:
+  version "6.1.1"
+  resolved "https://registry.yarnpkg.com/compare-versions/-/compare-versions-6.1.1.tgz#7af3cc1099ba37d244b3145a9af5201b629148a9"
+  integrity sha512-4hm4VPpIecmlg59CHXnRDnqGplJFrbLG4aFEl5vl6cK1u76ws3LLvX7ikFnTDl5vo39sjWD6AaDPYodJp/NNHg==
+
 component-emitter@^1.3.0:
   version "1.3.1"
   resolved "https://registry.yarnpkg.com/component-emitter/-/component-emitter-1.3.1.tgz#ef1d5796f7d93f135ee6fb684340b26403c97d17"