# Move uppy into seperate component in React-nativee

**URL:** <https://community.transloadit.com/t/move-uppy-into-seperate-component-in-react-nativee/16314>\
**Category:** Uppy\
**Created:** [November 7, 2022, 11:21pm UTC](https://community.transloadit.com/t/move-uppy-into-seperate-component-in-react-nativee/16314 "2022-11-07T23:21:01Z")\
**Posts on this page:** 1\
**Page:** 1

<div class="post-metadata">

**Author:** ![Mohammed-alhasan](https://yyz2.discourse-cdn.com/flex032/user_avatar/community.transloadit.com/mohammed-alhasan/32/698_2.png) [@Mohammed-alhasan](https://community.transloadit.com/u/Mohammed-alhasan)\
**Post date:** [November 7, 2022, 11:21pm UTC](https://community.transloadit.com/t/move-uppy-into-seperate-component-in-react-nativee/16314/1 "2022-11-07T23:21:01Z")

</div>

Hi , we are currently using Uppy and Tus to upload files to Aws S3 , all the functionality is working fine, until we decided to move Uppy into a seperate component , we can still upload and see the progress , but we dont get the response from **uppy.on(‘upload-success’)** is there anyway to handle this  
Thank you  
`import Tus from ‘@uppy/tus’;  
import Uppy, { UploadResult} from ‘@uppy/core’;  
import {ImagePickerResponse} from ‘react-native-image-picker’;

export const uploadFile = async (  
file: ImagePickerResponse | null,  
userId: string,  
orgId: string,  
accessToken: string,  
refreshToken: string,  
): Promise =\> {  
var uploadResult: any;

const uppy = new Uppy({  
autoProceed: true,  
});

uppy.use(Tus, {  
endpoint: ‘[http://localhost:1080/uploads](http://localhost:1080/uploads)’,  
retryDelays: [0, 1000, 3000, 5000],  
});

if (file !== null && file.assets) {  
uppy.addFiles(  
file.assets?.map(asset =\> {  
return {  
name: asset.fileName,  
type: asset.type,  
data: asset,  
meta: {  
name: asset.fileName,  
type: asset.type,  
orgID: orgId,  
userID: userId,  
contentType: asset.type,  
},  
};  
}),  
);  
} else {  
console.log(‘something went wrong when uploadin the file’);  
}

uppy.on(‘upload’, (data: any) =\> {  
console.log(‘upload started’, data);  
});

uppy.on(‘upload-progress’, (file, progress) =\> {  
console.log(‘upload progress’, progress);  
});

uppy.on(‘error’, (error: any) =\> {  
console.log(‘error’, error);  
});

await uppy.upload();

uppy.on(‘upload-success’, (file, res) =\> {  
console.log(‘upload success’, res);  
uploadResult = res;  
});

return uploadResult;  
};  
`