app crashes

[ntflabsdev]

my app crashes when i click on the gallery icon in the android in all version of the android

here is my code

import { useFocusEffect, useNavigation } from '@react-navigation/native';
import React, { useState, useMemo, useEffect, useCallback } from 'react';
import { StyleSheet, View, Text, TouchableOpacity, Platform, PermissionsAndroid } from 'react-native';
import { launchImageLibrary } from 'react-native-image-picker';

import VideoEditorPlugin, {
AudioBrowser,
AudioBrowserSource,
FeaturesConfigBuilder,
VideoResolution,
WatermarkAlignment
} from 'video-editor-react-native';

import { uploadReel } from '../../utils/uploadreel';

const LICENSE_TOKEN = 'Qk5CIO4Qo2gWR/Cec+3rGX8rT/Pox0jtYx9GROOT6UscaJUGciTX/bQYFaxKlsXLu2fSMq9VXu2IFj6wMujv4OSUTWfy+XL+TqY1PYnS1E+xFQmd+1NUq0ugjs0TN4VToirL7VmWzDpUdreZux4Do4fjJL4sbkNcK68JOYRqUVydxFtE2icSjhe+YeTLdbsFlEN0n7yMeyc+gSLcXfSyNAB6nNUWycrSzo6sWnDydeYnNqKx5ei3WKyi4JV38YjVACSa87l5mBvzrX+onSO2oDvC0gLRflNKbTLZZbcjzO3J63nAS0EAUC7PNAO2Jk5jhaxiedFHMRFjvLpLsEmgEUVkEUTbjOHgG+I2QcEM1uTzEa/+9l0u+1Vu0aCAiRpHzmYKjuJOgQUQxxVfdyfNmqhSLqH8Yks4XhDwBWDP+vDhcvMKPG47rgjxCytRe2XPMvC8C+azSLF8yNcjWdZ8QFdzSJMFMXFjqlI9ZPk5J0TvYNNmfmuK0sX3brLgo7lhFrqdvHEEJGelHBVjV5HpBiZ+XYKkNvdXMW31VBJwkvBSQYITRcprRi7eDDULHHjqf/P3zro1e7HF1oslR1Lw0KdIwntA8mqNlJHaf6+dKjbqfJ+CtSJqrYv1cqFJfhNZBOng4PfxMAhpjdyZx23U1Ws=';
const videoOptions: any = { mediaType: 'video' };

export async function requestGalleryPermission() {
if (Platform.OS === "android") {
if (Platform.Version >= 33) {
await PermissionsAndroid.requestMultiple([
PermissionsAndroid.PERMISSIONS.READ_MEDIA_VIDEO,
PermissionsAndroid.PERMISSIONS.READ_MEDIA_IMAGES,
]);
} else {
await PermissionsAndroid.request(
PermissionsAndroid.PERMISSIONS.READ_EXTERNAL_STORAGE,
);
}
}
}

