IO-3092 Add imgproxy uploads and update expo version.

util/document-upload.utility.js

@@ -1,11 +1,10 @@
+import * as Sentry from "@sentry/react-native";
 import axios from "axios";
+import * as MediaLibrary from "expo-media-library";
 import env from "../env";
 import { client } from "../graphql/client";
 import { INSERT_NEW_DOCUMENT } from "../graphql/documents.queries";
 import { axiosAuthInterceptorId } from "./CleanAxios";
-import * as MediaLibrary from "expo-media-library";
-import { gql } from "@apollo/client";
-import * as Sentry from '@sentry/react-native';
 
 //Context: currentUserEmail, bodyshop, jobid, invoiceid
 
@@ -13,7 +12,55 @@ import * as Sentry from '@sentry/react-native';
 var cleanAxios = axios.create();
 cleanAxios.interceptors.request.eject(axiosAuthInterceptorId);
 
-export const handleUpload = async (ev, context) => {
+export const handleUpload = async (ev, context, destination) => {
+  const { mediaId, onError, onSuccess, onProgress } = ev;
+  const { bodyshop, jobId } = context;
+
+  const imageData = await MediaLibrary.getAssetInfoAsync(mediaId);
+  const newFile = await (
+    await fetch(imageData.localUri || imageData.uri)
+  ).blob();
+  let extension = imageData.localUri.split(".").pop();
+
+  let key =
+    destination === "imgproxy"
+      ? `${bodyshop.id}/${jobId}/${replaceAccents(
+          imageData.filename || imageData.uri.split("/").pop()
+        ).replace(/[^A-Z0-9]+/gi, "_")}-${new Date().getTime()}.${extension}`
+      : `${bodyshop.id}/${jobId}/${(
+          imageData.filename || imageData.uri.split("/").pop()
+        ).replace(/\.[^/.]+$/, "")}-${new Date().getTime()}`;
+
+  const res =
+    destination === "imgproxy"
+      ? await uploadToImgproxy(
+          key,
+          mediaId,
+          imageData,
+          extension,
+          newFile.type, //Filetype
+          newFile, //File
+          onError,
+          onSuccess,
+          onProgress,
+          context
+        )
+      : await uploadToCloudinary(
+          key,
+          mediaId,
+          imageData,
+          extension,
+          newFile.type, //Filetype
+          newFile, //File
+          onError,
+          onSuccess,
+          onProgress,
+          context
+        );
+  return res;
+};
+
+export const handleUploadImgproxy = async (ev, context) => {
   const { mediaId, onError, onSuccess, onProgress } = ev;
   const { bodyshop, jobId } = context;
 
@@ -26,7 +73,7 @@ export const handleUpload = async (ev, context) => {
     imageData.filename || imageData.uri.split("/").pop()
   ).replace(/\.[^/.]+$/, "")}-${new Date().getTime()}`;
 
-  const res = await uploadToCloudinary(
+  const res = await uploadToImgproxy(
     key,
     mediaId,
     imageData,
@@ -41,6 +88,110 @@ export const handleUpload = async (ev, context) => {
   return res;
 };
 
+export const uploadToImgproxy = async (
+  key,
+  mediaId,
+  imageData,
+  extension,
+  fileType,
+  file,
+  onError,
+  onSuccess,
+  onProgress,
+  context
+) => {
+  const { bodyshop, jobId, uploaded_by } = context;
+
+  //Get the signed url allowing us to PUT to S3.
+  const signedURLResponse = await axios.post(
+    `${env.API_URL}/media/imgproxy/sign`,
+    {
+      filenames: [key],
+      bodyshopid: bodyshop.id,
+      jobid: jobId,
+    }
+  );
+
+  if (signedURLResponse.status !== 200) {
+    console.log("Error Getting Signed URL", signedURLResponse.statusText);
+    if (onError) onError(signedURLResponse.statusText);
+    return { success: false, error: signedURLResponse.statusText };
+  }
+  const { presignedUrl: preSignedUploadUrlToS3, key: s3Key } =
+    signedURLResponse.data.signedUrls[0];
+
+  var options = {
+    headers: {
+      "Content-Type": fileType,
+      "Content-Length": file.size,
+    },
+    transformRequest: [(data) => data], //Dave had this magical solution because Axios makes no sense.
+    onUploadProgress: (e) => {
+      if (onProgress) onProgress({ percent: (e.loaded / e.total) * 100 });
+    },
+  };
+
+  console.log("Uploading to S3", key, preSignedUploadUrlToS3, file, options);
+  const formData = new FormData();
+  formData.append("file", {
+    uri: imageData.localUri,
+    type: fileType,
+    name: file.data.name,
+  });
+
+  try {
+    const s3UploadResponse = await cleanAxios.put(
+      preSignedUploadUrlToS3,
+      file,
+      options
+    );
+    debugger;
+    console.log(s3UploadResponse);
+  } catch (error) {
+    console.log("Error uploading to S3", error.message, error.stack);
+    Sentry.Native.captureException(error);
+  }
+
+  const documentInsert = await client.mutate({
+    mutation: INSERT_NEW_DOCUMENT,
+    variables: {
+      docInput: [
+        {
+          ...(jobId ? { jobid: jobId } : {}),
+          uploaded_by: uploaded_by,
+          key: s3Key,
+          type: fileType,
+          extension: extension,
+          bodyshopid: bodyshop.id,
+          size: file.size,
+          ...(imageData.creationTime
+            ? { takenat: new Date(imageData.creationTime) }
+            : {}),
+        },
+      ],
+    },
+  });
+
+  if (!documentInsert.errors) {
+    if (onSuccess)
+      onSuccess({
+        uid: documentInsert.data.insert_documents.returning[0].id,
+        name: documentInsert.data.insert_documents.returning[0].name,
+        status: "done",
+        key: documentInsert.data.insert_documents.returning[0].key,
+      });
+  } else {
+    if (onError) onError(JSON.stringify(documentInsert.errors));
+    return {
+      success: false,
+      error: JSON.stringify(documentInsert.errors),
+      mediaId,
+    };
+  }
+
+  return { success: true, mediaId };
+};
+
 export const uploadToCloudinary = async (
   key,
   mediaId,
@@ -198,3 +349,32 @@ export function formatBytes(a, b = 2) {
     ["Bytes", "KB", "MB", "GB", "TB", "PB", "EB", "ZB", "YB"][d]
   );
 }
+
+function replaceAccents(str) {
+  // Verifies if the String has accents and replace them
+  if (str.search(/[\xC0-\xFF]/g) > -1) {
+    str = str
+      .replace(/[\xC0-\xC5]/g, "A")
+      .replace(/[\xC6]/g, "AE")
+      .replace(/[\xC7]/g, "C")
+      .replace(/[\xC8-\xCB]/g, "E")
+      .replace(/[\xCC-\xCF]/g, "I")
+      .replace(/[\xD0]/g, "D")
+      .replace(/[\xD1]/g, "N")
+      .replace(/[\xD2-\xD6\xD8]/g, "O")
+      .replace(/[\xD9-\xDC]/g, "U")
+      .replace(/[\xDD]/g, "Y")
+      .replace(/[\xDE]/g, "P")
+      .replace(/[\xE0-\xE5]/g, "a")
+      .replace(/[\xE6]/g, "ae")
+      .replace(/[\xE7]/g, "c")
+      .replace(/[\xE8-\xEB]/g, "e")
+      .replace(/[\xEC-\xEF]/g, "i")
+      .replace(/[\xF1]/g, "n")
+      .replace(/[\xF2-\xF6\xF8]/g, "o")
+      .replace(/[\xF9-\xFC]/g, "u")
+      .replace(/[\xFE]/g, "p")
+      .replace(/[\xFD\xFF]/g, "y");
+  }
+  return str;
+}