@wavemaker/app-rn-runtime 11.7.0-rc.161 → 11.7.0-rc.162

app-rn-runtime/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@wavemaker/app-rn-runtime",
-  "version": "11.7.0-rc.161",
+  "version": "11.7.0-rc.162",
   "description": "''",
   "main": "index",
   "module": "index",
@@ -17,6 +17,7 @@
     "copy-resources": "mkdir -p ./dist && cp -r ./lib/module ./dist && cp ./package.json ./dist/module",
     "lint": "eslint \"**/*.{js,ts,tsx}\"",
     "build": "bob build && node ./scripts/build.js post-build",
+    "build:test": "cd ./test && tsc",
     "release": "release-it",
     "example": "yarn --cwd example",
     "pods": "cd example && pod-install --quiet",
@@ -39,102 +40,111 @@
     "registry": "https://registry.npmjs.org/"
   },
   "dependencies": {
-    "@expo/vector-icons": "13.0.0",
-    "@react-native-async-storage/async-storage": "1.18.2",
-    "@react-native-community/datetimepicker": "7.2.0",
-    "@react-native-community/netinfo": "9.3.10",
-    "@react-native-community/slider": "4.4.2",
-    "@react-native-masked-view/masked-view": "0.2.9",
+    "@expo/vector-icons": "14.0.0",
+    "@react-native-async-storage/async-storage": "1.21.0",
+    "@react-native-community/datetimepicker": "7.6.1",
+    "@react-native-community/netinfo": "11.1.0",
+    "@react-native-community/slider": "4.5.2",
+    "@react-native-masked-view/masked-view": "0.3.0",
+    "@react-native/assets-registry": "0.74.83",
     "@react-navigation/drawer": "6.6.3",
     "@react-navigation/native": "6.1.7",
-    "@react-navigation/stack": "^6.3.7",
-    "@types/lodash-es": "^4.17.6",
-    "@wavemaker/variables": "11.7.0-rc.161",
-    "axios": "^1.4.0",
+    "@react-navigation/stack": "6.3.29",
+    "@wavemaker/variables": "11.7.0-rc.162",
+    "axios": "1.6.8",
     "color": "4.2.3",
-    "cross-env": "^5.2.0",
-    "css-mediaquery": "^0.1.2",
-    "d3-shape": "^3.2.0",
-    "expo-application": "^5.4.0",
-    "expo-font": "11.4.0",
-    "expo-linear-gradient": "12.3.0",
-    "expo-modules-core": "~1.1.0",
-    "fast-xml-parser": "^3.17.6",
-    "imask": "^7.5.0",
-    "lodash-es": "^4.17.21",
-    "lottie-react-native": "5.1.6",
-    "moment": "^2.29.1",
-    "react-lottie-player": "1.5.4",
-    "react-native-animatable": "^1.3.3",
-    "react-native-circular-progress": "1.3.9",
-    "react-native-logs": "^4.0.1",
-    "react-native-paper": "^4.11.1",
-    "react-native-paper-dates": "^0.8.0",
-    "react-native-reanimated": "3.3.0",
-    "react-native-screens": "3.22.0",
-    "react-native-size-scaling": "^0.5.1",
+    "cross-env": "7.0.3",
+    "css-mediaquery": "0.1.2",
+    "d3-shape": "3.2.0",
+    "expo-application": "5.8.4",
+    "expo-font": "11.10.3",
+    "expo-linear-gradient": "12.7.2",
+    "expo-modules-core": "1.11.13",
+    "fast-xml-parser": "4.3.6",
+    "imask": "7.6.0",
+    "lodash-es": "4.17.21",
+    "lottie-react-native": "6.5.1",
+    "moment": "2.30.1",
+    "react-lottie-player": "2.0.0",
+    "react-native-animatable": "1.4.0",
+    "react-native-circular-progress": "1.4.0",
+    "react-native-logs": "5.1.0",
+    "react-native-mime-types": "2.5.0",
+    "react-native-paper": "5.12.3",
+    "react-native-paper-dates": "0.22.7",
+    "react-native-reanimated": "3.6.2",
+    "react-native-screens": "3.29.0",
+    "react-native-size-scaling": "0.5.1",
     "react-native-snap-carousel": "3.9.1",
-    "react-native-svg": "13.9.0",
-    "react-native-web": "0.18.12",
-    "react-native-webview": "13.2.2",
-    "react-xml-parser": "^1.1.8",
-    "xml2js": "^0.4.23"
+    "react-native-svg": "14.1.0",
+    "react-native-web": "0.19.6",
+    "react-native-webview": "13.6.4",
+    "react-xml-parser": "1.1.8"
   },
   "devDependencies": {
-    "@commitlint/config-conventional": "^11.0.0",
-    "@react-native-community/eslint-config": "^2.0.0",
-    "@release-it/conventional-changelog": "^2.0.0",
-    "@testing-library/jest-native": "^4.0.1",
-    "@testing-library/react-native": "^7.2.0",
-    "@types/color": "^3.0.3",
-    "@types/css-mediaquery": "^0.1.1",
-    "@types/enzyme": "^3.10.12",
-    "@types/jest": "^29.2.3",
-    "@types/react": "^18.0.25",
-    "@types/react-native": "0.70.5",
-    "@types/react-native-snap-carousel": "^3.8.5",
-    "@types/react-test-renderer": "18.0.0",
-    "babel-jest": "^26.6.3",
-    "babel-preset-env": "^1.7.0",
-    "babel-preset-react": "^6.24.1",
-    "commitlint": "^11.0.0",
-    "enzyme": "^3.11.0",
-    "eslint": "^7.2.0",
-    "eslint-config-prettier": "^7.0.0",
-    "eslint-plugin-prettier": "^3.1.3",
-    "execa": "^5.0.0",
-    "expo-av": "13.4.1",
-    "expo-barcode-scanner": "12.5.3",
-    "expo-calendar": "11.3.0",
-    "expo-camera": "13.4.2",
-    "expo-contacts": "12.2.0",
-    "expo-device": "5.4.0",
-    "expo-document-picker": "11.5.4",
-    "expo-file-system": "15.4.3",
-    "expo-location": "16.1.0",
-    "expo-network": "5.4.0",
-    "expo-splash-screen": "0.20.5",
-    "expo-web-browser": "12.3.2",
-    "handlebars": "^4.7.7",
-    "jest": "^29.3.1",
-    "jest-html-reporter": "^3.7.0",
-    "ncp": "^2.0.0",
+    "@babel/core": "7.24.0",
+    "@babel/plugin-transform-class-static-block": "7.24.6",
+    "@babel/preset-env": "7.24.7",
+    "@commitlint/config-conventional": "19.2.2",
+    "@react-native-community/eslint-config": "3.2.0",
+    "@release-it/conventional-changelog": "2.0.0",
+    "@testing-library/jest-native": "5.4.3",
+    "@testing-library/react-native": "12.5.0",
+    "@types/color": "3.0.6",
+    "@types/css-mediaquery": "0.1.4",
+    "@types/enzyme": "3.10.18",
+    "@types/jest": "29.5.12",
+    "@types/lodash-es": "4.17.12",
+    "@types/react": "18.3.1",
+    "@types/react-native": "0.73.0",
+    "@types/react-native-snap-carousel": "3.8.11",
+    "@types/react-test-renderer": "18.3.0",
+    "babel-jest": "29.7.0",
+    "babel-preset-env": "1.7.0",
+    "babel-preset-react": "6.24.1",
+    "babel-preset-react-native": "4.0.1",
+    "commitlint": "19.3.0",
+    "enzyme": "3.11.0",
+    "eslint": "9.2.0",
+    "eslint-config-prettier": "9.1.0",
+    "eslint-plugin-jest-dom": "5.4.0",
+    "eslint-plugin-prettier": "5.1.3",
+    "execa": "5.0.0",
+    "expo-av": "13.10.6",
+    "expo-barcode-scanner": "12.9.3",
+    "expo-calendar": "12.2.1",
+    "expo-camera": "14.1.3",
+    "expo-contacts": "12.8.2",
+    "expo-device": "5.9.4",
+    "expo-document-picker": "11.10.1",
+    "expo-file-system": "16.0.9",
+    "expo-location": "16.5.5",
+    "expo-network": "5.8.0",
+    "expo-splash-screen": "0.26.5",
+    "expo-web-browser": "12.8.2",
+    "handlebars": "4.7.8",
+    "jest": "29.7.0",
+    "jest-expo": "50.0.4",
+    "jest-html-reporter": "3.10.2",
+    "metro-react-native-babel-preset": "^0.77.0",
+    "mockdate": "3.0.5",
+    "ncp": "2.0.0",
     "react": "18.2.0",
     "react-dom": "18.2.0",
-    "react-native": "0.72.4",
-    "react-native-builder-bob": "^0.18.1",
-    "react-native-gesture-handler": "2.12.1",
-    "react-native-safe-area-context": "4.6.3",
-    "react-test-renderer": "18.1.0",
-    "release-it": "^14.2.2",
-    "tar": "^6.1.0",
-    "typescript": "^5.1.3",
+    "react-native": "0.73.6",
+    "react-native-builder-bob": "0.18.1",
+    "react-native-gesture-handler": "2.14.0",
+    "react-native-safe-area-context": "4.8.2",
+    "react-test-renderer": "18.2.0",
+    "release-it": "14.2.2",
+    "tar": "6.1.0",
+    "typescript": "5.1.3",
     "victory-native": "36.6.11",
-    "yargs": "^16.2.0",
-    "@wavemaker/variables": "11.7.0-rc.161"
+    "yargs": "16.2.0",
+    "@wavemaker/variables": "11.7.0-rc.162"
   },
   "jest": {
-    "preset": "react-native",
+    "preset": "jest-expo",
     "testRegex": "(test/.*|(\\.|/)(test|spec))\\.[t]sx?$",
     "setupFiles": [
       "./test/jest.setup.js"
@@ -142,13 +152,26 @@
     "setupFilesAfterEnv": [
       "@testing-library/jest-native/extend-expect"
     ],
+    "collectCoverage": true,
+    "collectCoverageFrom": [
+      "**/*.{js,jsx,ts,tsx}",
+      "!**/coverage/**",
+      "!**/node_modules/**",
+      "!**/babel.config.js",
+      "!**/jest.setup.js",
+      "!**/dist/**"
+    ],
     "coverageDirectory": "./dist/reports/coverage",
     "transform": {
       "^.+\\.(js|jsx|mjs)$": "<rootDir>/node_modules/babel-jest"
     },
+    "transformIgnorePatterns": [
+      "node_modules/(?!((jest-)?react-native|@react-native(-community)?)|expo(nent)?|@expo(nent)?/.*|@expo-google-fonts/.*|react-navigation|@react-navigation/.*|@unimodules/.*|unimodules|sentry-expo|native-base|react-native-svg|@wavemaker|@wavemaker/app-rn-runtime/components/basic/modal/modal.component|expo-linear-gradient|react-native-gesture-handler|@react-native-community|@react-native-community/datetimepicker|react-native-reanimated|d3*|victory-native|victory-.*)"
+    ],
     "moduleNameMapper": {
       "^lodash-es$": "lodash",
-      "^@wavemaker/app-rn-runtime/(.*)$": "<rootDir>/src/$1"
+      "^@wavemaker/app-rn-runtime/(.*)$": "<rootDir>/src/$1",
+      "react-native-webview": "<rootDir>/node_modules/react-native-webview/src/index.ts"
     },
     "modulePathIgnorePatterns": [
       "<rootDir>/node_modules/(?!lodash-es)",

app-rn-runtime/runtime/App.js

@@ -1,9 +1,10 @@
 function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
-function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return typeof key === "symbol" ? key : String(key); }
-function _toPrimitive(input, hint) { if (typeof input !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (typeof res !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : i + ""; }
+function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
 import React from 'react';
 import axios from 'axios';
-import { Platform, TouchableOpacity, View, StatusBar, KeyboardAvoidingView } from 'react-native';
+import { Platform, TouchableOpacity, View, StatusBar } from 'react-native';
+import { GestureHandlerRootView } from 'react-native-gesture-handler';
 import ProtoTypes from 'prop-types';
 import { SafeAreaProvider, SafeAreaInsetsContext, SafeAreaView } from 'react-native-safe-area-context';
 import { DefaultTheme, Provider as PaperProvider } from 'react-native-paper';
@@ -16,6 +17,7 @@ import EventNotifier from '@wavemaker/app-rn-runtime/core/event-notifier';
 import { ThemeProvider } from '@wavemaker/app-rn-runtime/styles/theme';
 import StorageService from '@wavemaker/app-rn-runtime/core/storage.service';
 import ConstantService from '@wavemaker/app-rn-runtime/core/constant.service';
+import NetworkService from '@wavemaker/app-rn-runtime/core/network.service';
 import injector from '@wavemaker/app-rn-runtime/core/injector';
 import formatters from '@wavemaker/app-rn-runtime/core/formatters';
 import { deepCopy, isWebPreviewMode } from '@wavemaker/app-rn-runtime/core/utils';
@@ -78,13 +80,12 @@ const SUPPORTED_SERVICES = {
   Utils: Utils,
   CONSTANTS: ConstantService,
   StorageService: StorageService,
-  AppDisplayManagerService: AppDisplayManagerService
+  AppDisplayManagerService: AppDisplayManagerService,
+  i18nService: AppI18nService
 };
 export default class BaseApp extends React.Component {
   constructor(props) {
-    var _this;
     super(props);
-    _this = this;
     _defineProperty(this, "Actions", {});
     _defineProperty(this, "Variables", {});
     _defineProperty(this, "onAppVariablesReady", () => {});
@@ -115,6 +116,7 @@ export default class BaseApp extends React.Component {
     _defineProperty(this, "lib", preparePatch(() => {
       this.refresh();
     }));
+    _defineProperty(this, "networkStatus", {});
     SplashScreen.preventAutoHideAsync();
     setTimeout(() => SplashScreen.hideAsync(), 10000);
     this.appConfig.app = this;
@@ -126,10 +128,9 @@ export default class BaseApp extends React.Component {
     this.baseUrl = this.appConfig.url;
     let wait = 0;
     this.bindServiceInterceptors();
-    this.appConfig.refresh = function () {
-      let complete = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;
+    this.appConfig.refresh = (complete = false) => {
       if (complete) {
-        _this.reload();
+        this.reload();
         return;
       }
       if (!wait) {
@@ -138,28 +139,31 @@ export default class BaseApp extends React.Component {
         refreshAfterWait = false;
         setTimeout(() => {
           var _this$commonPartial, _this$appConfig$curre;
-          _this.forceUpdate();
-          (_this$commonPartial = _this.commonPartial) === null || _this$commonPartial === void 0 ? void 0 : _this$commonPartial.forceUpdate();
-          (_this$appConfig$curre = _this.appConfig.currentPage) === null || _this$appConfig$curre === void 0 ? void 0 : _this$appConfig$curre.forceUpdate();
-          _this.watcher.check();
+          this.forceUpdate();
+          (_this$commonPartial = this.commonPartial) === null || _this$commonPartial === void 0 || _this$commonPartial.forceUpdate();
+          (_this$appConfig$curre = this.appConfig.currentPage) === null || _this$appConfig$curre === void 0 || _this$appConfig$curre.forceUpdate();
+          this.watcher.check();
         });
         setTimeout(() => {
           wait = 0;
-          refreshAfterWait && _this.appConfig.refresh();
+          refreshAfterWait && this.appConfig.refresh();
         }, wait);
       } else {
         RENDER_LOGGER.debug('will refresh the app in the next cycle.');
         refreshAfterWait = true;
       }
     };
+    this.cleanup.push(NetworkService.notifier.subscribe('onNetworkStateChange', networkState => {
+      this.networkStatus = {
+        ...networkState
+      };
+      this.refresh();
+    }));
   }
   subscribe(event, fn) {
     return this.eventNotifier.subscribe(event, fn);
   }
-  notify(event) {
-    for (var _len = arguments.length, args = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
-      args[_key - 1] = arguments[_key];
-    }
+  notify(event, ...args) {
     return this.eventNotifier.notify(event, args);
   }
   get activePage() {
@@ -204,6 +208,9 @@ export default class BaseApp extends React.Component {
       return Promise.reject('Not able to invoke Native API in this platform.');
     }
   }
+  triggerPageReady(activePageName, activePageScope) {
+    this.onPageReady(activePageName, activePageScope);
+  }
   onPageReady(activePageName, activePageScope) {}
   setTimezone(timezone) {
     AppI18nService.setTimezone(timezone);
@@ -211,8 +218,7 @@ export default class BaseApp extends React.Component {
   get spinner() {
     return AppSpinnerService;
   }
-  openBrowser(url) {
-    let params = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
+  openBrowser(url, params = {}) {
     if (url) {
       if (isWebPreviewMode()) {
         window.open(url, '_blank');
@@ -260,8 +266,7 @@ export default class BaseApp extends React.Component {
       return Promise.reject(error);
     })];
   }
-  eval(fn) {
-    let failOnError = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
+  eval(fn, failOnError = false) {
     try {
       return fn.call(this);
     } catch (e) {
@@ -283,9 +288,7 @@ export default class BaseApp extends React.Component {
       this.onAppVariablesReady();
       this.isStarted = true;
       this.forceUpdate();
-    }, () => {}).then(() => {
-      SplashScreen.hideAsync().then(() => {});
-    });
+    }, () => {});
     this.startUpActions.map(a => this.Actions[a] && this.Actions[a].invoke());
   }
   componentWillUnmount() {
@@ -365,19 +368,25 @@ export default class BaseApp extends React.Component {
             })
           }, /*#__PURE__*/React.createElement(Animatedview, {
             entryanimation: o.animation || 'fadeIn',
+            delay: o.animationdelay,
             ref: ref => {
               this.animatedRef = ref;
               AppModalService.animatedRefs[i] = ref;
             },
             style: [styles.appModalContent, o.contentStyle]
+          }, /*#__PURE__*/React.createElement(GestureHandlerRootView, {
+            style: {
+              width: '100%',
+              alignItems: 'center'
+            }
           }, /*#__PURE__*/React.createElement(View, {
             onStartShouldSetResponder: evt => true,
             onResponderEnd: e => e.stopPropagation(),
             style: {
               width: '100%',
-              'alignItems': 'center'
+              alignItems: 'center'
             }
-          }, this.getProviders(o.content))));
+          }, this.getProviders(o.content)))));
         }));
       }
     });
