From 2a94af565511e41cd331ce6f0d1502608f63a3d6 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Ullrich=20Sch=C3=A4fer?= <hi+github@ullrich.is>
Date: Wed, 15 Apr 2026 07:39:04 +0200
Subject: [PATCH] Add Metro config for monorepo module resolution
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Metro couldn't resolve hoisted packages (@maplibre, @gorhom, etc.)
because it only looked in apps/mobile/node_modules. Configure
watchFolders and nodeModulesPaths to include the monorepo root.

Also revert MapLibre fallback — direct import is correct, the issue
was Metro resolution, not a missing native module.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
---
 apps/mobile/lib/editor/RouteMap.tsx | 11 +----------
 apps/mobile/metro.config.js         | 18 ++++++++++++++++++
 2 files changed, 19 insertions(+), 10 deletions(-)
 create mode 100644 apps/mobile/metro.config.js

diff --git a/apps/mobile/lib/editor/RouteMap.tsx b/apps/mobile/lib/editor/RouteMap.tsx
index c41eeb0..409580f 100644
--- a/apps/mobile/lib/editor/RouteMap.tsx
+++ b/apps/mobile/lib/editor/RouteMap.tsx
@@ -1,18 +1,9 @@
 import { useRef, useCallback } from "react";
 import { StyleSheet, View, Text } from "react-native";
+import MapLibreGL from "@maplibre/maplibre-react-native";
 import type { Waypoint } from "@trails-cool/types";
 import type { RouteSegment } from "./use-route-editor";
 
-import type MapLibreRN from "@maplibre/maplibre-react-native";
-
-let MapLibreGL: typeof MapLibreRN | null = null;
-try {
-  // eslint-disable-next-line @typescript-eslint/no-require-imports
-  MapLibreGL = require("@maplibre/maplibre-react-native").default;
-} catch {
-  // Native module not available — will show fallback UI
-}
-
 const OSM_STYLE = {
   version: 8 as const,
   sources: {
diff --git a/apps/mobile/metro.config.js b/apps/mobile/metro.config.js
new file mode 100644
index 0000000..fb69142
--- /dev/null
+++ b/apps/mobile/metro.config.js
@@ -0,0 +1,18 @@
+const { getDefaultConfig } = require("expo/metro-config");
+const path = require("path");
+
+const projectRoot = __dirname;
+const monorepoRoot = path.resolve(projectRoot, "../..");
+
+const config = getDefaultConfig(projectRoot);
+
+// Watch all files in the monorepo
+config.watchFolders = [monorepoRoot];
+
+// Resolve modules from both the project and monorepo root
+config.resolver.nodeModulesPaths = [
+  path.resolve(projectRoot, "node_modules"),
+  path.resolve(monorepoRoot, "node_modules"),
+];
+
+module.exports = config;