feat: support configuration using integrate.config.js

#130

Author: Murat Mehmet

src/__tests__/mocks/integrate.config.js

@@ -0,0 +1,3 @@
+module.exports = {
+  plugins: ['test']
+}

src/__tests__/unit/utils/upgrade/other/importIntegrateConfig.spec.ts

@@ -0,0 +1,43 @@
+require('../../../../mocks/mockAll');
+import path from 'path';
+import { Constants } from '../../../../../constants';
+import { ImportGetter } from '../../../../../types/upgrade.types';
+import { getProjectPath } from '../../../../../utils/getProjectPath';
+import { importIntegrateConfig } from '../../../../../utils/upgrade/other/importIntegrateConfig';
+import { mockFs } from '../../../../mocks/mockFs';
+
+describe('importIntegrateConfig', () => {
+  it('should get integrate.config.js', async () => {
+    const configFile = path.join(
+      __dirname,
+      '../../../../mocks',
+      Constants.INTEGRATE_CONFIG_FILE_NAME
+    );
+    mockFs.writeFileSync(configFile, "module.exports = {plugins: ['test']}");
+
+    const importGetter = importIntegrateConfig(
+      path.join(__dirname, '../../../../mocks')
+    ) as ImportGetter;
+    expect(importGetter).toBeTruthy();
+    expect(importGetter.value).toEqual('1 plugin configuration');
+
+    await importGetter.apply();
+
+    expect(
+      mockFs.readFileSync(
+        path.join(getProjectPath(), Constants.INTEGRATE_CONFIG_FILE_NAME)
+      )
+    ).toContain("module.exports = {plugins: ['test']}");
+  });
+  it('should handle errors', () => {
+    mockFs.setReadPermission(false);
+    mockFs.writeFileSync('/oldProject/' + Constants.LOCK_FILE_NAME, '');
+
+    const importGetter = importIntegrateConfig('/oldProject') as ImportGetter;
+    expect(importGetter).toBeNull();
+  });
+  it('should handle not finding integrate config', () => {
+    const importGetter = importIntegrateConfig('/oldProject') as ImportGetter;
+    expect(importGetter).toBeNull();
+  });
+});

src/constants.ts

