react-native-timacare 3.3.28 → 3.3.29

package/src/screens/uploadVideo/index.tsx

@@ -10,7 +10,10 @@ import {
   View,
 } from 'react-native';
 import { formatDDMMYYY, formatMoney } from '../../utils';
-import { RNCamera } from 'react-native-camera';
+import {
+  Camera as VisionCamera,
+  useCameraDevice,
+} from 'react-native-vision-camera';
 import MButton from '../../components/MButton';
 import { IconPause, IconPlay } from '../../assets/icons';
 import { MText } from '../../components/MText';
@@ -39,6 +42,8 @@ export const Video = observer(function Video(props: any) {
   const [count, setCount] = useState(COUNTDOWN_SECONDS);
   const [isRecording, setIsRecording] = useState(false);
   const [isLoading, setIsLoading] = useState(false);
+  const [passPermission, setPassPermission] = useState(false);
+  const device = useCameraDevice('front');
 
   const loan = props?.route?.params?.loan;
   const content = useMemo(() => {
@@ -56,7 +61,10 @@ export const Video = observer(function Video(props: any) {
       (permission) => statuses[permission] !== RESULTS.GRANTED
     );
 
-    if (toRequest.length === 0) return true;
+    if (toRequest.length === 0) {
+      setPassPermission(true);
+      return true;
+    }
 
     const requested = await requestMultiple(toRequest);
     const values = Object.values(requested);
@@ -64,6 +72,7 @@ export const Video = observer(function Video(props: any) {
     const anyBlocked = values.some((status) => status === RESULTS.BLOCKED);
 
     if (!allGranted) {
+      setPassPermission(false);
       Alert.alert(
         'Thông báo',
         anyBlocked
@@ -81,6 +90,7 @@ export const Video = observer(function Video(props: any) {
       );
     }
 
+    setPassPermission(allGranted);
     return allGranted;
   };
 
@@ -114,19 +124,20 @@ export const Video = observer(function Video(props: any) {
 
     setIsRecording(true);
     try {
-      const data = await camera.current.recordAsync({
-        quality: RNCamera.Constants.VideoQuality['480p'],
-        videoBitrate: 1500000,
-        ...(Platform.OS === 'ios'
-          ? { codec: RNCamera.Constants.VideoCodec.H264 }
-          : {}),
+      const data = await new Promise((resolve, reject) => {
+        camera.current.startRecording({
+          videoCodec: Platform.OS === 'ios' ? 'h264' : undefined,
+          onRecordingFinished: resolve,
+          onRecordingError: reject,
+        });
       });
 
       setIsLoading(true);
+      const uri = 'file://' + data.path;
       const formData = new FormData();
       formData.append('video', {
-        name: data.uri.split(/[\\/]/).pop(),
-        uri: data.uri,
+        name: data.path.split(/[\\/]/).pop(),
+        uri,
         type: 'video/*',
       });
 
@@ -188,27 +199,16 @@ export const Video = observer(function Video(props: any) {
               </MText>
             </View>
           )}
-          <RNCamera
-            ref={camera}
-            style={styles.preview}
-            type={RNCamera.Constants.Type.front}
-            permissionDialogTitle={'Permission to use camera'}
-            permissionDialogMessage={
-              'We need your permission to use your camera phone'
-            }
-            androidCameraPermissionOptions={{
-              title: 'Permission to use camera',
-              message: 'We need your permission to use your camera',
-              buttonPositive: 'Ok',
-              buttonNegative: 'Cancel',
-            }}
-            androidRecordAudioPermissionOptions={{
-              title: 'Permission to use audio recording',
-              message: 'We need your permission to use your audio',
-              buttonPositive: 'Ok',
-              buttonNegative: 'Cancel',
-            }}
-          />
+          {passPermission && device ? (
+            <VisionCamera
+              ref={camera}
+              style={styles.preview}
+              device={device}
+              isActive={true}
+              video={true}
+              audio={true}
+            />
+          ) : null}
           <View
             style={{
               backgroundColor: '#00000080',
@@ -217,6 +217,7 @@ export const Video = observer(function Video(props: any) {
               bottom: 0,
               left: 0,
               right: 0,
+              paddingVertical: 16,
             }}
           >
             {isRecording ? (
@@ -224,7 +225,6 @@ export const Video = observer(function Video(props: any) {
                 style={{
                   justifyContent: 'center',
                   alignItems: 'center',
-                  marginBottom: 20,
                 }}
                 onPress={() => {
                   stopRecording();
@@ -237,7 +237,6 @@ export const Video = observer(function Video(props: any) {
                 style={{
                   justifyContent: 'center',
                   alignItems: 'center',
-                  marginBottom: 20,
                 }}
                 disabled={videoStore.isLoading}
                 onPress={() => {