@brainylab/react-native-permissions NPM

This library was developed to support the new architecture of React Native - TurboModule, it does not support old versions of react native.

Support only New Architecture an react-native > 0.71.0

Installation

# use npm
npm install @brainylab/react-native-permissions
# or use yarn
yarn add @brainylab/react-native-permissions
# or use pnpm
pnpm i @brainylab/react-native-permissions

Enable the New Architecture

on android

You will only need to update your android/gradle.properties file as follows:

-newArchEnabled=false
+newArchEnabled=true

on ios

You will only need to reinstall your pods by running pod install with the right flag:

# Run pod install with the flag:
RCT_NEW_ARCH_ENABLED=1 bundle exec pod install

Camera Permission

To request camera permission, you must first specify that your app requires camera permissions.

iOS

Open your project's Info.plist and add the following lines inside the outermost <dict> tag:

<key>NSCameraUsageDescription</key>
<string>$(PRODUCT_NAME) needs access to your Camera.</string>

Android

Open your project's AndroidManifest.xml and add the following lines inside the <manifest> tag:

<uses-permission android:name="android.permission.CAMERA" />

Usage

Use React Hook useCameraPermission()

import { useCameraPermission } from '@brainylab/react-native-permissions';

const { status, requestPermission } = useCameraPermission();

console.log(status) // return -> 'authorized' | 'not-determined' | 'denied' | 'restricted'

or getCameraPermissionStatus() and await requestCameraPermission()

const status = getCameraPermissionStatus() // return -> 'authorized' | 'not-determined' | 'denied' | 'restricted'

const status = await requestCameraPermission() // return -> 'authorized' | 'denied'

Example in Functional Component

import React from 'react';
import {StyleSheet, View, Text, TouchableOpacity} from 'react-native';

import {useCameraPermission} from '@brainylab/react-native-permissions';

export default function App() {
  const {status, requestPermission} = useCameraPermission();

  return (
    <View style={styles.container}>
      <Text>Result: {status}</Text>
      <TouchableOpacity style={styles.button} onPress={requestPermission}>
        <Text>Request Permission</Text>
      </TouchableOpacity>
    </View>
  );
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    alignItems: 'center',
    justifyContent: 'center',
    backgroundColor: 'white',
  },
  button: {
    marginTop: 40,
    backgroundColor: 'green',
    padding: 10,
  },
});

Permission Status

Return Value Type - `string`	iOS	Android
`authorized`	✅	✅
`denied`	✅	✅
`not-determined`	✅	✅
`restricted`	✅	❌

Examples

The source code for the example (showcase) app is under the Example/ directory. If you want to play with the API but don't feel like trying it on a real app, you can run the example project.