Added Video support for document upload. IO-524

This commit is contained in:
Patrick Fic
2021-02-04 14:15:16 -08:00
parent dcd9cfc331
commit 6e33b5fd6b
5 changed files with 42 additions and 38 deletions

View File

@@ -23,30 +23,28 @@ function JobsDocumentsComponent({
console.log("value", value);
if (value.type.includes("image")) {
acc.images.push({
src: `${
value.type.startsWith("video")
? process.env.REACT_APP_CLOUDINARY_VIDEO_ENDPOINT
: process.env.REACT_APP_CLOUDINARY_IMAGE_ENDPOINT
}/${value.key}`,
thumbnail: `${
value.type.startsWith("video")
? process.env.REACT_APP_CLOUDINARY_VIDEO_ENDPOINT
: process.env.REACT_APP_CLOUDINARY_IMAGE_ENDPOINT
}/${process.env.REACT_APP_CLOUDINARY_THUMB_TRANSFORMATIONS}/${
value.key
}`,
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}`,
thumbnailHeight: 225,
thumbnailWidth: 225,
isSelected: false,
key: value.key,
id: value.id,
type: value.type,
tags: [{ value: value.type, title: value.type }],
});
} else {
acc.other.push({
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}`,
src: `${
value.type.startsWith("video")
? process.env.REACT_APP_CLOUDINARY_VIDEO_ENDPOINT
: process.env.REACT_APP_CLOUDINARY_IMAGE_ENDPOINT
}/q_auto/${value.key}`,
thumbnail: value.type.startsWith("video")
? `${process.env.REACT_APP_CLOUDINARY_VIDEO_ENDPOINT}/c_fill,f_png,h_250,w_250/${value.key}`
: `${process.env.REACT_APP_CLOUDINARY_IMAGE_ENDPOINT}/${process.env.REACT_APP_CLOUDINARY_THUMB_TRANSFORMATIONS}/${value.key}`,
tags: [
{ value: "PDF", title: t("documents.labels.doctype") },
{ value: value.type, title: value.type },
...(value.bill
? [
{
@@ -66,6 +64,7 @@ function JobsDocumentsComponent({
isSelected: false,
key: value.key,
id: value.id,
type: value.type,
});
}
@@ -91,6 +90,12 @@ function JobsDocumentsComponent({
/>
</Space>
</div>
<DocumentsUploadComponent
jobId={jobId}
billId={billId}
callbackAfterUpload={billsCallback || refetch}
tagsArray={["test"]}
></DocumentsUploadComponent>
<div style={{ marginTop: "2rem" }}>
<Card title={t("jobs.labels.documents-images")}>
<Gallery
@@ -112,12 +117,6 @@ function JobsDocumentsComponent({
});
}}
/>
<DocumentsUploadComponent
jobId={jobId}
billId={billId}
callbackAfterUpload={billsCallback || refetch}
tagsArray={["test"]}
></DocumentsUploadComponent>
</Card>
<Card title={t("jobs.labels.documents-other")}>
@@ -141,12 +140,6 @@ function JobsDocumentsComponent({
});
}}
/>
<DocumentsUploadComponent
jobId={jobId}
billId={billId}
callbackAfterUpload={billsCallback || refetch}
tagsArray={["test"]}
></DocumentsUploadComponent>
</Card>
</div>
</div>

View File

@@ -7,6 +7,7 @@ import { useTranslation } from "react-i18next";
import { logImEXEvent } from "../../firebase/firebase.utils";
import { DELETE_DOCUMENT } from "../../graphql/documents.queries";
import cleanAxios from "../../utils/CleanAxios";
import { DetermineFileType } from "../documents-upload/documents-upload.utility";
//Context: currentUserEmail, bodyshop, jobid, invoiceid
export default function JobsDocumentsDeleteButton({
@@ -20,6 +21,7 @@ export default function JobsDocumentsDeleteButton({
...galleryImages.other.filter((image) => image.isSelected),
];
const [loading, setLoading] = useState(false);
const handleDelete = () => {
logImEXEvent("job_documents_delete", { count: imagesToDelete.length });
setLoading(true);
@@ -45,7 +47,9 @@ export default function JobsDocumentsDeleteButton({
cleanAxios
.post(
`${process.env.REACT_APP_CLOUDINARY_ENDPOINT}/destroy`,
`${process.env.REACT_APP_CLOUDINARY_ENDPOINT}/${DetermineFileType(
image.type
)}/destroy`,
formData,
options
)