@codemoreira/esad 1.4.6-9 → 2.0.0-rc.1

package/src/cli/utils/process.js

@@ -1,21 +1,66 @@
-const { spawn } = require('cross-spawn');
-
-/**
- * Helper to spawn commands synchronously
- * @param {string} cmd 
- * @param {string[]} args 
- * @param {string} cwd 
- * @returns {Promise<void>}
- */
-const runProcess = (cmd, args, cwd = process.cwd()) => {
-  const executable = (process.platform === 'win32' && cmd === 'npx') ? 'npx.cmd' : cmd;
-  return new Promise((resolve, reject) => {
-    const child = spawn(executable, args, { stdio: 'inherit', cwd, shell: true });
-    child.on('close', code => {
-      if (code !== 0) reject(new Error(`Command ${cmd} ${args.join(' ')} failed`));
-      else resolve();
-    });
-  });
-};
-
-module.exports = { runProcess };
+const { spawn } = require('cross-spawn');
+const nativeSpawn = require('child_process').spawn;
+const path = require('path');
+const fs = require('fs-extra');
+
+const runProcess = (cmd, args, cwd = process.cwd()) => {
+  return new Promise((resolve, reject) => {
+    let finished = false;
+    let started = false;
+
+    const finalize = (fn, arg) => {
+      if (finished) return;
+      finished = true;
+      fn(arg);
+    };
+
+    const isWin = process.platform === 'win32';
+    const localBinPath = path.join(cwd, 'node_modules', '.bin', isWin ? `${cmd}.cmd` : cmd);
+    
+    let command = cmd;
+    let finalArgs = args;
+    let useNativeSpawn = false;
+
+    if (fs.existsSync(localBinPath)) {
+      command = isWin ? `node_modules\\.bin\\${cmd}.cmd` : `./node_modules/.bin/${cmd}`;
+      useNativeSpawn = isWin; // Use native spawn on Windows for local binaries to avoid cross-spawn issues
+    } else {
+      command = isWin ? 'npx.cmd' : 'npx';
+      finalArgs = [cmd, ...args];
+    }
+    
+    console.log(`[ESAD] Resolved Command: ${command} (CWD: ${cwd})`);
+
+    // Mark as started after a short delay
+    setTimeout(() => { started = true; }, 2000);
+
+    const spawnFn = useNativeSpawn ? nativeSpawn : spawn;
+    const child = spawnFn(command, finalArgs, { 
+      stdio: 'inherit', 
+      cwd, 
+      shell: true
+    });
+
+    child.on('error', err => {
+      // If the process already "started" (ran for > 2s), we ignore early-spawn errors
+      // as they are likely shell artifacts from the process exiting.
+      if (started && err.code === 'ENOENT') {
+        console.warn(`[ESAD] Warning: Late ENOENT ignored for ${cmd}.`);
+        return;
+      }
+
+      console.error(`[ESAD] Process Error: ${err.code} - ${err.message}`);
+      finalize(reject, new Error(`Failed to start ${cmd}: ${err.message}`));
+    });
+
+    child.on('close', code => {
+      if (code !== 0) {
+        finalize(reject, new Error(`Process ${cmd} exited with code ${code}`));
+      } else {
+        finalize(resolve);
+      }
+    });
+  });
+};
+
+module.exports = { runProcess };

package/src/cli/utils/scaffold.js

