Fce 1717 configure plugins (#445)

## Description

Describe your changes in detail

## Motivation and Context

Why is this change required? What problem does it solve? If it fixes an
open
issue, please link to the issue here.

## How has this been tested?

Please describe in detail how you tested your changes. Include details
of your
testing environment, devices (ex. Iphone XYZ ios X.X.X & Samsung XYZ
android
X.X.X)

## Types of changes

- [ ] Bug fix (non-breaking change which fixes an issue)
- [ ] New feature (non-breaking change which adds functionality)
- [ ] Breaking change (fix or feature that would cause existing
functionality to
      not work as expected)

## Checklist:

- [ ] My code follows the code style of this project.
- [ ] My change requires a change to the documentation.
- [ ] I have updated the documentation accordingly.

## Screenshots (if appropriate)

Author: dawidmatyjasik

common/plugins/src/with-custom-config-ios.ts

@@ -6,15 +6,18 @@ const removeGeneratedBlockIos = (podfileContent: string, marker: string) => {
   return podfileContent.replace(regex, '');
 };
 
-const replaceCloudClientForExtension = (podfileContent: string) => {
-  const targetName = 'FishjamScreenBroadcastExtension';
+const replaceCloudClientForExtension = (
+  podfileContent: string,
+  extensionTargetName?: string,
+) => {
+  const extTargetName = extensionTargetName || 'FishjamScreenBroadcastExtension';
   const podToReplace = "pod 'FishjamCloudClient/Broadcast'";
   const replacementPod = `
   ${INFO_GENERATED_COMMENT_IOS}
   pod 'FishjamCloudClient/Broadcast', :path => '../../../'`;
 
   const targetRegex = new RegExp(
-    `target '${targetName}' do[\\s\\S]*?${podToReplace}[\\s\\S]*?end`,
+    `target '${extTargetName}' do[\\s\\S]*?${podToReplace}[\\s\\S]*?end`,
     'g',
   );
 
@@ -36,16 +39,16 @@ const replaceCloudClientForMainApp = (
   return podfileContent;
 };
 
-export const withCustomConfigIos: ConfigPlugin<{ targetName: string }> = (
+export const withCustomConfigIos: ConfigPlugin<{ targetName: string; extensionTargetName?: string }> = (
   config,
-  { targetName },
+  { targetName, extensionTargetName },
 ) => {
   config = withPodfile(config, (configuration) => {
     let podfile = configuration.modResults.contents;
 
     podfile = removeGeneratedBlockIos(podfile, INFO_GENERATED_COMMENT_IOS.trim());
 
-    podfile = replaceCloudClientForExtension(podfile);
+    podfile = replaceCloudClientForExtension(podfile, extensionTargetName);
     podfile = replaceCloudClientForMainApp(targetName, podfile);
 
     configuration.modResults.contents = podfile;

common/plugins/src/with-local-paths-for-native-packages.ts

@@ -4,15 +4,16 @@ import { withCustomConfigAndroid } from "./with-custom-config-android";
 
 type PluginProps = {
   iosTargetName?: string;
+  extensionTargetName?: string;
 };
 
 const withLocalPathsForNativePackages: ConfigPlugin<PluginProps> = (
   config,
   props = {},
 ) => {
-  const { iosTargetName } = props;
+  const { iosTargetName, extensionTargetName } = props;
 
-  config = withCustomConfigIos(config, { targetName: iosTargetName });
+  config = withCustomConfigIos(config, { targetName: iosTargetName, extensionTargetName });
   config = withCustomConfigAndroid(config);
 
   return config;

packages/react-native-client/plugin/src/types.ts

@@ -8,6 +8,9 @@ export type FishjamPluginOptions =
         iphoneDeploymentTarget?: string;
         enableScreensharing?: boolean;
         supportsPictureInPicture?: boolean;
+        appGroupContainerId?: string;
+        mainTargetName?: string;
+        broadcastExtensionTargetName?: string;
       };
     }
   | undefined;

packages/react-native-client/plugin/src/withFishjamIos.ts

@@ -10,11 +10,18 @@ import * as fs from 'promise-fs';
 import * as path from 'path';
 import { FishjamPluginOptions } from './types';
 
-const SBE_TARGET_NAME = 'FishjamScreenBroadcastExtension';
-export const SBE_PODFILE_SNIPPET = `
-target '${SBE_TARGET_NAME}' do
-  pod 'FishjamCloudClient/Broadcast'
-end`;
+function getSbeTargetName(props: FishjamPluginOptions) {
+  return (
+    props?.ios?.broadcastExtensionTargetName ||
+    'FishjamScreenBroadcastExtension'
+  );
+}
+
+export function getSbePodfileSnippet(props: FishjamPluginOptions) {
+  const targetName = getSbeTargetName(props);
+  return `\ntarget '${targetName}' do\n  pod 'FishjamCloudClient/Broadcast'\nend`;
+}
+
 const TARGETED_DEVICE_FAMILY = `"1,2"`;
 const IPHONEOS_DEPLOYMENT_TARGET = '15.1';
 const GROUP_IDENTIFIER_TEMPLATE_REGEX = /{{GROUP_IDENTIFIER}}/gm;
@@ -28,8 +35,10 @@ async function updateFileWithRegex(
   fileName: string,
   regex: RegExp,
   value: string,
+  props: FishjamPluginOptions,
 ) {
-  const filePath = `${iosPath}/${SBE_TARGET_NAME}/${fileName}`;
+  const targetName = getSbeTargetName(props);
+  const filePath = `${iosPath}/${targetName}/${fileName}`;
   let file = await fs.readFile(filePath, { encoding: 'utf-8' });
   file = file.replace(regex, value);
   await fs.writeFile(filePath, file);
@@ -39,25 +48,26 @@ async function updateFileWithRegex(
  * Inserts a required target to Podfile.
  * This is needed to provide the dependency of FishjamCloudClient/Broadcast to the extension.
  */
-async function updatePodfile(iosPath: string) {
+async function updatePodfile(iosPath: string, props: FishjamPluginOptions) {
+  const podfileSnippet = getSbePodfileSnippet(props);
   let matches;
   try {
     const podfile = await fs.readFile(`${iosPath}/Podfile`, {
       encoding: 'utf-8',
     });
-    matches = podfile.match(SBE_PODFILE_SNIPPET);
+    matches = podfile.match(podfileSnippet);
   } catch (e) {
     console.error('Error reading from Podfile: ', e);
   }
 
   if (matches) {
     console.log(
-      `${SBE_TARGET_NAME} target already added to Podfile. Skipping...`,
+      `${getSbeTargetName(props)} target already added to Podfile. Skipping...`,
     );
     return;
   }
   try {
-    fs.appendFile(`${iosPath}/Podfile`, SBE_PODFILE_SNIPPET);
+    fs.appendFile(`${iosPath}/Podfile`, podfileSnippet);
   } catch (e) {
     console.error('Error writing to Podfile: ', e);
   }
@@ -67,10 +77,15 @@ async function updatePodfile(iosPath: string) {
  * Adds "App Group" permission
  * App Group allow your app and the FishjamScreenBroadcastExtension to communicate with each other.
  */
-const withAppGroupPermissions: ConfigPlugin = (config) => {
+const withAppGroupPermissions: ConfigPlugin<FishjamPluginOptions> = (
+  config,
+  props,
+) => {
   const APP_GROUP_KEY = 'com.apple.security.application-groups';
   const bundleIdentifier = config.ios?.bundleIdentifier || '';
-  const groupIdentifier = `group.${bundleIdentifier}`;
+  const groupIdentifier =
+    props?.ios?.appGroupContainerId || `group.${bundleIdentifier}`;
+  const mainTarget = props?.ios?.mainTargetName || '';
 
   config.ios ??= {};
   config.ios.entitlements ??= {};
@@ -117,16 +132,13 @@ const withAppGroupPermissions: ConfigPlugin = (config) => {
       enabled: 1,
     };
 
-    const entitlementsFilePath = `${props.modRequest.projectName}/${props.modRequest.projectName}.entitlements`;
+    const mainTargetName = mainTarget || props.modRequest.projectName;
+    const entitlementsFilePath = `${mainTargetName}/${mainTargetName}.entitlements`;
     const configurations = xcodeProject.pbxXCBuildConfigurationSection();
 
     Object.keys(configurations).forEach((key) => {
       const config = configurations[key];
-      if (
-        config.buildSettings?.PRODUCT_NAME?.includes(
-          props.modRequest.projectName,
-        )
-      ) {
+      if (config.buildSettings?.PRODUCT_NAME?.includes(mainTargetName)) {
         if (!config.buildSettings.CODE_SIGN_ENTITLEMENTS) {
           config.buildSettings.CODE_SIGN_ENTITLEMENTS = entitlementsFilePath;
         }
@@ -143,12 +155,17 @@ const withAppGroupPermissions: ConfigPlugin = (config) => {
  * Adds constants to Info.plist
  * In other to dynamically retreive extension's bundleId and group name we need to store it in Info.plist.
  */
-const withInfoPlistConstants: ConfigPlugin = (config) =>
+const withInfoPlistConstants: ConfigPlugin<FishjamPluginOptions> = (
+  config,
+  props,
+) =>
   withInfoPlist(config, (configuration) => {
     const bundleIdentifier = configuration.ios?.bundleIdentifier || '';
-    configuration.modResults['AppGroupName'] = `group.${bundleIdentifier}`;
+    const groupIdentifier =
+      props?.ios?.appGroupContainerId || `group.${bundleIdentifier}`;
+    configuration.modResults['AppGroupName'] = groupIdentifier;
     configuration.modResults['ScreenShareExtensionBundleId'] =
-      `${bundleIdentifier}.${SBE_TARGET_NAME}`;
+      `${bundleIdentifier}.${getSbeTargetName(props)}`;
     return configuration;
   });
 
@@ -161,7 +178,10 @@ const withFishjamSBE: ConfigPlugin<FishjamPluginOptions> = (config, options) =>
     const appName = props.modRequest.projectName || '';
     const iosPath = props.modRequest.platformProjectRoot;
     const bundleIdentifier = props.ios?.bundleIdentifier;
+    const groupIdentifier =
+      options?.ios?.appGroupContainerId || `group.${bundleIdentifier}`;
     const xcodeProject = props.modResults;
+    const targetName = getSbeTargetName(options);
 
     const pluginDir = require.resolve(
       '@fishjam-cloud/react-native-client/package.json',
@@ -171,12 +191,20 @@ const withFishjamSBE: ConfigPlugin<FishjamPluginOptions> = (config, options) =>
       '../plugin/broadcastExtensionFiles/',
     );
 
-    await updatePodfile(iosPath);
+    await updatePodfile(iosPath, options);
 
     const projPath = `${iosPath}/${appName}.xcodeproj/project.pbxproj`;
+    const templateTargetName = 'FishjamScreenBroadcastExtension';
+
     const extFiles = [
       'FishjamBroadcastSampleHandler.swift',
-      `${SBE_TARGET_NAME}.entitlements`,
+      `${templateTargetName}.entitlements`,
+      `Info.plist`,
+    ];
+
+    const destFiles = [
+      'FishjamBroadcastSampleHandler.swift',
+      `${targetName}.entitlements`,
       `Info.plist`,
     ];
 
@@ -185,50 +213,48 @@ const withFishjamSBE: ConfigPlugin<FishjamPluginOptions> = (config, options) =>
         console.error(`Error parsing iOS project: ${JSON.stringify(err)}`);
         return;
       }
-
-      if (xcodeProject.pbxTargetByName(SBE_TARGET_NAME)) {
-        console.log(
-          `${SBE_TARGET_NAME} already exists in project. Skipping...`,
-        );
+      if (xcodeProject.pbxTargetByName(targetName)) {
+        console.log(`${targetName} already exists in project. Skipping...`);
         return;
       }
       try {
-        // copy extension files
-        await fs.mkdir(`${iosPath}/${SBE_TARGET_NAME}`, { recursive: true });
+        await fs.mkdir(`${iosPath}/${targetName}`, { recursive: true });
         for (let i = 0; i < extFiles.length; i++) {
-          const extFile = extFiles[i];
-          const targetFile = `${iosPath}/${SBE_TARGET_NAME}/${extFile}`;
-          await fs.copyFile(`${extensionSourceDir}${extFile}`, targetFile);
+          const srcFile = `${extensionSourceDir}${extFiles[i]}`;
+          const destFile = `${iosPath}/${targetName}/${destFiles[i]}`;
+          await fs.copyFile(srcFile, destFile);
         }
       } catch (e) {
         console.error('Error copying extension files: ', e);
       }
 
-      // update extension files
       await updateFileWithRegex(
         iosPath,
-        `${SBE_TARGET_NAME}.entitlements`,
+        `${targetName}.entitlements`,
         GROUP_IDENTIFIER_TEMPLATE_REGEX,
-        `group.${bundleIdentifier}`,
+        groupIdentifier,
+        options,
       );
       await updateFileWithRegex(
         iosPath,
         'FishjamBroadcastSampleHandler.swift',
         GROUP_IDENTIFIER_TEMPLATE_REGEX,
-        `group.${bundleIdentifier}`,
+        groupIdentifier,
+        options,
       );
       await updateFileWithRegex(
         iosPath,
         'FishjamBroadcastSampleHandler.swift',
         BUNDLE_IDENTIFIER_TEMPLATE_REGEX,
         bundleIdentifier || '',
+        options,
       );
 
       // Create new PBXGroup for the extension
       const extGroup = xcodeProject.addPbxGroup(
         extFiles,
-        SBE_TARGET_NAME,
-        SBE_TARGET_NAME,
+        targetName,
+        targetName,
       );
 
       // Add the new PBXGroup to the top level group. This makes the
@@ -253,10 +279,10 @@ const withFishjamSBE: ConfigPlugin<FishjamPluginOptions> = (config, options) =>
       // Add the SBE target
       // This adds PBXTargetDependency and PBXContainerItemProxy for you
       const sbeTarget = xcodeProject.addTarget(
-        SBE_TARGET_NAME,
+        targetName,
         'app_extension',
-        SBE_TARGET_NAME,
-        `${bundleIdentifier}.${SBE_TARGET_NAME}`,
+        targetName,
+        `${bundleIdentifier}.${targetName}`,
       );
 
       // Add build phases to the new target
@@ -290,16 +316,15 @@ const withFishjamSBE: ConfigPlugin<FishjamPluginOptions> = (config, options) =>
       for (const key in configurations) {
         if (
           typeof configurations[key].buildSettings !== 'undefined' &&
-          configurations[key].buildSettings.PRODUCT_NAME ===
-            `"${SBE_TARGET_NAME}"`
+          configurations[key].buildSettings.PRODUCT_NAME === `"${targetName}"`
         ) {
           const buildSettingsObj = configurations[key].buildSettings;
           buildSettingsObj.IPHONEOS_DEPLOYMENT_TARGET =
             options?.ios?.iphoneDeploymentTarget ?? IPHONEOS_DEPLOYMENT_TARGET;
           buildSettingsObj.TARGETED_DEVICE_FAMILY = TARGETED_DEVICE_FAMILY;
-          buildSettingsObj.CODE_SIGN_ENTITLEMENTS = `${SBE_TARGET_NAME}/${SBE_TARGET_NAME}.entitlements`;
+          buildSettingsObj.CODE_SIGN_ENTITLEMENTS = `${targetName}/${targetName}.entitlements`;
           buildSettingsObj.CODE_SIGN_STYLE = 'Automatic';
-          buildSettingsObj.INFOPLIST_FILE = `${SBE_TARGET_NAME}/Info.plist`;
+          buildSettingsObj.INFOPLIST_FILE = `${targetName}/Info.plist`;
           buildSettingsObj.SWIFT_VERSION = '5.0';
           buildSettingsObj.MARKETING_VERSION = '1.0.0';
           buildSettingsObj.CURRENT_PROJECT_VERSION = '1';
@@ -335,8 +360,8 @@ const withFishjamPictureInPicture: ConfigPlugin<FishjamPluginOptions> = (
  */
 const withFishjamIos: ConfigPlugin<FishjamPluginOptions> = (config, props) => {
   if (props?.ios?.enableScreensharing) {
-    config = withAppGroupPermissions(config);
-    config = withInfoPlistConstants(config);
+    config = withAppGroupPermissions(config, props);
+    config = withInfoPlistConstants(config, props);
     config = withFishjamSBE(config, props);
   }
   config = withPodfileProperties(config, (configuration) => {