feat: New useCameraPermission()
and useMicrophonePermission()
hooks (#1823)
* Create `useCameraPermission()` and `useMicrophonePermission()` hooks * Fix exports * Await `requestPermission()`
This commit is contained in:
parent
977b859e46
commit
327aade4d8
@ -1 +1,10 @@
|
||||
/**
|
||||
* Represents Orientation. Depending on the context, this might be a sensor
|
||||
* orientation (relative to the phone's orentation), or view orientation.
|
||||
*
|
||||
* - `portrait`: **0°** (home-button at the bottom)
|
||||
* - `landscape-left`: **90°** (home-button on the left)
|
||||
* - `portrait-upside-down`: **180°** (home-button at the top)
|
||||
* - `landscape-right`: **270°** (home-button on the right)
|
||||
*/
|
||||
export type Orientation = 'portrait' | 'portrait-upside-down' | 'landscape-left' | 'landscape-right';
|
||||
|
85
package/src/hooks/useCameraPermission.ts
Normal file
85
package/src/hooks/useCameraPermission.ts
Normal file
@ -0,0 +1,85 @@
|
||||
import { useCallback, useEffect, useState } from 'react';
|
||||
import { Camera } from '../Camera';
|
||||
|
||||
interface PermissionState {
|
||||
/**
|
||||
* Whether the specified permission has explicitly been granted.
|
||||
* By default, this will be `false`. To request permission, call `requestPermission()`.
|
||||
*/
|
||||
hasPermission: boolean;
|
||||
/**
|
||||
* Requests the specified permission from the user.
|
||||
* @returns Whether the specified permission has now been granted, or not.
|
||||
*/
|
||||
requestPermission: () => Promise<boolean>;
|
||||
}
|
||||
|
||||
/**
|
||||
* Returns whether the user has granted permission to use the Camera, or not.
|
||||
*
|
||||
* If the user doesn't grant Camera Permission, you cannot use the `<Camera>`.
|
||||
*
|
||||
* @example
|
||||
* ```tsx
|
||||
* const { hasPermission, requestPermission } = useCameraPermission()
|
||||
*
|
||||
* if (!hasPermission) {
|
||||
* return <PermissionScreen onPress={requestPermission} />
|
||||
* } else {
|
||||
* return <Camera ... />
|
||||
* }
|
||||
* ```
|
||||
*/
|
||||
export function useCameraPermission(): PermissionState {
|
||||
const [hasPermission, setHasPermission] = useState(false);
|
||||
|
||||
const requestPermission = useCallback(async () => {
|
||||
const result = await Camera.requestCameraPermission();
|
||||
const hasPermissionNow = result === 'granted';
|
||||
setHasPermission(hasPermissionNow);
|
||||
return hasPermissionNow;
|
||||
}, []);
|
||||
|
||||
useEffect(() => {
|
||||
Camera.getCameraPermissionStatus().then((s) => setHasPermission(s === 'granted'));
|
||||
}, []);
|
||||
|
||||
return {
|
||||
hasPermission,
|
||||
requestPermission,
|
||||
};
|
||||
}
|
||||
|
||||
/**
|
||||
* Returns whether the user has granted permission to use the Microphone, or not.
|
||||
*
|
||||
* If the user doesn't grant Audio Permission, you can use the `<Camera>` but you cannot
|
||||
* record videos with audio (the `audio={..}` prop).
|
||||
*
|
||||
* @example
|
||||
* ```tsx
|
||||
* const { hasPermission, requestPermission } = useMicrophonePermission()
|
||||
* const canRecordAudio = hasPermission
|
||||
*
|
||||
* return <Camera video={true} audio={canRecordAudio} />
|
||||
* ```
|
||||
*/
|
||||
export function useMicrophonePermission(): PermissionState {
|
||||
const [hasPermission, setHasPermission] = useState(false);
|
||||
|
||||
const requestPermission = useCallback(async () => {
|
||||
const result = await Camera.requestMicrophonePermission();
|
||||
const hasPermissionNow = result === 'granted';
|
||||
setHasPermission(hasPermissionNow);
|
||||
return hasPermissionNow;
|
||||
}, []);
|
||||
|
||||
useEffect(() => {
|
||||
Camera.getMicrophonePermissionStatus().then((s) => setHasPermission(s === 'granted'));
|
||||
}, []);
|
||||
|
||||
return {
|
||||
hasPermission,
|
||||
requestPermission,
|
||||
};
|
||||
}
|
@ -1,16 +1,21 @@
|
||||
export * from './Camera';
|
||||
export * from './CameraDevice';
|
||||
export * from './CameraError';
|
||||
export * from './CameraProps';
|
||||
export { Frame } from './Frame';
|
||||
export * from './FrameProcessorPlugins';
|
||||
export * from './CameraProps';
|
||||
export * from './Orientation';
|
||||
export * from './PhotoFile';
|
||||
export * from './PixelFormat';
|
||||
export * from './Point';
|
||||
export * from './VideoFile';
|
||||
|
||||
export * from './hooks/useCameraDevices';
|
||||
export * from './hooks/useCameraDevice';
|
||||
export * from './hooks/useCameraFormat';
|
||||
export * from './devices/Filter';
|
||||
export * from './devices/getCameraFormat';
|
||||
export * from './devices/getCameraDevice';
|
||||
|
||||
export * from './hooks/useCameraDevice';
|
||||
export * from './hooks/useCameraDevices';
|
||||
export * from './hooks/useCameraFormat';
|
||||
export * from './hooks/useCameraPermission';
|
||||
export * from './hooks/useFrameProcessor';
|
||||
|
Loading…
Reference in New Issue
Block a user