admin/imexmobile
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

workin upload

Browse Source
This commit is contained in:
Patrick Fic
2025-10-10 13:33:26 -07:00
parent 9e02d5a9b7
commit 9bab7080e6
2 changed files with 14 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

17
redux/photos/photos.sagas.js
View File

@@ -5,7 +5,7 @@ import { END, eventChannel } from 'redux-saga';
import { all, call, delay, fork, put, select, take, takeEvery, takeLatest } from "redux-saga/effects"; import { all, call, delay, fork, put, select, take, takeEvery, takeLatest } from "redux-saga/effects";
import env from "../../env"; import env from "../../env";
import { axiosAuthInterceptorId } from "../../util/CleanAxios"; import { axiosAuthInterceptorId } from "../../util/CleanAxios";
import { fetchImageFromUri, replaceAccents } from '../../util/uploadUtils'; import { fetchArrayBufferFromUri, fetchImageFromUri, replaceAccents } from '../../util/uploadUtils';
import { selectBodyshop } from "../user/user.selectors"; import { selectBodyshop } from "../user/user.selectors";
import { import {
mediaUploadComplete, mediaUploadComplete,
@@ -93,7 +93,8 @@ function* uploadSinglePhoto(photo, bodyshop, index, jobid) {
yield put(mediaUploadProgressOne({ ...photo, status: 'starting', progress: 0 })); yield put(mediaUploadProgressOne({ ...photo, status: 'starting', progress: 0 }));
const photoBlob = yield fetchImageFromUri(photo.uri); //has a name, and type. const photoBlob = yield fetchImageFromUri(photo.uri); //has a name, and type.
console.log("*** ~ uploadSinglePhoto ~ photoBlob.name.:", photoBlob.data.name); const photoArrayBuffer = yield fetchArrayBufferFromUri(photo.uri);
const extension = photoBlob.data?.name?.split('.').pop(); const extension = photoBlob.data?.name?.split('.').pop();
const key = `${bodyshop.id}/${jobid}/${replaceAccents( const key = `${bodyshop.id}/${jobid}/${replaceAccents(
@@ -101,9 +102,9 @@ function* uploadSinglePhoto(photo, bodyshop, index, jobid) {
).replace(/[^A-Z0-9]+/gi, "_")}-${new Date().getTime()}.${extension}` ).replace(/[^A-Z0-9]+/gi, "_")}-${new Date().getTime()}.${extension}`
if (bodyshop.uselocalmediaserver) { if (bodyshop.uselocalmediaserver) {
yield call(uploadToLocalMediaServer, photo, photoBlob, key, bodyshop, jobid); yield call(uploadToLocalMediaServer, photo, photoBlob, photoArrayBuffer, key, bodyshop, jobid);
} else { } else {
yield call(uploadToImageProxy, photo, photoBlob, key, bodyshop, jobid); yield call(uploadToImageProxy, photo, photoBlob, photoArrayBuffer, key, bodyshop, jobid);
} }
// yield put(mediaUploadSuccess({ photoId, photo })); // yield put(mediaUploadSuccess({ photoId, photo }));
@@ -151,7 +152,7 @@ function* uploadToLocalMediaServer(photo, key) {
} }
} }
function* uploadToImageProxy(photo, photoBlob, key, bodyshop, jobid) { function* uploadToImageProxy(photo, photoBlob, photoArrayBuffer, key, bodyshop, jobid) {
try { try {
yield put(mediaUploadProgressOne({ ...photo, status: 'uploading', })); yield put(mediaUploadProgressOne({ ...photo, status: 'uploading', }));
//Get the signed url allowing us to PUT to S3. //Get the signed url allowing us to PUT to S3.
@@ -170,13 +171,11 @@ function* uploadToImageProxy(photo, photoBlob, key, bodyshop, jobid) {
} }
const { presignedUrl: preSignedUploadUrlToS3, key: s3Key } = const { presignedUrl: preSignedUploadUrlToS3, key: s3Key } =
signedURLResponse.data.signedUrls[0]; signedURLResponse.data.signedUrls[0];
console.log("*** ~ uploadToImageProxy ~ s3Key:", s3Key);
console.log("*** ~ uploadToImageProxy ~ presignedUrl:", preSignedUploadUrlToS3);
// Create an eventChannel to bridge imperative upload progress events into the saga world // Create an eventChannel to bridge imperative upload progress events into the saga world
const uploadChannel = yield call(createAxiosUploadChannel, { const uploadChannel = yield call(createAxiosUploadChannel, {
url: preSignedUploadUrlToS3, url: preSignedUploadUrlToS3,
data: photoBlob, data: photoArrayBuffer,
method: 'put', method: 'put',
headers: { headers: {
'Content-Type': photoBlob.type, 'Content-Type': photoBlob.type,
@@ -192,6 +191,7 @@ function* uploadToImageProxy(photo, photoBlob, key, bodyshop, jobid) {
} else if (error) { } else if (error) {
throw error; throw error;
} else if (success) { } else if (success) {
yield put(mediaUploadProgressOne({ ...photo, progress: 100, status: 'completed' }));
break; break;
} }
} }
@@ -217,6 +217,7 @@ function createAxiosUploadChannel({ url, data, method = 'put', headers }) {
signal: controller.signal, signal: controller.signal,
// NOTE: cannot yield here, so we emit events and handle them in saga loop // NOTE: cannot yield here, so we emit events and handle them in saga loop
onUploadProgress: (e) => { onUploadProgress: (e) => {
console.log("Upload progress event:", e);
if (e && e.total) { if (e && e.total) {
emitter({ progress: e.loaded / e.total }); emitter({ progress: e.loaded / e.total });
} }

5
util/uploadUtils.js
View File

@@ -48,4 +48,9 @@ export async function fetchImageFromUri(uri) {
const response = await fetch(uri); const response = await fetch(uri);
const blob = await response.blob(); const blob = await response.blob();
return blob; return blob;
};
export async function fetchArrayBufferFromUri(uri) {
const response = await fetch(uri);
const arrayBuffer = await response.arrayBuffer();
return arrayBuffer;
}; };