@@ -423,44 +432,39 @@ export default class BaseApp extends React.Component {
     }
   }
   renderApp(commonPartial) {
-    var _this2 = this;
     this.autoUpdateVariables.forEach(value => {
       var _this$Variables$value;
       return (_this$Variables$value = this.Variables[value]) === null || _this$Variables$value === void 0 ? void 0 : _this$Variables$value.invokeOnParamChange();
     });
     return /*#__PURE__*/React.createElement(SafeAreaProvider, null, /*#__PURE__*/React.createElement(PaperProvider, {
       theme: this.paperTheme
-    }, /*#__PURE__*/React.createElement(React.Fragment, null, Platform.OS === 'web' ? this.renderIconsViewSupportForWeb() : null, /*#__PURE__*/React.createElement(SafeAreaInsetsContext.Consumer, null, function () {
-      var _this2$props, _this2$appConfig$draw, _this2$appConfig$draw2;
-      let insets = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {
-        top: 0,
-        bottom: 0,
-        left: 0,
-        right: 0
-      };
-      return _this2.getProviders( /*#__PURE__*/React.createElement(SafeAreaView, {
+    }, /*#__PURE__*/React.createElement(React.Fragment, null, Platform.OS === 'web' ? this.renderIconsViewSupportForWeb() : null, /*#__PURE__*/React.createElement(SafeAreaInsetsContext.Consumer, null, (insets = {
+      top: 0,
+      bottom: 0,
+      left: 0,
+      right: 0
+    }) => {
+      var _this$props, _this$appConfig$drawe, _this$appConfig$drawe2;
+      return this.getProviders( /*#__PURE__*/React.createElement(SafeAreaView, {
         style: {
           flex: 1
         }
-      }, /*#__PURE__*/React.createElement(StatusBar, null), /*#__PURE__*/React.createElement(FixedViewContainer, null, /*#__PURE__*/React.createElement(ThemeProvider, {
-        value: _this2.appConfig.theme
-      }, /*#__PURE__*/React.createElement(KeyboardAvoidingView, {
-        behavior: Platform.OS === "ios" ? "padding" : undefined,
-        style: {
-          flex: 1
-        }
-      }, /*#__PURE__*/React.createElement(View, {
+      }, /*#__PURE__*/React.createElement(StatusBar, null), /*#__PURE__*/React.createElement(ThemeProvider, {
+        value: this.appConfig.theme
+      }, /*#__PURE__*/React.createElement(FixedViewContainer, null, /*#__PURE__*/React.createElement(View, {
+        style: styles.container
+      }, /*#__PURE__*/React.createElement(GestureHandlerRootView, {
         style: styles.container
       }, /*#__PURE__*/React.createElement(AppNavigator, {
-        app: _this2,
-        landingPage: _this2.props.pageName,
-        landingPageParams: ((_this2$props = _this2.props) === null || _this2$props === void 0 ? void 0 : _this2$props.pageName) && _this2.props,
-        hideDrawer: ((_this2$appConfig$draw = _this2.appConfig.drawer) === null || _this2$appConfig$draw === void 0 ? void 0 : _this2$appConfig$draw.getContent()) === null,
-        drawerContent: () => _this2.appConfig.drawer ? _this2.getProviders(_this2.appConfig.drawer.getContent()) : null,
-        drawerAnimation: (_this2$appConfig$draw2 = _this2.appConfig.drawer) === null || _this2$appConfig$draw2 === void 0 ? void 0 : _this2$appConfig$draw2.getAnimation()
-      }), commonPartial, _this2.renderToasters(), _this2.renderDialogs(), _this2.renderDisplayManager())), _this2.appConfig.url ? /*#__PURE__*/React.createElement(WmNetworkInfoToaster, {
-        appLocale: _this2.appConfig.appLocale
-      }) : null))));
+        app: this,
+        landingPage: this.props.pageName,
+        landingPageParams: ((_this$props = this.props) === null || _this$props === void 0 ? void 0 : _this$props.pageName) && this.props,
+        hideDrawer: ((_this$appConfig$drawe = this.appConfig.drawer) === null || _this$appConfig$drawe === void 0 ? void 0 : _this$appConfig$drawe.getContent()) === null,
+        drawerContent: () => this.appConfig.drawer ? this.getProviders(this.appConfig.drawer.getContent()) : null,
+        drawerAnimation: (_this$appConfig$drawe2 = this.appConfig.drawer) === null || _this$appConfig$drawe2 === void 0 ? void 0 : _this$appConfig$drawe2.getAnimation()
+      }), commonPartial)), this.appConfig.url ? /*#__PURE__*/React.createElement(WmNetworkInfoToaster, {
+        appLocale: this.appConfig.appLocale
+      }) : null), this.renderToasters(), this.renderDialogs(), this.renderDisplayManager())));
     }))));
   }
 }