@callstack/react-native-brownfield 2.2.0 → 3.0.0-rc.1

package/src/expo-config-plugin/ios/xcodeHelpers.ts

@@ -0,0 +1,359 @@
+import path from 'node:path';
+
+import type { ModProps, XcodeProject } from '@expo/config-plugins';
+
+import { Logger } from '../logging';
+import type { ResolvedBrownfieldPluginIosConfig } from '../types';
+import { SourceModificationError } from '../errors/SourceModificationError';
+import { getFrameworkSourceFiles } from './withIosFrameworkFiles';
+import { renderTemplate } from '../template/engine';
+
+/**
+ * Adds a new Framework target to the Xcode project for Brownfield packaging
+ * @throws If target creation fails
+ * @param project The Xcode project to modify
+ * @param options Framework target options
+ */
+export function addFrameworkTarget(
+  project: XcodeProject,
+  modRequest: ModProps<XcodeProject>,
+  options: ResolvedBrownfieldPluginIosConfig
+): {
+  frameworkTargetUUID: string;
+  targetAlreadyExists: boolean;
+} {
+  const { frameworkName, bundleIdentifier } = options;
+
+  // check if target already exists
+  const existingTarget = project.pbxTargetByName(frameworkName);
+  if (existingTarget) {
+    Logger.logDebug(
+      `Framework target "${frameworkName}" already exists, skipping creation`
+    );
+
+    const frameworkTargetUUID = Object.entries(
+      project.pbxNativeTargetSection()
+    ).find(
+      ([_key, value]) =>
+        (value as any)?.productReference === existingTarget.productReference
+    )?.[0];
+
+    if (!frameworkTargetUUID) {
+      throw new SourceModificationError(
+        `Failed to find framework target UUID for ${frameworkName}, although it can be resolved by name`
+      );
+    }
+
+    return {
+      frameworkTargetUUID,
+      targetAlreadyExists: true,
+    };
+  }
+
+  Logger.logDebug(`Adding iOS framework target: ${frameworkName}`);
+
+  // create the framework target using 'framework' target type
+  const frameworkTarget = project.addTarget(
+    frameworkName,
+    'framework',
+    frameworkName,
+    bundleIdentifier
+  );
+
+  if (!frameworkTarget) {
+    throw new SourceModificationError(
+      `Failed to create framework target: ${frameworkName}`
+    );
+  }
+
+  // get the target UUID for later use
+  // const targetUuid = frameworkTarget.uuid;
+  const frameworkBuildConfigurations =
+    project.pbxXCConfigurationList()[
+      frameworkTarget.pbxNativeTarget.buildConfigurationList
+    ];
+  const debugFrameworkConfigKey: string =
+    frameworkBuildConfigurations.buildConfigurations.find(
+      ({ comment }: { comment: string }) => comment === 'Debug'
+    ).value;
+  const releaseFrameworkConfigKey: string =
+    frameworkBuildConfigurations.buildConfigurations.find(
+      ({ comment }: { comment: string }) => comment === 'Release'
+    ).value;
+
+  // update build settings on the existing configuration list
+  const debugSettings = getFrameworkBuildSettings(
+    {
+      configuration: 'Debug',
+    },
+    options
+  );
+  const releaseSettings = getFrameworkBuildSettings(
+    {
+      configuration: 'Release',
+    },
+    options
+  );
+
+  var configs = project.pbxXCBuildConfigurationSection();
+
+  // look for existing configs for the framework target
+  for (const configName in configs) {
+    let sourceBuildSettings =
+      configName === releaseFrameworkConfigKey
+        ? releaseSettings
+        : configName === debugFrameworkConfigKey
+          ? debugSettings
+          : null;
+
+    // if we have matching settings, apply them
+    if (sourceBuildSettings) {
+      const destinationBuildSettings = configs[configName].buildSettings;
+      for (const key in sourceBuildSettings) {
+        destinationBuildSettings[key] = sourceBuildSettings[key];
+      }
+
+      Logger.logDebug(
+        `Updated build settings for ${configName} configuration of target ${frameworkName}`
+      );
+    }
+  }
+
+  // Update build settings for the target
+  Object.entries(debugSettings).forEach(([key, value]) => {
+    project.updateBuildProperty(key, value, 'Debug', frameworkName);
+  });
+  Object.entries(releaseSettings).forEach(([key, value]) => {
+    project.updateBuildProperty(key, value, 'Release', frameworkName);
+  });
+
+  // create the framework group in the project
+  const filePaths = getFrameworkSourceFiles(options).map(
+    (file) => file.relativePath
+  );
+  const groupPath = path.join(modRequest.platformProjectRoot, frameworkName);
+
+  Logger.logDebug(
+    `Creating PBX group '${frameworkName}' under path '${groupPath}' with files: ${filePaths.join(', ')}`
+  );
+
+  const frameworkGroup = project.addPbxGroup(
+    filePaths,
+    frameworkName,
+    groupPath
+  );
+
+  // add the group to the main group using the proper API
+  const mainGroupKey = project.getFirstProject().firstProject.mainGroup;
+  project.addToPbxGroup(frameworkGroup.uuid, mainGroupKey);
+
+  Logger.logInfo(`Successfully added framework target: ${frameworkName}`);
+
+  return {
+    frameworkTargetUUID: frameworkTarget.uuid,
+    targetAlreadyExists: false,
+  };
+}
+
+export function addSourceFilesBuildPhase(
+  project: XcodeProject,
+  frameworkTargetUUID: string,
+  options: ResolvedBrownfieldPluginIosConfig
+) {
+  const filePaths = getFrameworkSourceFiles(options).map(
+    (file) => file.relativePath
+  );
+
+  const sourceFiles = filePaths.filter(
+    (filePath) => !filePath.endsWith('.plist')
+  );
+
+  project.addBuildPhase(
+    sourceFiles,
+    'PBXSourcesBuildPhase',
+    options.frameworkName,
+    frameworkTargetUUID,
+    'framework',
+    '""'
+  );
+}
+
+/**
+ * Returns build settings for the framework target
+ * @param options The user configuration
+ * @returns Build settings object
+ */
+function getFrameworkBuildSettings(
+  {
+    configuration,
+  }: {
+    /** Build configuration name ("Debug" or "Release") */
+    configuration: 'Debug' | 'Release';
+  },
+  {
+    bundleIdentifier,
+    deploymentTarget,
+    frameworkName,
+    frameworkVersion,
+    buildSettings: customBuildSettings,
+  }: ResolvedBrownfieldPluginIosConfig
+): Record<string, string | boolean | number> {
+  const isDebug = configuration === 'Debug';
+
+  return {
+    // settings required as per https://oss.callstack.com/react-native-brownfield/docs/getting-started/ios#required-build-settings
+    BUILD_LIBRARY_FOR_DISTRIBUTION: 'YES',
+    USER_SCRIPT_SANDBOXING: 'NO',
+    SKIP_INSTALL: 'NO',
+    ENABLE_MODULE_VERIFIER: 'NO',
+
+    // basic settings
+    PRODUCT_BUNDLE_IDENTIFIER: `"${bundleIdentifier}"`,
+    IPHONEOS_DEPLOYMENT_TARGET: deploymentTarget,
+
+    // Swift settings - use modern Swift version (5.0+) to avoid legacy Swift 3.x migration prompts
+    SWIFT_VERSION: '5.0',
+    TARGETED_DEVICE_FAMILY: `"1,2"`,
+    INFOPLIST_FILE: `${frameworkName}/Info.plist`,
+    CURRENT_PROJECT_VERSION: `"${frameworkVersion}"`,
+    PRODUCT_NAME: '"$(TARGET_NAME)"',
+    SWIFT_OPTIMIZATION_LEVEL: isDebug ? '-Onone' : '-O',
+
+    // custom build settings
+    ...customBuildSettings,
+  };
+}
+
+/**
+ * Finds the "Bundle React Native code and images" build phase from the main app target
+ * and adds it to the framework target's build phases
+ * @param project The Xcode project
+ * @param targetUuid The UUID of the framework target
+ */
+export function copyBundleReactNativePhase(
+  project: XcodeProject,
+  targetUuid: string
+): void {
+  const buildPhaseName = 'Bundle React Native code and images';
+
+  // Find the existing shell script build phase
+  const shellScriptPhases =
+    project.hash.project.objects.PBXShellScriptBuildPhase;
+  if (!shellScriptPhases) {
+    throw new SourceModificationError(
+      `No shell script build phases found, skipping ${buildPhaseName}`
+    );
+  }
+
+  // find the phase by name
+  let existingPhaseUuid: string | null = null;
+  for (const key of Object.keys(shellScriptPhases)) {
+    if (key.endsWith('_comment')) continue;
+    const phase = shellScriptPhases[key];
+    if (phase.name === `"${buildPhaseName}"` || phase.name === buildPhaseName) {
+      existingPhaseUuid = key;
+      break;
+    }
+  }
+
+  if (!existingPhaseUuid) {
+    throw new SourceModificationError(
+      `Could not find "${buildPhaseName}" build phase, skipping`
+    );
+  }
+
+  // add the phase reference to the framework target's buildPhases array
+  const nativeTargets = project.hash.project.objects.PBXNativeTarget;
+  if (nativeTargets && nativeTargets[targetUuid]) {
+    const target = nativeTargets[targetUuid];
+    if (target.buildPhases) {
+      // check if phase is already added
+      if (
+        !target.buildPhases.some(
+          (phase: { value: string }) => phase.value === existingPhaseUuid
+        )
+      ) {
+        target.buildPhases.push({
+          value: existingPhaseUuid,
+          comment: buildPhaseName,
+        });
+
+        Logger.logDebug(
+          `Added "${buildPhaseName}" build phase to framework target ${target.name}`
+        );
+      }
+    }
+  }
+}
+
+export function addExpoPre55ShellPatchScriptPhase(
+  project: XcodeProject,
+  {
+    frameworkName,
+    frameworkTargetUUID,
+  }: {
+    frameworkName: string;
+    frameworkTargetUUID: string;
+  }
+) {
+  project.addBuildPhase(
+    [
+      // no associated files
+    ],
+    'PBXShellScriptBuildPhase',
+    'Patch ExpoModulesProvider',
+    frameworkTargetUUID,
+    {
+      shellPath: '/bin/sh',
+      shellScript: renderTemplate('ios', 'patchExpoPre55.sh', {
+        '{{FRAMEWORK_NAME}}': frameworkName,
+      }),
+    }
+  );
+}
+
+/**
+ * Makes sure the patch expo modules provider phase is after the expo configure phase,
+ * otherwise the patched file would be overwritten by the expo configure phase
+ * @param project The Xcode project
+ * @param frameworkTargetUUID The UUID of the framework target
+ * @returns True if the build phases were modified, false otherwise
+ */
+export function ensureExpoPre55ShellPatchScriptPhaseIsOrdered(
+  project: XcodeProject,
+  frameworkTargetUUID: string
+) {
+  let modified = false;
+  const nativeTargetSection = project.pbxNativeTargetSection();
+
+  const buildPhases: { value: string; comment?: string }[] =
+    nativeTargetSection[frameworkTargetUUID].buildPhases;
+
+  const expoConfigurePhaseIndex = buildPhases.findIndex(
+    (phase) =>
+      (phase as any)?.comment?.toLowerCase() ===
+      '[Expo] Configure project'.toLowerCase()
+  );
+
+  const patchExpoModulesProviderPhaseIndex = buildPhases.findIndex(
+    (phase) =>
+      (phase as any)?.comment?.toLowerCase() ===
+      'Patch ExpoModulesProvider'.toLowerCase()
+  );
+
+  // ensure patch expo modules provider phase is after expo configure phase
+  if (patchExpoModulesProviderPhaseIndex < expoConfigurePhaseIndex) {
+    const element = buildPhases.splice(
+      patchExpoModulesProviderPhaseIndex,
+      1
+    )[0]; // pop the element at patchExpoModulesProviderPhaseIndex
+    buildPhases.splice(expoConfigurePhaseIndex, 0, element); // insert the element at expoConfigurePhaseIndex ("after")
+    modified = true;
+  }
+
+  nativeTargetSection[frameworkTargetUUID].buildPhases = buildPhases;
+
+  project.writeSync();
+
+  return modified;
+}

