diff --git a/components/upload-progress-local/upload-progress-local.component.jsx b/components/upload-progress-local/upload-progress-local.component.jsx index ab237f0..26393ca 100644 --- a/components/upload-progress-local/upload-progress-local.component.jsx +++ b/components/upload-progress-local/upload-progress-local.component.jsx @@ -1,5 +1,5 @@ -import * as MediaLibrary from 'expo-media-library'; -import React, { useEffect, useState } from 'react'; +import * as MediaLibrary from "expo-media-library"; +import React, { useEffect, useState } from "react"; import { ActivityIndicator, @@ -8,20 +8,20 @@ import { StyleSheet, Text, View, -} from 'react-native'; -import { ProgressBar } from 'react-native-paper'; -import Toast from 'react-native-toast-message'; -import { connect } from 'react-redux'; -import { createStructuredSelector } from 'reselect'; -import { logImEXEvent } from '../../firebase/firebase.analytics'; +} from "react-native"; +import { ProgressBar } from "react-native-paper"; +import Toast from "react-native-toast-message"; +import { connect } from "react-redux"; +import { createStructuredSelector } from "reselect"; +import { logImEXEvent } from "../../firebase/firebase.analytics"; import { selectCurrentCameraJobId, selectDeleteAfterUpload, -} from '../../redux/app/app.selectors'; -import * as Sentry from '@sentry/react-native'; +} from "../../redux/app/app.selectors"; +import * as Sentry from "@sentry/react-native"; -import { formatBytes } from '../../util/document-upload.utility'; -import { handleLocalUpload } from '../../util/local-document-upload.utility'; +import { formatBytes } from "../../util/document-upload.utility"; +import { handleLocalUpload } from "../../util/local-document-upload.utility"; const mapStateToProps = createStructuredSelector({ selectedCameraJobId: selectCurrentCameraJobId, @@ -54,7 +54,7 @@ export function UploadProgress({ async function handleOnSuccess({ duration, data }) { //If it's not in production, show a toast with the time. Toast.show({ - type: 'success', + type: "success", text1: ` Upload completed in ${duration}.`, // // text2: duration, @@ -64,7 +64,7 @@ export function UploadProgress({ await MediaLibrary.deleteAssetsAsync(data); const album = await MediaLibrary.createAlbumAsync( - 'ImEX Mobile Deleted', + "ImEX Mobile Deleted", data.pop(), false ); @@ -78,12 +78,12 @@ export function UploadProgress({ } const deleteResult = await MediaLibrary.deleteAlbumsAsync(album); } catch (error) { - console.log('Unable to delete picture.', error); + console.log("Unable to delete picture.", error); Sentry.Native.captureException(error); } } - logImEXEvent('imexmobile_successful_upload'); + logImEXEvent("imexmobile_successful_upload"); forceRerender(); setProgress({ ...progress, speed: 0, percent: 1, uploadInProgress: false }); } @@ -98,10 +98,10 @@ export function UploadProgress({ } function handleOnError({ assetid, error }) { - logImEXEvent('imexmobile_upload_documents_error'); + logImEXEvent("imexmobile_upload_documents_error"); Toast.show({ - type: 'error', - text1: 'Unable to upload documents.', + type: "error", + text1: "Unable to upload documents.", text2: error, autoHide: false, }); @@ -130,7 +130,7 @@ export function UploadProgress({ onSuccess: ({ duration }) => handleOnSuccess({ duration, data }), context: { jobid: - selectedCameraJobId !== 'temp' ? selectedCameraJobId : 'temporary', + selectedCameraJobId !== "temp" ? selectedCameraJobId : "temporary", }, }); }; @@ -138,41 +138,41 @@ export function UploadProgress({ return ( { - Alert.alert('Cancel?', 'Do you want to abort the upload?', [ + Alert.alert("Cancel?", "Do you want to abort the upload?", [ { - text: 'Yes', + text: "Yes", onPress: () => { setUploads(null); setProgress(null); }, }, - { text: 'No' }, + { text: "No" }, ]); }} > - + - {`${formatBytes( + {`${formatBytes( progress.speed )}/sec`} {`Avg. ${formatBytes( progress.loaded / ((new Date() - progress.start) / 1000) )}/sec`} {`Total Uploaded ${formatBytes(progress.loaded)}`} - {`Duration ${( + {`Duration ${( (new Date() - progress.start) / 1000 ).toFixed(1)} sec`} @@ -183,19 +183,19 @@ export function UploadProgress({ } const styles = StyleSheet.create({ modalContainer: { - display: 'flex', + display: "flex", flex: 1, - justifyContent: 'center', + justifyContent: "center", }, modal: { // flex: 1, - display: 'flex', + display: "flex", marginLeft: 20, marginRight: 20, - backgroundColor: 'white', + backgroundColor: "white", borderRadius: 20, padding: 18, - shadowColor: '#000', + shadowColor: "#000", shadowOffset: { width: 0, height: 2, diff --git a/util/document-upload.utility.js b/util/document-upload.utility.js index b8b2802..212fbfc 100644 --- a/util/document-upload.utility.js +++ b/util/document-upload.utility.js @@ -6,6 +6,8 @@ import { client } from "../graphql/client"; import { INSERT_NEW_DOCUMENT } from "../graphql/documents.queries"; import { axiosAuthInterceptorId } from "./CleanAxios"; import { splitClient } from "../components/screen-main/screen-main.component"; +import * as FileSystem from "expo-file-system"; + //Context: currentUserEmail, bodyshop, jobid, invoiceid //Required to prevent headers from getting set and rejected from Cloudinary. @@ -143,15 +145,57 @@ export const uploadToImgproxy = async ( }); try { - const s3UploadResponse = await cleanAxios.put( - preSignedUploadUrlToS3, - file, - options - ); - + // const s3UploadResponse = await cleanAxios.put( + // preSignedUploadUrlToS3, + // file, + // options + // ); + const task = FileSystem.createUploadTask( + preSignedUploadUrlToS3, + imageData.localUri, + { + httpMethod: "PUT", + //uploadType: FileSystem.FileSystemUploadType.MULTIPART, + //mimeType: fileType, + //headers: {}, + // parameters: {...OTHER PARAMS IN REQUEST}, + }, + (progressData) => { + const sent = progressData.totalBytesSent; + const total = progressData.totalBytesExpectedToSend; + const progress = sent / total; + if (onProgress) + onProgress({ + percent: Number(progress.toFixed(2)) * 100, + loaded: sent, + }); + + // onUpload(Number(progress.toFixed(2)) * 100); + } + ); + const request = await task.uploadAsync(); + if (request.status !== 200) { + if (onError) onError(request.status); + return { + success: false, + error: JSON.stringify(documentInsert.errors), + message: request.body, + status: request.status, + mediaId, + }; + } + + //debugger; } catch (error) { console.log("Error uploading to S3", error.message, error.stack); + if (onError) onError(error.message); + return { + success: false, + error: error.message, + stack: error.stack, + mediaId, + }; Sentry.Native.captureException(error); }