@@ -1,112 +1,96 @@
-const { runProcess } = require('./process');
-const fs = require('fs-extra');
-const path = require('path');
-
-/**
- * Clones a template repository and cleans up the .git folder
- */
-async function cloneTemplate(url, dest) {
-  console.log(`\n📥 Cloning template: ${url}...`);
-  await runProcess('git', ['clone', url, dest]);
-  
-  const gitDir = path.join(dest, '.git');
-  if (fs.existsSync(gitDir)) {
-    await fs.remove(gitDir);
-    console.log(`✅ Detached from template repository.`);
-  }
-}
-
-/**
- * Renames the project in package.json and app.json
- */
-async function renameProject(targetDir, newName) {
-  const pkgPath = path.join(targetDir, 'package.json');
-  const appJsonPath = path.join(targetDir, 'app.json');
-
-  if (fs.existsSync(pkgPath)) {
-    const pkg = await fs.readJson(pkgPath);
-    pkg.name = newName;
-    await fs.writeJson(pkgPath, pkg, { spaces: 2 });
-    console.log(`✅ Updated package.json name: ${newName}`);
-  }
-
-  if (fs.existsSync(appJsonPath)) {
-    const appJson = await fs.readJson(appJsonPath);
-    if (appJson.expo) {
-      appJson.expo.name = newName;
-      appJson.expo.slug = newName;
-      appJson.expo.scheme = newName.replace(/[^a-zA-Z0-9]/g, '').toLowerCase();
-      
-      if (appJson.expo.android) {
-        appJson.expo.android.package = `com.anonymous.${newName.replace(/[^a-zA-Z0-9]/g, '')}`;
-      }
-      
-      if (appJson.expo.ios) {
-        appJson.expo.ios.bundleIdentifier = `com.anonymous.${newName.replace(/[^a-zA-Z0-9]/g, '')}`;
-      }
-    } else {
-      appJson.name = newName;
-      appJson.slug = newName;
-    }
-    await fs.writeJson(appJsonPath, appJson, { spaces: 2 });
-    console.log(`✅ Updated app.json name/slug/package/scheme.`);
-  }
-
-  // 3. Update Rspack Config if exists
-  const rspackPath = path.join(targetDir, 'rspack.config.mjs');
-  if (fs.existsSync(rspackPath)) {
-    let content = await fs.readFile(rspackPath, 'utf8');
-    const regex = /id:\s*['"][^'"]+['"]/;
-    if (regex.test(content)) {
-      content = content.replace(regex, `id: '${newName}'`);
-      await fs.writeFile(rspackPath, content);
-      console.log(`✅ Updated rspack.config.mjs id: ${newName}`);
-    }
-  }
-}
-
-/**
- * Prepares the native folders and ensures the ESAD Config Plugin is registered
- */
-async function prepareNative(cwd, platform = 'android') {
-  const appJsonPath = path.join(cwd, 'app.json');
-  
-  // 1. Ensure Config Plugin is in app.json
-  if (fs.existsSync(appJsonPath)) {
-    const appJson = await fs.readJson(appJsonPath);
-    if (appJson.expo) {
-      const plugins = appJson.expo.plugins || [];
-      const pluginName = '@codemoreira/esad/config-plugin';
-      
-      if (!plugins.includes(pluginName) && !plugins.some(p => Array.isArray(p) && p[0] === pluginName)) {
-        appJson.expo.plugins = [...plugins, pluginName];
-        await fs.writeJson(appJsonPath, appJson, { spaces: 2 });
-        console.log(`✅ Added ESAD Config Plugin to app.json.`);
-      }
-    }
-  }
-
-  // 2. Run Prebuild (this will trigger the plugin)
-  if (!fs.existsSync(path.join(cwd, 'android')) && (platform === 'android' || platform === 'all')) {
-    console.log(`📦 Native folder not found. Running expo prebuild...`);
-    await runProcess('npx', ['expo', 'prebuild', '--platform', 'android'], cwd);
-  } else if (platform === 'all' || platform === 'ios' || platform === 'android') {
-    // If folder exists, we still might want to run prebuild to sync changes if forced, 
-    // but ESAD's dev command usually assumes it's managed.
-    // For now, let's just ensure react-native.config.js exists.
-  }
-
-  // 3. Create react-native.config.js if missing
-  const rnConfigPath = path.join(cwd, 'react-native.config.js');
-  if (!fs.existsSync(rnConfigPath)) {
-    const content = `module.exports = {\n  commands: require('@callstack/repack/commands/rspack'),\n};\n`;
-    await fs.writeFile(rnConfigPath, content);
-    console.log(`✅ Generated react-native.config.js.`);
-  }
-}
-
-module.exports = {
-  cloneTemplate,
-  renameProject,
-  prepareNative
-};
+const { runProcess } = require('./process');
+const fs = require('fs-extra');
+const path = require('path');
+
+/**
+ * Clones a template repository and cleans up the .git folder
+ */
+async function cloneTemplate(url, dest) {
+  console.log(`\n📥 Cloning template: ${url}...`);
+  await runProcess('git', ['clone', url, dest]);
+  
+  const gitDir = path.join(dest, '.git');
+  if (fs.existsSync(gitDir)) {
+    await fs.remove(gitDir);
+    console.log(`✅ Detached from template repository.`);
+  }
+}
+
+/**
+ * Renames the project in package.json and app.json
+ */
+async function renameProject(targetDir, newName) {
+  const pkgPath = path.join(targetDir, 'package.json');
+  const appJsonPath = path.join(targetDir, 'app.json');
+
+  if (fs.existsSync(pkgPath)) {
+    const pkg = await fs.readJson(pkgPath);
+    pkg.name = newName;
+    await fs.writeJson(pkgPath, pkg, { spaces: 2 });
+    console.log(`✅ Updated package.json name: ${newName}`);
+  }
+
+  if (fs.existsSync(appJsonPath)) {
+    const appJson = await fs.readJson(appJsonPath);
+    if (appJson.expo) {
+      appJson.expo.name = newName;
+      appJson.expo.slug = newName;
+      if (appJson.expo.android) {
+        appJson.expo.android.package = `com.anonymous.${newName.replace(/[^a-zA-Z0-9]/g, '')}`;
+      }
+    } else {
+      appJson.name = newName;
+      appJson.slug = newName;
+    }
+    await fs.writeJson(appJsonPath, appJson, { spaces: 2 });
+    console.log(`✅ Updated app.json name/slug/package.`);
+  }
+
+  // 3. Update Rspack Config if exists
+  const rspackPath = path.join(targetDir, 'rspack.config.mjs');
+  if (fs.existsSync(rspackPath)) {
+    let content = await fs.readFile(rspackPath, 'utf8');
+    const regex = /id:\s*['"][^'"]+['"]/;
+    if (regex.test(content)) {
+      content = content.replace(regex, `id: '${newName}'`);
+      await fs.writeFile(rspackPath, content);
+      console.log(`✅ Updated rspack.config.mjs id: ${newName}`);
+    }
+  }
+}
+
+/**
+ * Prepares the native folders and applies Re.Pack patches
+ */
+async function prepareNative(cwd, platform = 'android') {
+  if (!fs.existsSync(path.join(cwd, 'android')) && (platform === 'android' || platform === 'all')) {
+    console.log(`📦 Native folder not found. Running expo prebuild...`);
+    await runProcess('npx', ['expo', 'prebuild', '--platform', 'android'], cwd);
+  }
+
+  // Apply Gradle Patch (Android)
+  const buildGradlePath = path.join(cwd, 'android/app/build.gradle');
+  if (fs.existsSync(buildGradlePath)) {
+    let content = await fs.readFile(buildGradlePath, 'utf8');
+    if (!content.includes('project.ext.react')) {
+      const patch = `\nproject.ext.react = [\n    bundleCommand: "repack-bundle",\n    bundleConfig: "rspack.config.mjs"\n]\n\n`;
+      content = content.replace(/react \{/, `${patch}react {`);
+      await fs.writeFile(buildGradlePath, content);
+      console.log(`✅ Patched android/app/build.gradle for Re.Pack.`);
+    }
+  }
+
+  // Create react-native.config.js if missing
+  const rnConfigPath = path.join(cwd, 'react-native.config.js');
+  if (!fs.existsSync(rnConfigPath)) {
+    const content = `module.exports = {\n  commands: require('@callstack/repack/commands/rspack'),\n};\n`;
+    await fs.writeFile(rnConfigPath, content);
+    console.log(`✅ Generated react-native.config.js.`);
+  }
+}
+
+module.exports = {
+  cloneTemplate,
+  renameProject,
+  prepareNative
+};

package/src/cli/utils/transformer.js

@@ -0,0 +1,44 @@
+const fs = require('fs-extra');
+const path = require('path');
+
+/**
+ * Safely updates the devMode object in esad.config.js
+ * This uses a simple yet robust regex approach to preserve comments/formatting.
+ */
+const updateDevMode = (configPath, moduleId, url) => {
+  let content = fs.readFileSync(configPath, 'utf8');
+
+  // 1. Ensure devMode object exists
+  if (!content.includes('devMode:')) {
+    // Inject devMode before the last closing brace (naive but effective for clean configs)
+    content = content.replace(/}([^}]*)$/, `  devMode: {},\n}$1`);
+  }
+
+  // 2. Add or update the module entry
+  const entryRegex = new RegExp(`(['"]${moduleId}['"]|${moduleId}):\\s*['"]([^'"]*)['"]`, 'g');
+  
+  if (entryRegex.test(content)) {
+    // Update existing
+    content = content.replace(entryRegex, `$1: '${url}'`);
+  } else {
+    // Insert new entry into devMode object
+    const devModeRegex = /(devMode:\s*{)/;
+    content = content.replace(devModeRegex, `$1\n    '${moduleId}': '${url}',`);
+  }
+
+  fs.writeFileSync(configPath, content);
+};
+
+const clearAllDevMode = (configPath) => {
+  if (!fs.existsSync(configPath)) return;
+  let content = fs.readFileSync(configPath, 'utf8');
+
+  // Remove the entire devMode block
+  const devModeBlockRegex = /\s*devMode:\s*{[\s\S]*?},?/g;
+  content = content.replace(devModeBlockRegex, '');
+
+  fs.writeFileSync(configPath, content);
+};
+
+module.exports = { updateDevMode, removeDevMode, clearAllDevMode };
+