package/src/expo-config-plugin/logging.ts

@@ -0,0 +1,29 @@
+const LOG_TAG = '[react-native-brownfield]';
+
+export class Logger {
+  private static debug: boolean = false;
+
+  static setIsDebug(enabled: boolean) {
+    this.debug = enabled;
+  }
+
+  static logInfo(message: string, ...args: any[]) {
+    console.log(`${LOG_TAG} ${message}`, ...args);
+  }
+
+  static logDebug(message: string, ...args: any[]) {
+    if (!this.debug) {
+      return;
+    }
+
+    console.debug(`${LOG_TAG} ${message}`, ...args);
+  }
+
+  static logWarning(message: string, ...args: any[]) {
+    console.warn(`${LOG_TAG} ${message}`, ...args);
+  }
+
+  static logError(message: string, ...args: any[]) {
+    console.error(`${LOG_TAG} ${message}`, ...args);
+  }
+}

package/src/expo-config-plugin/template/android/AndroidManifest.xml

@@ -0,0 +1,4 @@
+<?xml version="1.0" encoding="utf-8"?>
+<manifest xmlns:android="http://schemas.android.com/apk/res/android">
+
+</manifest>

package/src/expo-config-plugin/template/android/ReactNativeHostManager.kt

@@ -0,0 +1,54 @@
+package {{PACKAGE_NAME}}
+
+import android.app.Application
+import android.content.res.Configuration
+import com.callstack.reactnativebrownfield.OnJSBundleLoaded
+import com.callstack.reactnativebrownfield.ReactNativeBrownfield
+import com.facebook.react.PackageList
+import com.facebook.react.ReactHost
+import com.facebook.react.ReactNativeApplicationEntryPoint.loadReactNative
+import com.facebook.react.ReactPackage
+import com.facebook.react.defaults.DefaultReactNativeHost
+import expo.modules.ApplicationLifecycleDispatcher
+import expo.modules.ExpoReactHostFactory
+import expo.modules.ReactNativeHostWrapper
+
+object ReactNativeHostManager {
+    fun initialize(application: Application, onJSBundleLoaded: OnJSBundleLoaded? = null) {
+        loadReactNative(application)
+
+        ApplicationLifecycleDispatcher.onApplicationCreate(application)
+
+        val reactNativeHost = ReactNativeHostWrapper(
+            application,
+            object : DefaultReactNativeHost(application) {
+                override fun getUseDeveloperSupport(): Boolean {
+                    return BuildConfig.DEBUG
+                }
+
+                override fun getPackages(): List<ReactPackage> {
+                    return PackageList(application).packages
+                }
+
+                override fun getJSMainModuleName(): String {
+                    return ".expo/.virtual-metro-entry"
+                }
+
+                override fun getBundleAssetName(): String = "index.android.bundle"
+            })
+
+
+        val reactHost: ReactHost by lazy {
+            ExpoReactHostFactory.createFromReactNativeHost(
+                context = application.applicationContext,
+                reactNativeHost = reactNativeHost
+            )
+        }
+
+        ReactNativeBrownfield.initialize(application, reactHost, onJSBundleLoaded)
+    }
+
+    fun onConfigurationChanged(application: Application, newConfig: Configuration) {
+        ApplicationLifecycleDispatcher.onConfigurationChanged(application, newConfig)
+    }
+}

