From 771000e774b9a8a7b2de5588d87db4acc797bdad Mon Sep 17 00:00:00 2001
From: Natalie Bridgers <natalie@iori.local>
Date: Tue, 30 Sep 2025 16:14:22 -0500
Subject: [PATCH] it works on mobile (again) now

---
 js/components/package.json               |  5 ++--
 js/components/src/i18n/i18next-config.ts | 35 ++++++++++++++++++------
 js/components/tsconfig.json              | 10 +++++--
 pnpm-lock.yaml                           |  3 ++
 4 files changed, 40 insertions(+), 13 deletions(-)

diff --git a/js/components/package.json b/js/components/package.json
index 77f45c2d..bd66a07c 100644
--- a/js/components/package.json
+++ b/js/components/package.json
@@ -43,6 +43,7 @@
     "i18next-fluent": "^2.0.0",
     "i18next-http-backend": "^3.0.2",
     "i18next-resources-to-backend": "^1.2.1",
+    "intl-pluralrules": "^2.0.1",
     "lucide-react-native": "^0.514.0",
     "react-i18next": "^15.7.3",
     "react-native": "^0.79.0",
@@ -58,8 +59,8 @@
     "zustand": "^5.0.5"
   },
   "peerDependencies": {
-    "react": "*",
-    "expo-localization": "*"
+    "expo-localization": "*",
+    "react": "*"
   },
   "peerDependenciesMeta": {
     "expo-localization": {
diff --git a/js/components/src/i18n/i18next-config.ts b/js/components/src/i18n/i18next-config.ts
index e4b35c17..4d89166f 100644
--- a/js/components/src/i18n/i18next-config.ts
+++ b/js/components/src/i18n/i18next-config.ts
@@ -7,13 +7,17 @@ import resourcesToBackend from "i18next-resources-to-backend";
 import "intl-pluralrules";
 import { initReactI18next } from "react-i18next";
 
-// Import our manifest and loader
-import { manifest } from "./index";
+// Import our manifest directly to avoid circular dependency
+import manifest from "../../locales/manifest.json";
 
 // Try to import expo-localization, but make it optional
 let Localization: typeof import("expo-localization") | null = null;
 try {
-  Localization = require("expo-localization");
+  const localizationModule = require("expo-localization");
+  // Handle both default and named exports
+  Localization = localizationModule.default
+    ? localizationModule.default
+    : localizationModule;
 } catch {
   // expo-localization not available, will use browser/fallback detection
 }
@@ -21,14 +25,22 @@ try {
 // Mock storage for now - replace with actual zustand storage
 const storage = {
   getItem: (key: string): string | null => {
-    if (typeof window !== "undefined") {
-      return localStorage.getItem(key);
+    try {
+      if (typeof window !== "undefined" && localStorage) {
+        return localStorage.getItem(key);
+      }
+    } catch {
+      // localStorage not available (e.g. in some test environments)
     }
     return null;
   },
   setItem: (key: string, value: string): void => {
-    if (typeof window !== "undefined") {
-      localStorage.setItem(key, value);
+    try {
+      if (typeof window !== "undefined" && localStorage) {
+        localStorage.setItem(key, value);
+      }
+    } catch {
+      // localStorage not available (e.g. in some test environments)
     }
   },
 };
@@ -41,8 +53,13 @@ export function getLocaleFromSystemLocale(): string {
   let systemLocale = "en";
 
   // Try to get locale from expo-localization if available
-  if (Localization) {
-    systemLocale = Localization.getLocales()[0]?.languageTag || "en";
+  if (Localization && typeof Localization.getLocales === "function") {
+    try {
+      const locales = Localization.getLocales();
+      systemLocale = locales?.[0]?.languageTag || "en";
+    } catch (error) {
+      console.warn("Failed to get locales from expo-localization:", error);
+    }
   } else if (typeof navigator !== "undefined" && navigator.language) {
     // Fallback to browser navigator.language
     systemLocale = navigator.language;
diff --git a/js/components/tsconfig.json b/js/components/tsconfig.json
index 57187a83..0757c172 100644
--- a/js/components/tsconfig.json
+++ b/js/components/tsconfig.json
@@ -8,7 +8,13 @@
     "noEmit": false,
     "declaration": true,
     "declarationMap": true,
-    "sourceMap": true
+    "sourceMap": true,
+    "resolveJsonModule": true
   },
-  "include": ["./src"]
+  "include": ["./src"],
+  "ts-node": {
+    "compilerOptions": {
+      "resolveJsonModule": true
+    }
+  }
 }
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 0deb83ae..8bc3845e 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -488,6 +488,9 @@ importers:
       i18next-resources-to-backend:
         specifier: ^1.2.1
         version: 1.2.1
+      intl-pluralrules:
+        specifier: ^2.0.1
+        version: 2.0.1
       lucide-react-native:
         specifier: ^0.514.0
         version: 0.514.0(react-native-svg@15.12.0(react-native@0.79.3(@babel/core@7.26.0)(bufferutil@4.0.8)(react@19.0.0)(utf-8-validate@5.0.10))(react@19.0.0))(react-native@0.79.3(@babel/core@7.26.0)(bufferutil@4.0.8)(react@19.0.0)(utf-8-validate@5.0.10))(react@19.0.0)
-- 
2.51.2