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

Added transformation on cloudinary side BOD-420

Browse Source
This commit is contained in:
Patrick Fic
2020-10-01 11:42:40 -07:00
parent 88951da11d
commit e2c3d7f4de
4 changed files with 20 additions and 22 deletions
Download Patch File Download Diff File Expand all files Collapse all files

32
client/src/components/documents-upload/documents-upload.utility.js
View File

@@ -1,13 +1,12 @@
import { notification } from "antd";
import axios from "axios";
import Resizer from "react-image-file-resizer";
import { client } from "../../App/App.container";
import { INSERT_NEW_DOCUMENT } from "../../graphql/documents.queries";
import i18n from "i18next";
import { axiosAuthInterceptorId, client } from "../../App/App.container";
import { logImEXEvent } from "../../firebase/firebase.utils";
import { axiosAuthInterceptorId } from "../../App/App.container";
import { INSERT_NEW_DOCUMENT } from "../../graphql/documents.queries";
//Context: currentUserEmail, bodyshop, jobid, invoiceid
//Required to prevent headers from getting set and rejected from Cloudinary.
var cleanAxios = axios.create();
cleanAxios.interceptors.request.eject(axiosAuthInterceptorId);
@@ -21,7 +20,7 @@ export const handleUpload = (ev, context) => {
//If PDF, upload directly.
//If JPEG, resize and upload.
//TODO If this is just an invoice job? Where to put it?
let key = `${bodyshop.id}/${jobId}/${ev.file.name}`;
let key = `${bodyshop.id}/${jobId}/${ev.file.name.replace(/\.[^/.]+$/, "")}`;
uploadToCloudinary(
key,
ev.file.type,
@@ -69,7 +68,7 @@ export const handleUpload = (ev, context) => {
};
export const uploadToCloudinary = async (
fileName,
key,
fileType,
file,
onError,
@@ -81,7 +80,7 @@ export const uploadToCloudinary = async (
//Set variables for getting the signed URL.
let timestamp = Math.floor(Date.now() / 1000);
let public_id = fileName;
let public_id = key;
let tags = `${bodyshop.textid},${
tagsArray ? tagsArray.map((tag) => `${tag},`) : ""
}`;
@@ -90,10 +89,11 @@ export const uploadToCloudinary = async (
//Get the signed url.
const signedURLResponse = await axios.post("/media/sign", {
eager: eager,
// eager: eager,
public_id: public_id,
tags: tags,
timestamp: timestamp,
upload_preset: "incoming_upload",
});
if (signedURLResponse.status !== 200) {
@@ -117,7 +117,15 @@ export const uploadToCloudinary = async (
};
const formData = new FormData();
formData.append("file", file);
formData.append("eager", eager);
//formData.append("eager", eager);
// if (fileType.includes("image")) {
console.log("Applying lower quality transforms.");
formData.append("upload_preset", "incoming_upload");
// formData.append("quality", "auto");
// formData.append("width", "500");
// formData.append("height", "500");
// formData.append("crop", "limit");
// }
formData.append("api_key", process.env.REACT_APP_CLOUDINARY_API_KEY);
formData.append("public_id", public_id);
formData.append("tags", tags);
@@ -156,7 +164,7 @@ export const uploadToCloudinary = async (
{
jobid: jobId,
uploaded_by: uploaded_by,
key: fileName,
key: key,
billid: billId,
type: fileType,
},
@@ -186,8 +194,4 @@ export const uploadToCloudinary = async (
});
return;
}
// if (onChange) {
// //Used in a form.
// onChange(UploadRef.current.state.fileList);
// }
};

4
client/src/components/jobs-documents-gallery/jobs-documents-gallery.component.jsx
View File

@@ -18,8 +18,8 @@ function JobsDocumentsComponent({
setgalleryImages(
data.reduce((acc, value) => {
acc.push({
src: `${process.env.REACT_APP_CLOUDINARY_IMAGE_ENDPOINT}/${value.key}.jpg`,
thumbnail: `${process.env.REACT_APP_CLOUDINARY_IMAGE_ENDPOINT}/${process.env.REACT_APP_CLOUDINARY_THUMB_TRANSFORMATIONS}/${value.key}.jpg`,
src: `${process.env.REACT_APP_CLOUDINARY_IMAGE_ENDPOINT}/${value.key}`,
thumbnail: `${process.env.REACT_APP_CLOUDINARY_IMAGE_ENDPOINT}/${process.env.REACT_APP_CLOUDINARY_THUMB_TRANSFORMATIONS}/${value.key}`,
tags: value.type.includes("pdf")
? [{ value: "PDF", title: "PDF" }]
: [],