@wavemaker/rn-codegen 11.8.0-rc.5684 → 11.8.1-next.45208

rn-codegen/src/templates/app.template

@@ -15,7 +15,6 @@ import BaseApp from '@wavemaker/app-rn-runtime/runtime/App';
 import { WmMemo } from '@wavemaker/app-rn-runtime/runtime/memo.component';
 {{#if sslPinning}}
 import { initializeSslPinning, isSslPinningAvailable } from 'react-native-ssl-public-key-pinning';
-import { getPublicHashKey } from '@wavemaker/react-native-ssl-publickey';
 {{/if}}
 
 import { isWebPreviewMode } from '@wavemaker/app-rn-runtime/core/utils';
@@ -69,11 +68,11 @@ class App extends BaseApp {
   } 
 
   getServiceDefinitions() {
-    {{#if profile.useLocalMetadata}}
-      return Promise.resolve(require('./metadata/app/service-definitions.json'))
-    {{else}}
     return axios.get(this.baseUrl + '/services/servicedefs')
       .then((response) => response?.data || {})
+      {{#if profile.useLocalMetadata}}
+        .catch(() => import('./metadata/app/service-definitions.json').then(mod => mod.default))
+      {{else}}
         .catch(() => ({}))
       {{/if}}
       .then(data => {
@@ -93,14 +92,13 @@ class App extends BaseApp {
   }
 
   loadWmProperties() {
-    {{#if profile.useLocalMetadata}}
-      return Promise.resolve(require('./src/wmProperties').default)
-    {{else}}
     return axios.get(this.baseUrl + '/services/application/wmProperties.js')
       .then((response) => {
           const data = response.data;
           return JSON.parse(data.substring(data.indexOf('{'), data.length - 1));
       })
+    {{#if profile.useLocalMetadata}}
+      .catch(() => import('./src/wmProperties').then(mod => mod.default))
     {{/if}}
       .then(appProperties => {
         this.appConfig.appProperties = appProperties;
@@ -244,21 +242,9 @@ class App extends BaseApp {
 
 
   {{#if sslPinning}}
-  async initSSLPininng() {
-    let sslPinning = {{{stringify sslPinning}}}
+  initSSLPininng() {
     if (isSslPinningAvailable()) {
-      const updatedSslPinning = {};
-
-      for (const key of Object.keys(sslPinning)) {
-        const value = sslPinning[key];
-        if (value.loadOnStartup) {
-          const publickey = await getPublicHashKey(key);
-          value.publicKeyHashes = [(publickey), "NoBackUpKey" + publickey.substring(11)];
-        }
-        updatedSslPinning[key] = value; // Update the modified object
-      }
-
-      return initializeSslPinning(updatedSslPinning).then(() => true);
+      return initializeSslPinning({{{stringify sslPinning}}}).then(() => true);
     }
     return Promise.resolve(false);
   }
@@ -268,31 +254,33 @@ class App extends BaseApp {
     {{#if animatedSplash}}
     SplashScreen.hideAsync().then(() => {});{{/if}}
     this.appConfig.getServiceDefinitions = this.getServiceDefinitions.bind(this);
-    Promise.all([
-      NetworkService.start(this.appConfig)
-      {{#if profile.useLocalMetadata}}
-      {{else}}
-      .then(() => {
-        NetworkService.connect(true);
-      })
-      {{/if}},
-      this.getSecurityInfo()
-        .then(() => {console.log('Security info loaded')}),
-      this.loadWmProperties()
-      {{#if sslPinning}}
-      .then(() => this.initSSLPininng())
-      .then((flag) => {flag && console.log('SSL Pinning loaded')})
-      {{/if}}
-      .then(() => this.loadTheme())
+    NetworkService.start(this.appConfig)
+    {{#if profile.useLocalMetadata}}
+    {{else}}
+    .then(() => {
+      NetworkService.connect(true);
+    })
+    {{/if}}
+    .then(() => {console.log('NetworkService started')})
+    .then(() => this.loadWmProperties())
+    .then(() => {console.log('WmProperties loaded')})
+    {{#if sslPinning}}
+    .then(() => this.initSSLPininng())
+    .then((flag) => {flag && console.log('SSL Pinning loaded')})
+    {{/if}}
+    .then(() => this.loadTheme())
     .then(() => {console.log('Theme loaded')})
-      .then(() => AppI18nService.init())
-      .then(() => this.changeLocale())
+    .then(() => AppI18nService.init())
+    .then(() => this.changeLocale())
     .then(() => {console.log('Locale files loaded')})
-      .then(() => this.loadFonts())
+    .then(() => this.getSecurityInfo())
+    .then(() => {console.log('Security info loaded')})
+    .then(() => this.loadFonts())
     .then(() => {console.log('Font files loaded')})
-      .then(() => initializeDeviceOperations())
+    .then(() => initializeDeviceOperations())
     .then(() => {console.log('Loaded device operations loaded')})
-      .then(() => this.bootstrap())])
+    .then(() => this.bootstrap())
+    .then(() => {console.log('Bootstrap Complete')})
     .then(() => super.componentDidMount())
     .catch(error => {
       console.error(error);

rn-codegen/src/templates/babel.config.js.template

@@ -2,13 +2,7 @@ module.exports = function(api) {
   api.cache(true);
   return {
     presets: ['babel-preset-expo'],
-    plugins: [
-      {{#if enableLogs}} {{else}}'transform-remove-console', {{/if}}
-      ['@babel/plugin-transform-class-static-block', { "loose": true }],
-      ['@babel/plugin-transform-class-properties', { "loose": true }],
-      '@babel/plugin-proposal-export-namespace-from',
-      'react-native-reanimated/plugin'
-    ],
+    plugins: ['react-native-reanimated/plugin',{{#if enableLogs}} {{else}}'transform-remove-console'{{/if}}], 
     overrides: [{
       test: './src',
       plugins: ['./scripts/wm-babel.transform.plugin.js']

rn-codegen/src/templates/component/component.template

@@ -1,6 +1,6 @@
 import React from 'react';
 
-import { ScrollView } from 'react-native-gesture-handler';
+import { ScrollView } from 'react-native';
 
 import { AssetProvider } from '@wavemaker/app-rn-runtime/core/asset.provider';
 import Base{{typeLabel}} from '@wavemaker/app-rn-runtime/runtime/base-{{lType}}.component';
@@ -89,7 +89,8 @@ export default class {{name}}{{typeLabel}} extends Base{{typeLabel}} {
   componentDidMount() {
     {{#ifEquals lType 'prefab' this}}
       {{#if profile.useLocalMetadata}}
-      Promise.resolve(require('../../../service-definitions.json').serviceDefs)
+      import('../../../service-definitions.json')
+      .then(mod => mod.default?.serviceDefs)
       {{else}}
       this.getServiceDefinitions()
       {{/if}}

rn-codegen/src/templates/package.web.json

@@ -9,68 +9,66 @@
         "postinstall": "echo \"\""
     },
     "dependencies": {
-        "@wavemaker/app-rn-runtime": "11.8.0-rc.5684",
-        "@wavemaker/variables": "11.8.0-rc.5684",
-        "@wavemaker/rn-codegen": "11.8.0-rc.5684",
-        "deprecated-react-native-prop-types": "4.1.0",
-        "expo": "50.0.17",
-        "expo-build-properties": "0.12.0",
-        "@expo/vector-icons": "14.0.0",
-        "@expo/metro-runtime": "3.1.3",
-        "expo-font": "11.10.3",
-        "expo-file-system": "16.0.9",
-        "expo-camera": "14.1.3",
-        "expo-av": "13.10.6",
-        "expo-barcode-scanner": "12.9.3",
-        "expo-web-browser": "12.8.2",
-        "expo-device": "5.9.4",
-        "expo-network": "5.8.0",
-        "expo-location": "16.5.5",
-        "expo-localization": "14.8.4",
-        "expo-contacts": "12.8.2",
-        "expo-calendar": "12.2.1",
-        "expo-splash-screen": "0.26.5",
-        "expo-document-picker": "11.10.1",
-        "expo-constants": "15.4.6",
-        "expo-modules-core": "1.11.13",
+        "@unimodules/react-native-adapter": "6.3.9",
+        "@wavemaker/app-rn-runtime": "11.8.1-next.45208",
+        "@wavemaker/variables": "11.8.1-next.45208",
+        "@wavemaker/rn-codegen": "11.8.1-next.45208",
+        "axios": "^1.4.0",
+        "css-mediaquery": "^0.1.2",
+        "deprecated-react-native-prop-types": "~4.1.0",
+        "expo": "49.0.7",
+        "@expo/vector-icons": "13.0.0",
+        "expo-font": "11.4.0",
+        "expo-file-system": "15.4.3",
+        "expo-camera": "13.4.2",
+        "expo-av": "13.4.1",
+        "expo-barcode-scanner": "12.5.3",
+        "expo-web-browser": "12.3.2",
+        "expo-device": "5.4.0",
+        "expo-network": "5.4.0",
+        "expo-location": "16.1.0",
+        "expo-localization": "14.3.0",
+        "expo-contacts": "12.2.0",
+        "expo-calendar": "11.3.0",
+        "expo-splash-screen": "0.20.5",
+        "expo-document-picker": "11.5.4",
+        "expo-constants": "14.4.2",
         "@react-native/assets": "1.0.0",
         "hermes-engine": "0.11.0",
-        "imask": "7.6.0",
+        "imask": "^7.5.0",
         "react": "18.2.0",
         "react-dom": "18.2.0",
-        "react-native": "0.73.6",
-        "react-native-web": "0.19.6",
-        "@react-native/assets-registry": "0.74.83",
-        "@react-native-async-storage/async-storage": "1.21.0",
-        "@react-native-community/netinfo": "11.1.0",
-        "react-native-gesture-handler": "2.14.0",
-        "react-native-reanimated": "3.6.2",
+        "react-native": "0.72.4",
+        "react-native-web": "0.18.12",
+        "@react-native-async-storage/async-storage": "1.18.2",
+        "@react-native-community/netinfo": "9.3.10",
+        "react-native-gesture-handler": "2.12.1",
+        "react-native-reanimated": "^1.13.2",
         "react-native-bundle-splitter": "2.2.3",
-        "react-native-safe-area-context": "4.8.2",
-        "@react-native-community/datetimepicker": "7.6.3",
-        "@react-native-community/slider": "4.5.2",
-        "react-native-circular-progress": "1.4.0",
-        "@react-native-masked-view/masked-view": "0.3.0",
+        "react-native-safe-area-context": "4.6.3",
+        "@react-native-community/datetimepicker": "7.2.0",
+        "@react-native-community/slider": "4.4.2",
+        "react-native-circular-progress": "1.3.9",
+        "@react-native-masked-view/masked-view": "0.2.9",
         "react-native-snap-carousel": "3.9.1",
         "react-native-svg": "13.4.0",
-        "react-native-ssl-public-key-pinning": "1.2.3",
-        "@wavemaker/react-native-ssl-publickey": "1.0.2",
+        "react-native-ssl-public-key-pinning": "1.1.1",
         "victory-native": "36.6.11",
         "@react-navigation/native": "6.1.7",
-        "react-native-pager-view": "6.2.3",
-        "react-native-webview": "13.6.4",
-        "react-native-vector-icons": "10.0.3",
+        "react-native-pager-view": "6.2.0",
+        "react-native-webview": "13.2.2",
+        "react-native-vector-icons": "10.0.0",
         "@react-navigation/drawer": "6.6.3",
-        "react-native-screens": "3.29.0",
-        "react-native-svg-transformer": "1.3.0",
-        "lottie-react-native": "6.5.1",
-        "react-lottie-player": "2.0.0",
-        "expo-linear-gradient": "12.7.2",
+        "react-native-screens": "3.22.0",
+        "react-native-svg-transformer": "1.0.0",
+        "lottie-react-native": "5.1.6",
+        "react-lottie-player": "1.5.4",
+        "expo-linear-gradient": "12.3.0",
         "setimmediate": "1.0.5",
         "react-native-restart": "0.0.27",
-        "@expo/webpack-config": "19.0.1",
+        "@expo/webpack-config": "18.0.1",
         "@babel/core": "7.20.2",
-        "@babel/standalone": "7.23.10",
+        "@babel/standalone": "^7.23.10",
         "@babel/plugin-syntax-jsx": "7.21.4",
         "victory": "^36.5.3"
     },
@@ -81,12 +79,15 @@
         "esbuild": "0.15.15",
         "esbuild-plugin-resolve": "1.0.3",
         "fs-extra": "10.0.0",
-        "@babel/plugin-proposal-export-namespace-from": "7.18.9",
+        "expo-modules-autolinking": "1.5.0",
         "babel-plugin-transform-remove-console": "6.9.4",
         "@babel/plugin-proposal-optional-chaining": "7.21.0",
         "@babel/plugin-proposal-nullish-coalescing-operator": "7.18.6",
-        "@types/babel__standalone": "7.1.7",
-        "@expo/metro-config": "^0.7.1"
+        "@types/babel__standalone": "^7.1.7"
+    },
+    "resolutions": {
+        "react-error-overlay": "6.0.9",
+        "react-native-reanimated": "3.4.1"
     },
     "private": true
 }

rn-codegen/src/templates/project/app.json

@@ -34,16 +34,6 @@
     "web": {
       "bundler": "metro",
       "favicon": "./assets/favicon.png"
-    },
-    "plugins": [
-      [
-        "expo-build-properties",
-        {
-          "android": {
-            "useLegacyPackaging": true
-          }
-        }
-      ]
-    ]
+    }
   }
 }

rn-codegen/src/templates/project/esbuild/esbuild.script.js

@@ -136,10 +136,6 @@ class EsBuilder {
           );
         }`;
     });
-    const target = `${__dirname}/../node_modules/react-native-web/dist/cjs/exports/BackHandler/index.js`;
-    await readAndReplaceFileContent(target, content => {
-      return content.replace('console.error', '// console.error');
-    });
     console.log('Patched react-native-web');
   }
 
@@ -151,101 +147,6 @@ class EsBuilder {
     }
   }
 
-  async patchReactNativeAssetRegistry() {
-    const content = `
-    /**
-     * Copyright (c) Meta Platforms, Inc. and affiliates.
-     *
-     * This source code is licensed under the MIT license found in the
-     * LICENSE file in the root directory of this source tree.
-     *
-     * @flow strict
-     * @format
-     */
-    
-    'use strict';
-    
-    const assets = [];
-    
-    function registerAsset(asset) {
-      // push returns new array length, so the first asset will
-      // get id 1 (not 0) to make the value truthy
-      return assets.push(asset);
-    }
-    
-    function getAssetByID(assetId) {
-      return assets[assetId - 1];
-    }
-    
-    module.exports = {registerAsset, getAssetByID};
-    
-    `;
-    fs.writeFileSync(`${__dirname}/../node_modules/@react-native/assets-registry/registry.js`, content);
-    const expoAssetRegistry = `${__dirname}/../node_modules/expo-asset/node_modules/@react-native/assets-registry/registry.js`;
-    readAndReplaceFileContent(expoAssetRegistry, () => content);
-    console.log('Patched @react-native/assets-registry');
-  }
-
-  async patchBabelExpoPreset() {
-    const target = `${__dirname}/../node_modules/babel-preset-expo/build/index.js`;
-    await readAndReplaceFileContent(target, content => {
-      return content.replace(
-        `(0, common_1.hasModule)('react-native-reanimated') &&`,
-        `//(0, common_1.hasModule)('react-native-reanimated') &&`)
-        .replace(
-          `platformOptions.reanimated !== false && [require.resolve('react-native-reanimated/plugin')],`,
-          `//platformOptions.reanimated !== false && [require.resolve('react-native-reanimated/plugin')],`
-        )
-    });
-    console.log('Patched babel-expo-preset');
-  }
-
-  async patchUUID() {
-    const target = `${__dirname}/../node_modules/expo-modules-core/build/uuid/uuid.web.js`;
-    await readAndReplaceFileContent(target, content => {
-      return content.replace(`require('crypto')`, 'crypto');
-    });
-    console.log('Patched UUID.');
-  }
-
-  async patchExpoRootComponent() {
-    const target = `${__dirname}/../node_modules/expo/build/launch/registerRootComponent.js`;
-    await readAndReplaceFileContent(target, content => {
-      return content.replace(`export default`, 
-      `
-      const process = {env: {
-        NODE_ENV: 'development',
-        EXPO_PUBLIC_USE_STATIC: '0'
-      }};
-      export default `);
-    });
-    console.log('Patched Expo Root Component.');
-  }
-
-  async patchReactNavigation() {
-    // https://github.com/react-navigation/react-navigation/pull/11496/files
-    fs.copyFileSync(
-      `${__dirname}/@react-navigation/drawer/6.6.3/lib/module/views/modern/Drawer.js`,
-      `${__dirname}/../node_modules/@react-navigation/drawer/lib/module/views/modern/Drawer.js`
-    );
-    fs.copyFileSync(
-      `${__dirname}/@react-navigation/drawer/6.6.3/lib/module/views/modern/Overlay.js`,
-      `${__dirname}/../node_modules/@react-navigation/drawer/lib/module/views/modern/Overlay.js`
-    );
-    console.log('Patched React Navigation.');
-  }
-
-  async patchReactNativeReanimated() {
-    await readAndReplaceFileContent(`${__dirname}/../node_modules/react-native-reanimated/lib/module/reanimated2/PlatformChecker.js`, (c) => {
-      return c.replace(
-        '!!process.env.JEST_WORKER_ID',
-        'false; // !!process.env.JEST_WORKER_ID'
-      )
-    });
-    console.log('Patched React Native Reanimated.');
-  }
-
-
   buildLibraries() {
     const promises = [{
       name: 'expo-web-browser',
@@ -281,12 +182,6 @@ class EsBuilder {
         .then(() => this.patchReactNativeWeb())
         .then(() => this.patchReactNativeAssets())
         .then(() => this.patchCamera())
-        .then(() => this.patchReactNativeAssetRegistry())
-        .then(() => this.patchBabelExpoPreset())
-        .then(() => this.patchUUID())
-        .then(() => this.patchExpoRootComponent())
-        .then(() => this.patchReactNavigation())
-        .then(() => this.patchReactNativeReanimated())
         .then(() => {
           console.log('*********** LIBRARIES ARE BUILT FOR ESBUILD **************');
         }, (e) => {
@@ -317,11 +212,7 @@ class EsBuilder {
             esmodules: true
           },
           sourceMaps: 'inline',
-          plugins: [
-            __dirname + '/../scripts/wm-babel.transform.plugin.js', 
-            '@babel/plugin-proposal-export-namespace-from',
-            'react-native-reanimated/plugin',
-          ]
+          plugins: [__dirname + '/../scripts/wm-babel.transform.plugin.js']
         }
       }), resolve({
         'victory-native': 'victory'
@@ -338,9 +229,7 @@ class EsBuilder {
     .then(() => {
       console.timeEnd('react native with esbuild');
       console.log('*********** REACT NATIVE ESBUILD SUCCESSFUL **************');
-    }).catch((error) => {
-      console.log('*********** REACT PROJECT ESBUILD ERROR **************');
-      console.error(error);
+    }).catch(() => {
       console.timeEnd('react native with esbuild');
       console.log('*********** REACT PROJECT ESBUILD FAILED **************');
     });

rn-codegen/src/templates/project/metro.config.js

@@ -11,7 +11,6 @@ module.exports = (async () => {
         ];
         config.resolver.disableHierarchicalLookup = true;
         config.transformer = {
-            ...config.transformer,
             babelTransformerPath: require.resolve('react-native-svg-transformer'),
             getTransformOptions: async () => ({
                 transform: {
@@ -21,7 +20,6 @@ module.exports = (async () => {
             })
         }
         config.resolver = {
-            ...config.resolver,
             assetExts: config.resolver.assetExts.filter(ext => ext !== 'svg'),
             sourceExts: [...config.resolver.sourceExts, 'svg']
         }