@@ -1,6 +1,7 @@
 export const Constants = {
   CURRENT_LOCK_VERSION: 1,
   LOCK_FILE_NAME: 'integrate-lock.json',
+  INTEGRATE_CONFIG_FILE_NAME: 'integrate.config.js',
   UPGRADE_FOLDER_NAME: '.upgrade',
   UPGRADE_CONFIG_FILE_NAME: 'upgrade.yml',
   GIT_FOLDER_NAME: '.git',

src/integrate.ts

@@ -15,6 +15,10 @@ import { IntegrationConfig, PackageWithConfig } from './types/mod.types';
 import { analyzePackages } from './utils/analyzePackages';
 import { checkCondition } from './utils/checkCondition';
 import { getErrMessage } from './utils/getErrMessage';
+import {
+  getIntegrateConfig,
+  getIntegratePackageConfig,
+} from './utils/getIntegrateConfig';
 import { getPackageConfig } from './utils/getPackageConfig';
 import { logInfoNote } from './utils/logInfoNote';
 import { parseConfig } from './utils/parseConfig';
@@ -239,6 +243,7 @@ export async function integrate(packageName?: string): Promise<void> {
   }
   if (packagesToIntegrate.length) {
     packagesToIntegrate = topologicalSort(packagesToIntegrate);
+    const integrateConfig = getIntegrateConfig();
     for (let i = 0; i < packagesToIntegrate.length; i++) {
       const { packageName, version, configPath, config } =
         packagesToIntegrate[i];
@@ -254,6 +259,14 @@ export async function integrate(packageName?: string): Promise<void> {
             variables.set(name, transformTextInObject(value))
           );
         }
+        if (integrateConfig) {
+          const integratePackageconfig = getIntegratePackageConfig(
+            integrateConfig,
+            packageName
+          );
+          if (integratePackageconfig)
+            variables.set('config', integratePackageconfig);
+        }
 
         let failedTaskCount = 0,
           completedTaskCount = 0;

src/types/integrator.types.ts

@@ -34,3 +34,7 @@ export interface PackageUpgradeConfig {
   inputs?: Record<string, any>;
   files?: Record<string, string>;
 }
+
+export interface IntegrateConfig {
+  plugins?: (string | [string, Record<string, any>])[];
+}

src/utils/getIntegrateConfig.ts

@@ -0,0 +1,37 @@
+import fs from 'fs';
+import path from 'path';
+import { Constants } from '../constants';
+import { IntegrateConfig } from '../types/integrator.types';
+import { getProjectPath } from './getProjectPath';
+
+export function getIntegrateConfig(projectPath?: string) {
+  try {
+    const configFilePath = path.join(
+      projectPath || getProjectPath(),
+      Constants.INTEGRATE_CONFIG_FILE_NAME
+    );
+    if (!fs.existsSync(configFilePath)) return null;
+    // eslint-disable-next-line @typescript-eslint/no-require-imports
+    const config = require(configFilePath) as
+      | IntegrateConfig
+      | { default: IntegrateConfig };
+    return 'default' in config ? config.default : config;
+  } catch (error) {
+    console.error('Error reading integrate.config.js:', error);
+    process.abort();
+  }
+}
+
+export function getIntegratePackageConfig(
+  integrateConfig: IntegrateConfig,
+  packageName: string
+) {
+  if (!integrateConfig) return null;
+
+  const plugin = integrateConfig.plugins?.find(
+    plugin => (Array.isArray(plugin) ? plugin[0] : plugin) === packageName
+  );
+  if (!Array.isArray(plugin)) return null;
+
+  return plugin[1] ?? null;
+}

src/utils/upgrade/importFromOldProject.ts

@@ -20,6 +20,7 @@ import { importIosDisplayName } from './ios/importIosDisplayName';
 import { importIosMarketingVersion } from './ios/importIosMarketingVersion';
 import { importIosProjectVersion } from './ios/importIosProjectVersion';
 import { importGitFolder } from './other/importGitFolder';
+import { importIntegrateConfig } from './other/importIntegrateConfig';
 import { importIntegrateLockJson } from './other/importIntegrateLockJson';
 import { importPackageJson } from './other/importPackageJson';
 import { importUpgradeFolder } from './other/importUpgradeFolder';
@@ -30,6 +31,7 @@ export async function importFromOldProject(
   const importedData: ImportGetter[] = [
     importPackageJson(oldProjectPath),
     importIntegrateLockJson(oldProjectPath),
+    importIntegrateConfig(oldProjectPath),
     importUpgradeFolder(oldProjectPath),
     importAndroidDisplayName(oldProjectPath),
     importAndroidAppId(oldProjectPath),

src/utils/upgrade/other/importIntegrateConfig.ts

@@ -0,0 +1,49 @@
+import fs from 'fs';
+import path from 'path';
+import color from 'picocolors';
+import { Constants } from '../../../constants';
+import { logMessage } from '../../../prompter';
+import { ImportGetter } from '../../../types/upgrade.types';
+import { getIntegrateConfig } from '../../getIntegrateConfig';
+import { getProjectPath } from '../../getProjectPath';
+
+export function importIntegrateConfig(
+  projectPath: string
+): ImportGetter | null {
+  try {
+    const configFilePath = path.join(
+      projectPath,
+      Constants.INTEGRATE_CONFIG_FILE_NAME
+    );
+
+    const integrateConfig = getIntegrateConfig(projectPath);
+
+    if (!integrateConfig) return null;
+
+    return {
+      id: 'integrateConfigJs',
+      title: 'Integrate Config File',
+      value: `${integrateConfig.plugins?.length || '0'} plugin configuration`,
+      apply: () => setIntegrateConfig(configFilePath),
+    };
+  } catch (_e) {
+    return null;
+  }
+}
+
+async function setIntegrateConfig(file: string) {
+  const destination = path.join(
+    getProjectPath(),
+    Constants.INTEGRATE_CONFIG_FILE_NAME
+  );
+
+  await new Promise((res, rej) => {
+    fs.copyFile(file, destination, err => {
+      if (err) rej(err);
+      else res(null);
+    });
+  });
+
+  logMessage(`imported ${color.yellow('integrate.config.js')}`);
+  return Promise.resolve();
+}

src/utils/upgrade/runUpgradeTasks.ts

@@ -81,6 +81,7 @@ export async function runUpgradeTasks(
         'node_modules/',
         'package.json',
         'integrate-lock.json',
+        'integrate.config.js',
       ];
       for (let i = 0; i < imports.length; i++) {
         updateSpinner(

website/docs/guides/configuration.md

@@ -0,0 +1,89 @@
+---
+sidebar_position: 2
+---
+
+# Configure Integration
+
+React Native Integrate now supports a configuration file system that allows you to pre-define options for packages to use while implementing their changes.
+
+Most of the time you won't need this because options can be entered through prompts.
+
+However, in some cases complex inputs are needed that can be defined here.
+
+## Configuration File
+
+Create an `integrate.config.js` file in your project root to configure React Native Integrate. The configuration file should export an object that matches the `IntegrateConfig` interface.
+
+```javascript
+// integrate.config.js
+module.exports = {
+  plugins: [
+    // Plugin configurations
+    ['plugin-with-config', {
+      // Plugin specific configuration
+      option1: 'value1',
+      option2: 'value2'
+    }]
+  ]
+};
+```
+
+## Configuration Options
+
+### Plugins
+
+The `plugins` array allows you to specify which plugins to use and their configurations:
+
+```javascript
+plugins: [
+  ['my-plugin', {
+    // Plugin specific configuration options
+    config1: 'value1'
+  }]
+]
+```
+
+## Using Configuration in Your Project
+
+The configuration file is automatically loaded when running react-native-integrate commands. The system will:
+
+1. Look for `integrate.config.js` in your project root
+2. Load and validate the configuration
+3. Apply plugin configurations as needed
+
+## Plugin Development
+
+If you're developing an integration using complex options, you can access the configuration in two ways:
+
+1. In JavaScript/TypeScript integration scripts:
+```typescript
+// Access configuration in your integration script
+import { getConfig } from '@react-native-integrate/core';
+const pluginConfig = getConfig();
+```
+
+2. In integration YAML files:
+```yaml
+# Access configuration in your integration.yml
+steps:
+  - when:
+      config:
+        someOption: true
+    task: someTask
+    # This step runs only when someOption is true in the config
+```
+
+## Error Handling
+
+If there are issues with your configuration file:
+
+1. Syntax errors will be reported with detailed error messages
+2. Invalid configuration will trigger appropriate warnings
+3. Missing configuration file is handled gracefully - the system will use default settings
+
+## Best Practices
+
+1. Keep your configuration file in the project root
+2. Document plugin-specific configuration options
+3. Version control your configuration file
+4. Use TypeScript for better type checking in your configuration file

website/docs/guides/states.md

@@ -1,5 +1,5 @@
 ---
-sidebar_position: 3
+sidebar_position: 4
 ---
 # Task States
 

website/docs/guides/when.md

@@ -1,5 +1,5 @@
 ---
-sidebar_position: 2
+sidebar_position: 3
 ---
 # Conditional Tasks