package/src/client/index.js

@@ -1,82 +1,69 @@
-import { useState, useEffect } from 'react';
-
-/**
- * ESAD Global Event Manager
- * This class runs as a true Singleton across the Host and all Federated Modules,
- * allowing instant variable sharing without tight coupling.
- */
-// Unique key to store the global state in the environment (shared across sessions)
-const GLOBAL_STORE_KEY = '__ESAD_GLOBAL_STATE__';
-
-// Initialize the global store if it doesn't already exist.
-// This ensures that even if different chunks/modules have their own copy 
-// of this JS file, they all point to the same memory object in globalThis.
-if (!globalThis[GLOBAL_STORE_KEY]) {
-  globalThis[GLOBAL_STORE_KEY] = {
-    state: {},
-    listeners: {}
-  };
-}
-
-const GlobalStore = globalThis[GLOBAL_STORE_KEY];
-
-class ESADEventEmitter {
-  set(key, value) {
-    GlobalStore.state[key] = value;
-    if (GlobalStore.listeners[key]) {
-      GlobalStore.listeners[key].forEach(callback => callback(value));
-    }
-  }
-
-  get(key) {
-    return GlobalStore.state[key];
-  }
-
-  subscribe(key, callback) {
-    if (!GlobalStore.listeners[key]) {
-      GlobalStore.listeners[key] = [];
-    }
-    GlobalStore.listeners[key].push(callback);
-    
-    // Return unsubscribe function
-    return () => {
-      GlobalStore.listeners[key] = GlobalStore.listeners[key].filter(cb => cb !== callback);
-    };
-  }
-}
-
-// Global instance (acts as a proxy to the globalStore)
-const ESADState = new ESADEventEmitter();
-
-/**
- * React Hook for subscribing to Global State Changes
- * @param {string} key Unique identifier for the state slice (e.g. 'auth_token', 'theme')
- * @param {any} initialValue Optional initial state fallback
- */
-export function useESADState(key, initialValue) {
-  const [val, setVal] = useState(() => {
-    const existing = ESADState.get(key);
-    if (existing !== undefined) return existing;
-    if (initialValue !== undefined) {
-      ESADState.set(key, initialValue);
-      return initialValue;
-    }
-    return undefined;
-  });
-
-  useEffect(() => {
-    // Whenever ESADState.set is called matching this key, this component will re-render
-    const unsubscribe = ESADState.subscribe(key, (newVal) => {
-      setVal(newVal);
-    });
-    return unsubscribe;
-  }, [key]);
-
-  const setter = (newVal) => {
-    ESADState.set(key, newVal);
-  };
-
-  return [val, setter];
-}
-
-export { ESADState };
+import { useState, useEffect } from 'react';
+
+/**
+ * ESAD Global Event Manager
+ * This class runs as a true Singleton across the Host and all Federated Modules,
+ * allowing instant variable sharing without tight coupling.
+ */
+class ESADEventEmitter {
+  constructor() {
+    this.state = {};
+    this.listeners = {};
+  }
+
+  set(key, value) {
+    this.state[key] = value;
+    if (this.listeners[key]) {
+      this.listeners[key].forEach(callback => callback(value));
+    }
+  }
+
+  get(key) {
+    return this.state[key];
+  }
+
+  subscribe(key, callback) {
+    if (!this.listeners[key]) this.listeners[key] = [];
+    this.listeners[key].push(callback);
+    return () => {
+      this.listeners[key] = this.listeners[key].filter(cb => cb !== callback);
+    };
+  }
+}
+
+// Because this package is marked as a ModuleFederation Singleton,
+// this instance will be shared identically across all chunks!
+const ESADState = new ESADEventEmitter();
+
+/**
+ * React Hook for subscribing to Global State Changes
+ * @param {string} key Unique identifier for the state slice (e.g. 'auth_token', 'theme')
+ * @param {any} initialValue Optional initial state fallback
+ */
+export function useESADState(key, initialValue) {
+  const [val, setVal] = useState(() => {
+    const existing = ESADState.get(key);
+    if (existing !== undefined) return existing;
+    if (initialValue !== undefined) {
+      ESADState.set(key, initialValue);
+      return initialValue;
+    }
+    return undefined;
+  });
+
+  useEffect(() => {
+    // Whenever ESADState.set is called matching this key, this component will re-render
+    const unsubscribe = ESADState.subscribe(key, (newVal) => {
+      setVal(newVal);
+    });
+    return unsubscribe;
+  }, [key]);
+
+  const setter = (newVal) => {
+    ESADState.set(key, newVal);
+  };
+
+  return [val, setter];
+}
+
+export { ESADState };