package/src/expo-config-plugin/template/android/build.gradle.kts

@@ -0,0 +1,90 @@
+import groovy.json.JsonOutput
+import groovy.json.JsonSlurper
+
+plugins {
+    id("com.android.library")
+    id("org.jetbrains.kotlin.android")
+    id("com.callstack.react.brownfield")
+    `maven-publish`
+    id("com.facebook.react")
+}
+
+publishing {
+    publications {
+        create<MavenPublication>("mavenAar") {
+            groupId = "{{GROUP_ID}}"
+            artifactId = "{{ARTIFACT_ID}}"
+            version = "{{ARTIFACT_VERSION}}"
+            afterEvaluate {
+                from(components.getByName("default"))
+            }
+        }
+    }
+
+    repositories {
+        mavenLocal() // publishes to the local Maven repository (~/.m2/repository by default)
+    }
+}
+
+react {
+    autolinkLibrariesWithApp()
+}
+
+android {
+    namespace = "{{PACKAGE_NAME}}"
+    compileSdk = {{COMPILE_SDK_VERSION}}
+
+    defaultConfig {
+        minSdk = {{MIN_SDK_VERSION}}
+
+        buildConfigField(
+            "boolean",
+            "IS_EDGE_TO_EDGE_ENABLED",
+            properties["edgeToEdgeEnabled"].toString()
+        )
+        buildConfigField(
+            "boolean",
+            "IS_NEW_ARCHITECTURE_ENABLED",
+            properties["newArchEnabled"].toString()
+        )
+        buildConfigField("boolean", "IS_HERMES_ENABLED", properties["hermesEnabled"].toString())
+
+        testInstrumentationRunner = "androidx.test.runner.AndroidJUnitRunner"
+        consumerProguardFiles("consumer-rules.pro")
+    }
+
+    buildFeatures {
+        buildConfig = true
+    }
+
+    buildTypes {
+        release {
+            isMinifyEnabled = false
+            proguardFiles(
+                getDefaultProguardFile("proguard-android-optimize.txt"),
+                "proguard-rules.pro"
+            )
+        }
+    }
+    compileOptions {
+        sourceCompatibility = JavaVersion.VERSION_17
+        targetCompatibility = JavaVersion.VERSION_17
+    }
+    kotlinOptions {
+        jvmTarget = "17"
+    }
+
+    publishing {
+        multipleVariants {
+            allVariants()
+        }
+    }
+}
+
+dependencies {
+    api("com.facebook.react:react-android:{{RN_VERSION}}")
+    api("com.facebook.react:hermes-android:{{RN_VERSION}}")
+
+    api("io.coil-kt.coil3:coil-compose:3.2.0")
+    api("io.coil-kt.coil3:coil-network-okhttp:3.2.0")
+}

