plugin-permissions

The “plugin-permissions” holds a pivotal role as a plugin within the Flagship Code framework, dedicated to automating the generation of native code configurations essential for managing permissions listed in your project’s build configuration. Its primary function is to streamline the integration of required permissions by leveraging the capabilities of react-native-permissions. As a crucial aspect of its functionality, this plugin establishes a dependency on react-native-permissions to ensure the proper linking of native permissions. It’s important to note that react-native-permissions is a peer dependency and must be listed in your project’s package.json. By seamlessly integrating with react-native-permissions, the plugin empowers developers to efficiently manage permissions within their projects, thereby enhancing the reliability and security of their applications while minimizing manual configuration overhead.

Caution

This plugin operates under the assumption that you are utilizing react-native-permissions as your permissions handler.

Install

Add @brandingbrand/code-plugin-permissions as a development dependency to your React Native project.

yarn

yarn add --dev @brandingbrand/code-plugin-permissions
yarn add react-native-permissions

npm

npm install --save-dev @brandingbrand/code-plugin-permissions
npm install react-native-permissions

pnpm

pnpm add --save-dev @brandingbrand/code-plugin-permissions
pnpm add react-native-permissions

bun

bun add --dev @brandingbrand/code-plugin-permissions
bun add react-native-permissions

Your package.json should now be updated, @brandingbrand/code-plugin-permissions should be listed as a devDependency.

package.json

{
  "name": "my-awesome-app",
  "version": "1.0.0",
  "author": "Your Name <email@example.com>",
  "dependencies": {
    "react": "^18.2.0",
    "react-native": "~0.72.0"
  },
  "dependencies": {
    "react-native-permissions": "4.1.4"
  },
  "devDependencies": {
    "@brandingbrand/code-plugin-permissions": "2.0.0"
  }
}

Configure

Flagship Code Configuration

Upon installing the dependency, it is imperative to update the flagship-code.config.ts file. Specifically, ensure that the plugins array includes the newly installed dependency. This step is crucial, as Flagship Code will only invoke the plugin if it is listed within this array. By including the dependency in the plugins array, you enable Flagship Code to recognize and utilize the functionality provided by the plugin during project execution.

flagship-code.config.ts

import { defineConfig } from "@brandingbrand/code-cli-kit";

export default defineConfig({
  buildPath: "./coderc/build",
  envPath: "./coderc/env",
  pluginPath: "./coderc/plugins",
  preset: "@brandingbrand/code-preset-react-native",
  plugins: [
    // other plugins
    "@brandingbrand/code-plugin-permissions",
  ],
});

For more detailed guidance and information, please refer to the Flagship Code Configuration guide. This resource offers comprehensive instructions and insights to assist you in configuring Flagship Code effectively.

Build Configuration

Depending on the plugin in use, additional configuration might be necessary. For the plugin-permissions, a mandatory configuration must be incorporated into the build settings. This configuration entails specifying a list of permissions that your app necessitates.

For the purpose of illustration, the build.internal.ts configuration shall be presented as follows:

build.internal.ts

import { defineBuild } from "@brandingbrand/code-cli-kit";
import { type CodePresetReactNative } from "@brandingbrand/code-preset-react-native";
import { type CodePluginPermissions } from "@brandingbrand/code-plugin-permissions";

export default defineBuild<CodePresetReactNative & CodePluginPermissions>({
  ios: {
    bundleId: "com.brandingbrand",
    displayName: "Branding Brand",
  },
  android: {
    packageName: "com.brandingbrand",
    displayName: "Branding Brand",
  },
  codePluginPermissions: {
    plugin: {
      ios: [
        {
          permission: "Camera",
          text: "Let me use the camera",
        },
      ],
      android: ["CAMERA"],
    },
  },
});

Options

codePluginPermissions.plugin.ios

type: PermissionsIOS

Optional iOS permissions configuration.

PermissionsIOS

permission

type: string

required

The permission key for the iOS permission.

text

type: string

Optional text providing additional information about the permission. This property is required if the usageKey for the permission is defined.

purposeKey

type: string

Optional purpose key for the permission. This property is required if the purposeKey for the permission is defined.

codePluginPermissions.plugin.android

type: PermissionsAndroid

Optional iOS permissions configuration.

PermissionsAndroid

type: string[]

The list of permission keys for the Android permission.