package/src/plugin/index.js

@@ -3,7 +3,6 @@ const fs = require('node:fs');
 const Repack = require('@callstack/repack');
 const { ExpoModulesPlugin } = require('@callstack/repack-plugin-expo-modules');
 const { ProvidePlugin, DefinePlugin } = require('@rspack/core');
-const { ReanimatedPlugin } = require('@callstack/repack-plugin-reanimated');
 
 /**
  * ESAD Re.Pack Plugin Wrapper
@@ -25,6 +24,8 @@ function withESAD(env, options) {
   const pkgPath = path.resolve(dirname, 'package.json');
   const pkg = JSON.parse(fs.readFileSync(pkgPath, 'utf8'));
   const id = options.id.replace(/-/g, '_');
+  const sdkPkgPath = path.resolve(__dirname, '..', '..', 'package.json');
+  const sdkPkg = JSON.parse(fs.readFileSync(sdkPkgPath, 'utf8'));
   const clientPath = path.resolve(__dirname, '..', 'client', 'index.js');
 
   console.log(`[ESAD] Applying Mega-Zero-Config profile for ${options.type.toUpperCase()} (${platform}): ${id}`);
@@ -39,28 +40,59 @@ function withESAD(env, options) {
       clean: true,
     },
     resolve: {
-      ...Repack.getResolveOptions(platform),
+      ...Repack.getResolveOptions(),
       alias: {
-        '~': dirname,
-        '@': dirname,
-        ...Repack.getResolveOptions(platform).alias,
-      },
-      conditionNames: ['react-native', 'require', 'import', 'default'],
+        '@': path.resolve(dirname, '.'),
+        // Internal MFv2 & Re.Pack Aliases (Magic)
+        '@module-federation/runtime/helpers': path.resolve(dirname, 'node_modules/@module-federation/runtime/dist/helpers.js'),
+        '@module-federation/error-codes/browser': path.resolve(dirname, 'node_modules/@module-federation/error-codes/dist/browser.cjs'),
+        '@module-federation/sdk': path.resolve(dirname, 'node_modules/@module-federation/sdk'),
+        
+        ...Repack.getResolveOptions().alias,
+        ...(options.alias || {}),
+      }
     },
     module: {
       rules: [
         {
-          test: /\.[jt]sx?$/,
-          include: [
-            path.resolve(dirname, 'app'),
-            path.resolve(dirname, 'index.js'),
-            /[\\/]node_modules[\\/](expo-router|react-native|@react-native|expo-modules-core|@module-federation|@react-navigation)[\\/]/
-          ],
-          resolve: {
-            fullySpecified: false,
-          }
+          oneOf: [
+            {
+              test: /\.[cm]?[jt]sx?$/,
+              include: [
+                /node_modules[\\/](react-native|@react-native|expo|expo-modules-core|@expo|react-navigation|@react-navigation|@unimodules|unimodules|native-base)/,
+              ],
+              type: 'javascript/auto',
+              resolve: { fullySpecified: false },
+              use: {
+                loader: 'babel-loader',
+                options: {
+                  presets: [
+                    [
+                      'babel-preset-expo',
+                      { native: { disableImportExportTransform: false } },
+                    ],
+                  ],
+                  sourceType: 'unambiguous',
+                  caller: { name: 'repack' },
+                },
+              },
+            },
+            {
+              test: /\.[cm]?[jt]sx?$/,
+              include: [dirname],
+              type: 'javascript/auto',
+              use: {
+                loader: 'babel-loader',
+                options: {
+                  presets: ['babel-preset-expo'],
+                  sourceType: 'unambiguous',
+                  caller: { name: 'repack' },
+                },
+              },
+            },
+            ...Repack.getJsTransformRules(),
+          ]
         },
-        ...Repack.getJsTransformRules(),
         ...Repack.getAssetTransformRules(),
       ],
     },
@@ -71,16 +103,9 @@ function withESAD(env, options) {
       new DefinePlugin({
         'process.env.NODE_ENV': JSON.stringify(isDev ? 'development' : 'production'),
         '__DEV__': JSON.stringify(isDev),
-        'process.env.EXPO_BASE_URL': JSON.stringify(''),
-        'process.env.EXPO_OS': JSON.stringify(platform),
-        'process.env.EXPO_PROJECT_ROOT': JSON.stringify(dirname),
-        'process.env.EXPO_ROUTER_ABS_APP_ROOT': JSON.stringify(path.resolve(dirname, 'app')),
-        'process.env.EXPO_ROUTER_APP_ROOT': JSON.stringify('~/app'),
-        'process.env.EXPO_ROUTER_IMPORT_MODE': JSON.stringify('sync'),
       }),
       new ExpoModulesPlugin(),
       new Repack.RepackPlugin(),
-      new ReanimatedPlugin(),
       new Repack.plugins.ModuleFederationPluginV2({
         name: id,
         filename: `${id}.container.js.bundle`,
@@ -93,14 +118,12 @@ function withESAD(env, options) {
           'react/jsx-runtime': { singleton: true, eager: true, requiredVersion: pkg.dependencies.react },
           'react-native': { singleton: true, eager: true, requiredVersion: pkg.dependencies['react-native'] },
           'react-native-safe-area-context': { singleton: true, eager: true, requiredVersion: pkg.dependencies['react-native-safe-area-context'] },
-          'expo-router': { singleton: true, eager: true, requiredVersion: pkg.dependencies['expo-router'] },
-          'react-native-screens': { singleton: true, eager: true, requiredVersion: pkg.dependencies['react-native-screens'] },
-          '@module-federation/runtime': { singleton: true, eager: true },
-          '@module-federation/sdk': { singleton: true, eager: true },
-          '@codemoreira/esad/client': {
-            singleton: true,
+          '@codemoreira/esad/client': { 
+            singleton: true, 
             eager: options.type === 'host',
-            import: clientPath
+            version: sdkPkg.version,
+            requiredVersion: sdkPkg.version,
+            import: clientPath 
           },
           ...(options.shared || {})
         }
@@ -108,14 +131,24 @@ function withESAD(env, options) {
     ],
   };
 
+  // Add Host-specific DevServer magic for Expo
   if (options.type === 'host') {
     config.devServer = {
-      proxy: [
-        {
-          context: ['/.expo/.virtual-metro-entry'],
-          pathRewrite: { '^/.expo/.virtual-metro-entry': '/index.bundle' },
-        },
-      ],
+      setupMiddlewares: (middlewares) => {
+        middlewares.unshift((req, res, next) => {
+          if (req.url.startsWith('/.expo/.virtual-metro-entry.bundle')) {
+            const query = req.url.split('?')[1];
+            const isMap = req.url.includes('.map');
+            const target = isMap ? '/index.bundle.map' : '/index.bundle';
+            const location = query ? `${target}?${query}` : target;
+            res.writeHead(302, { Location: location });
+            res.end();
+            return;
+          }
+          next();
+        });
+        return middlewares;
+      },
     };
   }