Web5.connect() with react-native

.gitignore

@@ -53,3 +53,4 @@ yarn-error.log
 .expo/
 web-build/
 dist/
+.yarn

.yarnrc.yml

@@ -0,0 +1 @@
+nodeLinker: node-modules

metro.config.js

@@ -4,6 +4,31 @@ const { mergeConfig } = require("metro-config");
 
 const config = getDefaultConfig(__dirname);
 const web5Config = require("@tbd54566975/web5-react-native-metro-config");
+const currentDir = process.cwd();
+const customConfig = {
+  ...config,
+  resolver: {
+    sourceExts: ["ts", "tsx", "js", "jsx", "json", "cjs", "mjs"],
+    resolveRequest: (context, moduleName, platform) => {
+      if (moduleName === "@decentralized-identity/ion-tools") {
+        return {
+          // @tbd54566975/web5-react-native-metro-config references @decentralized-identity/ion-tools/dist/esm/index.js but the correct path is @decentralized-identity/ion-tools/dist/esm/src/index.js
+          filePath: `${currentDir}/node_modules/@decentralized-identity/ion-tools/dist/esm/src/index.js`,
+          type: "sourceFile",
+        };
+      }
+
+      if (moduleName === "@tbd54566975/web5") {
+        return {
+          filePath: `${currentDir}/node_modules/@tbd54566975/web5/dist/esm/main.mjs`,
+          type: "sourceFile",
+        };
+      }
+
+      return context.resolveRequest(context, moduleName, platform);
+    },
+  },
+};
 config.resolver.sourceExts.push("mjs");
 
-module.exports = mergeConfig(config, web5Config);
+module.exports = mergeConfig(customConfig, web5Config);

package.json

@@ -19,15 +19,17 @@
   },
   "@comment resolutions": "enforce de-duping even if upstream wont. this will need to be maintained.",
   "resolutions": {
-    "@ipld/dag-cbor": "^9.0.3"
+    "@ipld/dag-cbor": "^9.0.3",
+    "level": "file:./src/rn-async-storage-level"
   },
   "dependencies": {
     "@craftzdog/react-native-buffer": "6.0.5",
+    "@decentralized-identity/ion-tools": "1.0.7",
     "@legendapp/state": "1.3.6",
+    "@react-native-async-storage/async-storage": "^1.19.1",
     "@react-navigation/bottom-tabs": "6.5.8",
     "@react-navigation/native": "6.1.7",
     "@react-navigation/native-stack": "6.9.13",
-    "@tbd54566975/dwn-sdk-js": "0.1.0",
     "@tbd54566975/dwn-sql-store": "0.0.3",
     "@tbd54566975/web5": "0.7.11",
     "@tbd54566975/web5-react-native-metro-config": "0.1.2",

src/App.tsx

@@ -6,6 +6,7 @@ import { DwnService } from "./features/dwn/dwn-service";
 import { enableLegendStateReact } from "@legendapp/state/react";
 import { StatusBar } from "expo-status-bar";
 import { linking } from "./navigation/deep-links";
+import { Web5 } from "@tbd54566975/web5";
 
 enableLegendStateReact();
 
@@ -19,7 +20,12 @@ export const theme: typeof MD3DarkTheme = {
 
 export default function App() {
   useEffect(() => {
-    void DwnService.initSqliteDwn();
+    async function init() {
+      void DwnService.initMemoryDwn();
+      const { web5, did: myDid } = await Web5.connect();
+      console.log("myDid", myDid);
+    }
+    void init();
   }, []);
 
   return (