package/src/expo-config-plugin/template/android/gradle.properties

@@ -0,0 +1,8 @@
+android.useAndroidX=true
+
+reactNativeArchitectures=armeabi-v7a,arm64-v8a,x86,x86_64
+newArchEnabled=true
+hermesEnabled=true
+edgeToEdgeEnabled=false
+
+org.gradle.caching=true

package/src/expo-config-plugin/template/android/proguard-rules.pro

@@ -0,0 +1,21 @@
+# Add project specific ProGuard rules here.
+# You can control the set of applied configuration files using the
+# proguardFiles setting in build.gradle.
+#
+# For more details, see
+#   http://developer.android.com/guide/developing/tools/proguard.html
+
+# If your project uses WebView with JS, uncomment the following
+# and specify the fully qualified class name to the JavaScript interface
+# class:
+#-keepclassmembers class fqcn.of.javascript.interface.for.webview {
+#   public *;
+#}
+
+# Uncomment this to preserve the line number information for
+# debugging stack traces.
+#-keepattributes SourceFile,LineNumberTable
+
+# If you keep the line number information, uncomment this to
+# hide the original source file name.
+#-renamesourcefileattribute SourceFile

package/src/expo-config-plugin/template/engine.ts

@@ -0,0 +1,26 @@
+import path from 'node:path';
+import fs from 'node:fs';
+
+/**
+ * Renders a template file for the specified platform with given parameters
+ * @param platform The platform name (specifies the subdirectory of template/)
+ * @param name The template file name (with extension)
+ * @param params The params to be replaced in the template
+ * @returns The rendered template content
+ */
+export function renderTemplate(
+  platform: 'ios' | 'android',
+  name: string,
+  params?: Record<`{{${string}}}`, unknown>
+): string {
+  const templatePath = path.join(__dirname, platform, name);
+
+  let templateContent = fs.readFileSync(templatePath, 'utf8');
+
+  for (const [key, value] of Object.entries(params ?? {})) {
+    const regex = new RegExp(key, 'g');
+    templateContent = templateContent.replace(regex, String(value));
+  }
+
+  return templateContent;
+}