export default function App() {
const [errorText, setErrorText] = useState('');
const navigation = useNavigation();

// @ts-ignore (constructor is marked private in typings)
const audioBrowser = new AudioBrowser({
source: AudioBrowserSource.banubaMusic,
params: null,
});
const featuresConfig = new FeaturesConfigBuilder()
.setAudioBrowser(audioBrowser)
.build();

useFocusEffect(
    useCallback(() => {
        requestGalleryPermission();
        openDefaultEditor();
        return undefined;
    }, [])
);

const handleVideoExport = (response: any) => {
    console.log("response===>",response);


    let exportedVideoSources = response?.exportedVideoSources?.[0]; // single video path
    let exportedPreview = response?.exportedPreview;
    let exportedMeta = response?.exportedMeta;
    // uploadReel(response);
};

const handleSdkError = (e: any) => {
    console.log('handle sdk error = ' + e.code);

    let message = '';
    switch (e.code) {
        case 'ERR_SDK_NOT_INITIALIZED':
            message =
                'Failed to initialize SDK!!! The license token is incorrect: empty or truncated. Please check the license token and try again.';
            break;
        case 'ERR_SDK_LICENSE_REVOKED':
            message =
                'WARNING!!! YOUR LICENSE TOKEN EITHER EXPIRED OR REVOKED! Please contact Banuba';
            break;
        case 'ERR_MISSING_EXPORT_RESULT':
            message =
                'Missing export result: video export has not been completed successfully. Please try again';
            break;
        case 'ERR_MISSING_HOST':
            message = 'Missing host Activity to start video editor';
            break;
        case 'ERR_VIDEO_EXPORT_CANCEL':
            navigation.goBack();

            break;
        case 'ERR_INVALID_PARAMS':
            message = e.message;
            break;
        default:
            message = '';
            console.log(
                'Banuba ' +
                Platform.OS.toUpperCase() +
                ' Video Editor export failed = ' +
                e
            );
            break;
    }
    setErrorText(message);
};

const openDefaultEditor = async () => {

    async function requestGalleryPermissions() {
        if (Platform.OS === 'android') {
          try {
            const granted = await PermissionsAndroid.requestMultiple([
              PermissionsAndroid.PERMISSIONS.READ_MEDIA_IMAGES,
              PermissionsAndroid.PERMISSIONS.READ_MEDIA_VIDEO,
              PermissionsAndroid.PERMISSIONS.CAMERA,
              PermissionsAndroid.PERMISSIONS.RECORD_AUDIO,
            ]);
            console.log("Permissions result:", granted);
          } catch (err) {
            console.warn(err);
          }
        }
      }

      requestGalleryPermissions();
    const videoEditor = new VideoEditorPlugin();
    videoEditor
        .openFromCamera(LICENSE_TOKEN, featuresConfig)
        .then(handleVideoExport)
        .catch(handleSdkError);
};

const openPipEditor = async () => {
    launchImageLibrary(videoOptions, (response:any) => {
        if (response.didCancel) {
            console.warn('User cancelled photo picker');
        } else if (response?.error) {
            console.warn('ImagePicker Error: ', response?.error);
        } else {
            let videoUri = response?.uri || response?.assets?.[0]?.uri;
            console.log('# Picked video source for pip = ' + videoUri);

            const videoEditor = new VideoEditorPlugin();
            videoEditor
                .openFromPip(LICENSE_TOKEN, featuresConfig, videoUri)
                .then(handleVideoExport)
                .catch(handleSdkError);
        }
    });
};

const openTrimmerEditor = async () => {
    launchImageLibrary(videoOptions, (response:any) => {
        if (response.didCancel) {
            console.warn('User cancelled photo picker');
        } else if (response.error) {
            console.warn('ImagePicker Error: ', response.error);
        } else {
            let videoUri = response.uri || response.assets?.[0]?.uri;
            console.log('# Picked video source for trimmer = ' + videoUri);
            let videoSources = [videoUri];

            const videoEditor = new VideoEditorPlugin();
            videoEditor
                .openFromTrimmer(LICENSE_TOKEN, featuresConfig, videoSources)
                .then(handleVideoExport)
                .catch(handleSdkError);
        }
    });
};

return (
    <View style={styles.container}>
        <View style={styles.headerContainer}>
            <Text style={styles.title}>
                Sample integration of Banuba Video into React Native project
            </Text>
        </View>
        <View style={styles.buttonsWrapper}>
            <View style={styles.buttonsContainer}>
                {errorText ? <Text style={styles.errorText}>{errorText}</Text> : null}

                <TouchableOpacity style={styles.button} onPress={openDefaultEditor}>
                    <Text style={styles.buttonText}>Open Video Editor - Default</Text>
                </TouchableOpacity>

                <TouchableOpacity style={styles.button} onPress={openPipEditor}>
                    <Text style={styles.buttonText}>Open Video Editor - PIP</Text>
                </TouchableOpacity>

                <TouchableOpacity style={styles.button} onPress={openTrimmerEditor}>
                    <Text style={styles.buttonText}>Open Video Editor - Trimmer</Text>
                </TouchableOpacity>
            </View>
        </View>
    </View>
);

}

const styles = StyleSheet.create({
container: {
backgroundColor: 'white',
flex: 1,
},
headerContainer: {
height: '33%',
justifyContent: 'center',
alignItems: 'center',
paddingHorizontal: 16,
},
title: {
fontSize: 18,
textAlign: 'center',
},
buttonsWrapper: {
position: 'absolute',
top: 50,
bottom: 0,
left: 0,
right: 0,
justifyContent: 'center',
alignItems: 'center',
paddingHorizontal: 16,
},
buttonsContainer: {
alignItems: 'center',
width: '100%',
maxWidth: 300,
},
errorText: {
color: '#ff0000',
fontSize: 16,
fontWeight: '800',
textAlign: 'center',
marginBottom: 16,
},
button: {
backgroundColor: '#007bff',
paddingVertical: 12,
borderRadius: 30,
alignItems: 'center',
shadowColor: '#000',
shadowOffset: { width: 0, height: 4 },
shadowOpacity: 0.3,
shadowRadius: 5,
elevation: 5,
width: '100%',
marginVertical: 8,
},
buttonText: {
color: 'white',
fontSize: 16,
fontWeight: '600',
},
});