From 5e830b2360ea4d62212d07d396c4d80d48e83968 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Micha=C5=82=20Bert?=
 <63123542+m-bert@users.noreply.github.com>
Date: Thu, 13 Jun 2024 10:10:23 +0200
Subject: [PATCH] Fix `web-example`  (#6111)

## Summary

Following the transition to a monorepo structure, our web-example app
stopped working due to an asset loading issue. Turns out that the
`getAssetByID` function from `react-native-web` was being called from
the incorrect module. We believe this might have resulted in one module
blocking an asset while another module was trying to load it, causing
the application to crash.

This PR modifies the `metro.config.js` inside the `web-example` folder.
It is now configured to ignore the `@react-native` module from the root,
which allows assets to load correctly.

## Test plan

Run `web-example`.
---
 apps/web-example/metro.config.js | 12 ++++++++++++
 1 file changed, 12 insertions(+)

diff --git a/apps/web-example/metro.config.js b/apps/web-example/metro.config.js
index d0297f1d00b..f7eaa68e31e 100644
--- a/apps/web-example/metro.config.js
+++ b/apps/web-example/metro.config.js
@@ -1,5 +1,8 @@
 const { getDefaultConfig } = require('expo/metro-config');
+
 const path = require('path');
+const exclusionList = require('metro-config/src/defaults/exclusionList');
+const escape = require('escape-string-regexp');
 
 // Find the project and workspace directories
 const projectRoot = __dirname;
@@ -15,4 +18,13 @@ config.resolver.nodeModulesPaths = [
   path.resolve(monorepoRoot, 'node_modules'),
 ];
 
+const modulesToBlock = ['@react-native'];
+
+config.resolver.blacklistRE = exclusionList(
+  modulesToBlock.map(
+    (m) =>
+      new RegExp(`^${escape(path.join(monorepoRoot, 'node_modules', m))}\\/.*$`)
+  )
+);
+
 module.exports = config;