register turbomodules and fix config issues

Author: Yajur-Grover

package-lock.json

@@ -20,6 +20,7 @@
     "release:publish": "./.github/scripts/setup-ci-git-user.sh && changeset publish"
   },
   "devDependencies": {
+    "@babel/plugin-transform-runtime": "^7.24.7",
     "@changesets/cli": "^2.27.7",
     "concurrently": "^8.2.2",
     "eslint": "^8.54.0",
@@ -41,5 +42,8 @@
     "ts-node": "^10.9.1",
     "recursive-readdir/minimatch": "^3.0.5",
     "serve-handler/minimatch": "^3.0.5"
+  },
+  "dependencies": {
+    "@babel/runtime": "^7.25.0"
   }
 }

package.json

@@ -1,3 +1,4 @@
 module.exports = {
   presets: ["module:@react-native/babel-preset"],
+  plugins: ["@babel/plugin-transform-runtime"]
 };

packages/default-storage/babel.config.js

@@ -1,3 +1,4 @@
 module.exports = {
   presets: ["module:@react-native/babel-preset"],
+  plugins: ["@babel/plugin-transform-runtime"]
 };

packages/default-storage/example/babel.config.js

@@ -8,6 +8,7 @@ import {
   ScrollView,
   StyleSheet,
   Text,
+  TurboModuleRegistry,
   View,
 } from "react-native";
 import type { TestStep, TestValue } from "./tests";
@@ -130,7 +131,7 @@ function Functional(): JSX.Element {
       })
       .then(async () => {
         const AsyncStorageTestSupport =
-          NativeModules["AsyncStorageTestSupport"];
+          TurboModuleRegistry.get("AsyncStorageTestSupport");
 
         for (const [currentName, test] of Object.entries(tests)) {
           const name = currentName + " with delegate";

packages/default-storage/example/examples/Functional.tsx

@@ -14,6 +14,7 @@ import {
   StyleSheet,
   Text,
   TextInput,
+  TurboModuleRegistry,
   View,
 } from "react-native";
 
@@ -175,22 +176,22 @@ function Merge(): JSX.Element {
           testID="setDelegate_button"
           title="Set native delegate"
           disabled={
-            !NativeModules["AsyncStorageTestSupport"] ||
-            !NativeModules["AsyncStorageTestSupport"].test_setDelegate
+            !TurboModuleRegistry.get('AsyncStorageTestSupport') ||
+            !TurboModuleRegistry.get('AsyncStorageTestSupport')?.test_setDelegate
           }
           onPress={() =>
-            NativeModules["AsyncStorageTestSupport"].test_setDelegate(() => {})
+            TurboModuleRegistry.get('AsyncStorageTestSupport')?.test_setDelegate(() => {})
           }
         />
         <Button
           testID="unsetDelegate_button"
           title="Unset native delegate"
           disabled={
-            !NativeModules["AsyncStorageTestSupport"] ||
-            !NativeModules["AsyncStorageTestSupport"].test_unsetDelegate
+            TurboModuleRegistry.get('AsyncStorageTestSupport') ||
+            TurboModuleRegistry.get('AsyncStorageTestSupport')?.test_unsetDelegate
           }
           onPress={() =>
-            NativeModules["AsyncStorageTestSupport"].test_unsetDelegate(
+            TurboModuleRegistry.get('AsyncStorageTestSupport')?.test_unsetDelegate(
               () => {}
             )
           }

packages/default-storage/example/examples/MergeItem.tsx

@@ -32,6 +32,9 @@ const config = {
       /.*\.ProjectImports\.zip/,
     ]),
     //
+    extraNodeModules: {
+      "@react-native-async-storage/async-storage": __dirname,
+    },
   },
   transformer: {
     getTransformOptions: async () => ({

packages/default-storage/metro.config.js

@@ -73,11 +73,13 @@
   },
   "devDependencies": {
     "@babel/core": "^7.20.0",
+    "@babel/plugin-transform-runtime": "^7.24.7",
     "@babel/preset-env": "^7.20.0",
     "@react-native/babel-preset": "^0.74.1",
     "@react-native/metro-config": "^0.73.3",
     "@rnx-kit/jest-preset": "^0.1.16",
     "@rnx-kit/metro-config": "^1.3.15",
+    "@types/babel__plugin-transform-runtime": "^7",
     "@types/lodash": "^4.14.184",
     "@types/mocha": "^10.0.1",
     "@types/react": "^18.0.0",

packages/default-storage/package.json

@@ -1,8 +1,8 @@
-import { NativeModules } from "react-native";
+import { NativeModules, TurboModuleRegistry } from "react-native";
 
 export function shouldFallbackToLegacyNativeModule(): boolean {
   const expoConstants =
-    NativeModules["NativeUnimoduleProxy"]?.modulesConstants?.ExponentConstants;
+  TurboModuleRegistry.get('NativeUnimoduleProxy')?.getConstants()?.modulesConstants?.ExponentConstants;
 
   if (expoConstants) {
     /**

packages/default-storage/src/shouldFallbackToLegacyNativeModule.ts

@@ -14,7 +14,7 @@ namespace winrt::ReactNativeAsyncStorage::implementation
 
     void ReactPackageProvider::CreatePackage(IReactPackageBuilder const &packageBuilder) noexcept
     {
-        AddAttributedModules(packageBuilder);
+        AddAttributedModules(packageBuilder, true);
     }
 
 }  // namespace winrt::ReactNativeAsyncStorage::implementation