package/src/expo-config-plugin/template/ios/FrameworkInterface.swift

@@ -0,0 +1,8 @@
+// Export helpers from @callstack/react-native-brownfield library
+@_exported import ReactBrownfield
+@_exported import Brownie
+
+// Initializes a Bundle instance that points at the framework target.
+public let ReactNativeBundle = Bundle(for: InternalClassForBundle.self)
+
+class InternalClassForBundle {}

package/src/expo-config-plugin/template/ios/Info.plist

@@ -0,0 +1,22 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
+<plist version="1.0">
+    <dict>
+        <key>CFBundleDevelopmentRegion</key>
+        <string>$(DEVELOPMENT_LANGUAGE)</string>
+        <key>CFBundleExecutable</key>
+        <string>$(EXECUTABLE_NAME)</string>
+        <key>CFBundleIdentifier</key>
+        <string>{{BUNDLE_IDENTIFIER}}</string>
+        <key>CFBundleInfoDictionaryVersion</key>
+        <string>6.0</string>
+        <key>CFBundleName</key>
+        <string>$(PRODUCT_NAME)</string>
+        <key>CFBundlePackageType</key>
+        <string>$(PRODUCT_BUNDLE_PACKAGE_TYPE)</string>
+        <key>CFBundleShortVersionString</key>
+        <string>$(MARKETING_VERSION)</string>
+        <key>CFBundleVersion</key>
+        <string>$(CURRENT_PROJECT_VERSION)</string>
+    </dict>
+</plist>

package/src/expo-config-plugin/template/ios/PodfileTargetBlock.rb

@@ -0,0 +1,4 @@
+  # Brownfield framework target for packaging as XCFramework
+  target '{{FRAMEWORK_NAME}}' do
+    inherit! :complete
+  end