diff --git a/client/src/components/documents-upload/documents-upload.utility.js b/client/src/components/documents-upload/documents-upload.utility.js index a265ee592..1dea85d39 100644 --- a/client/src/components/documents-upload/documents-upload.utility.js +++ b/client/src/components/documents-upload/documents-upload.utility.js @@ -20,8 +20,10 @@ export const handleUpload = (ev, context) => { const { bodyshop, jobId } = context; let key = `${bodyshop.id}/${jobId}/${ev.file.name.replace(/\.[^/.]+$/, "")}`; + let extension = ev.file.name.split(".").pop(); uploadToCloudinary( key, + extension, ev.file.type, ev.file, onError, @@ -33,6 +35,7 @@ export const handleUpload = (ev, context) => { export const uploadToCloudinary = async ( key, + extension, fileType, file, onError, @@ -94,7 +97,7 @@ export const uploadToCloudinary = async ( formData.append("signature", signature); const cloudinaryUploadResponse = await cleanAxios.post( - `${process.env.REACT_APP_CLOUDINARY_ENDPOINT}/${DetermineFileType( + `${process.env.REACT_APP_CLOUDINARY_ENDPOINT_API}/${DetermineFileType( fileType )}/upload`, formData, @@ -129,6 +132,7 @@ export const uploadToCloudinary = async ( key: key, billid: billId, type: fileType, + extension: extension, }, ], }, @@ -164,6 +168,7 @@ export function DetermineFileType(filetype) { else if (filetype.startsWith("image")) return "image"; else if (filetype.startsWith("video")) return "video"; else if (filetype.startsWith("application/pdf")) return "image"; + else if (filetype.startsWith("application")) return "raw"; return "auto"; } diff --git a/client/src/components/jobs-documents-gallery/jobs-documents-gallery.component.jsx b/client/src/components/jobs-documents-gallery/jobs-documents-gallery.component.jsx index 39899b193..c0125f82e 100644 --- a/client/src/components/jobs-documents-gallery/jobs-documents-gallery.component.jsx +++ b/client/src/components/jobs-documents-gallery/jobs-documents-gallery.component.jsx @@ -1,12 +1,13 @@ +import { FileExcelFilled } from "@ant-design/icons"; import { Card, Space } from "antd"; import React, { useEffect, useState } from "react"; import Gallery from "react-grid-gallery"; import { useTranslation } from "react-i18next"; import DocumentsUploadComponent from "../documents-upload/documents-upload.component"; +import { DetermineFileType } from "../documents-upload/documents-upload.utility"; import JobsDocumentsDownloadButton from "./jobs-document-gallery.download.component"; import JobsDocumentsDeleteButton from "./jobs-documents-gallery.delete.component"; import JobsDocumentsGallerySelectAllComponent from "./jobs-documents-gallery.selectall.component"; - function JobsDocumentsComponent({ data, jobId, @@ -20,29 +21,47 @@ function JobsDocumentsComponent({ useEffect(() => { let documents = data.reduce( (acc, value) => { - console.log("value", value); - if (value.type.includes("image")) { + const fileType = DetermineFileType(value.type); + if (value.type.startsWith("image")) { acc.images.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: `${ + process.env.REACT_APP_CLOUDINARY_ENDPOINT + }/${DetermineFileType(value.type)}/upload/${value.key}`, + thumbnail: `${ + process.env.REACT_APP_CLOUDINARY_ENDPOINT + }/${DetermineFileType(value.type)}/upload/${ + process.env.REACT_APP_CLOUDINARY_THUMB_TRANSFORMATIONS + }/${value.key}`, thumbnailHeight: 225, thumbnailWidth: 225, isSelected: false, key: value.key, + extension: value.extension, id: value.id, type: value.type, tags: [{ value: value.type, title: value.type }], }); } else { + let thumb; + switch (fileType) { + case "video": + thumb = `${process.env.REACT_APP_CLOUDINARY_ENDPOINT}/${fileType}/upload/c_fill,f_png,h_250,w_250/${value.key}`; + break; + case "raw": + thumb = ""; + break; + default: + thumb = `${process.env.REACT_APP_CLOUDINARY_ENDPOINT}/${fileType}/upload/${process.env.REACT_APP_CLOUDINARY_THUMB_TRANSFORMATIONS}/${value.key}`; + break; + } + acc.other.push({ 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}`, + process.env.REACT_APP_CLOUDINARY_ENDPOINT + }/${fileType}/upload/${fileType === "video" ? "q_auto/" : ""}${ + value.key + }${fileType === "raw" ? `.${value.extension}` : ""}`, + thumbnail: thumb, tags: [ { value: value.type, title: value.type }, ...(value.bill @@ -62,6 +81,7 @@ function JobsDocumentsComponent({ thumbnailHeight: 225, thumbnailWidth: 225, isSelected: false, + extension: value.extension, key: value.key, id: value.id, type: value.type, @@ -124,6 +144,13 @@ function JobsDocumentsComponent({ images={galleryImages.other} backdropClosesModal={true} enableLightbox={false} + thumbnailStyle={() => { + return { + backgroundImage: , + height: "100%", + width: "100%", + }; + }} onClickThumbnail={(index) => { window.open( galleryImages.other[index].src, diff --git a/client/src/components/jobs-documents-gallery/jobs-documents-gallery.delete.component.jsx b/client/src/components/jobs-documents-gallery/jobs-documents-gallery.delete.component.jsx index 05679833b..074c0785d 100644 --- a/client/src/components/jobs-documents-gallery/jobs-documents-gallery.delete.component.jsx +++ b/client/src/components/jobs-documents-gallery/jobs-documents-gallery.delete.component.jsx @@ -47,9 +47,9 @@ export default function JobsDocumentsDeleteButton({ cleanAxios .post( - `${process.env.REACT_APP_CLOUDINARY_ENDPOINT}/${DetermineFileType( - image.type - )}/destroy`, + `${ + process.env.REACT_APP_CLOUDINARY_ENDPOINT_API + }/${DetermineFileType(image.type)}/destroy`, formData, options ) diff --git a/client/src/graphql/documents.queries.js b/client/src/graphql/documents.queries.js index 361eb11c6..dfd1c17d3 100644 --- a/client/src/graphql/documents.queries.js +++ b/client/src/graphql/documents.queries.js @@ -10,6 +10,7 @@ export const GET_DOCUMENTS_BY_JOB = gql` name key type + extension bill { id invoice_number diff --git a/hasura/migrations/1612478848106_alter_table_public_documents_add_column_extension/down.yaml b/hasura/migrations/1612478848106_alter_table_public_documents_add_column_extension/down.yaml new file mode 100644 index 000000000..e1f4dfe22 --- /dev/null +++ b/hasura/migrations/1612478848106_alter_table_public_documents_add_column_extension/down.yaml @@ -0,0 +1,5 @@ +- args: + cascade: false + read_only: false + sql: ALTER TABLE "public"."documents" DROP COLUMN "extension"; + type: run_sql diff --git a/hasura/migrations/1612478848106_alter_table_public_documents_add_column_extension/up.yaml b/hasura/migrations/1612478848106_alter_table_public_documents_add_column_extension/up.yaml new file mode 100644 index 000000000..9951035eb --- /dev/null +++ b/hasura/migrations/1612478848106_alter_table_public_documents_add_column_extension/up.yaml @@ -0,0 +1,5 @@ +- args: + cascade: false + read_only: false + sql: ALTER TABLE "public"."documents" ADD COLUMN "extension" text NULL; + type: run_sql diff --git a/hasura/migrations/1612478855295_update_permission_user_public_table_documents/down.yaml b/hasura/migrations/1612478855295_update_permission_user_public_table_documents/down.yaml new file mode 100644 index 000000000..af08a0df6 --- /dev/null +++ b/hasura/migrations/1612478855295_update_permission_user_public_table_documents/down.yaml @@ -0,0 +1,34 @@ +- args: + role: user + table: + name: documents + schema: public + type: drop_insert_permission +- args: + permission: + check: + job: + bodyshop: + associations: + _and: + - user: + authid: + _eq: X-Hasura-User-Id + - active: + _eq: true + columns: + - id + - created_at + - updated_at + - uploaded_by + - jobid + - name + - key + - billid + - type + set: {} + role: user + table: + name: documents + schema: public + type: create_insert_permission diff --git a/hasura/migrations/1612478855295_update_permission_user_public_table_documents/up.yaml b/hasura/migrations/1612478855295_update_permission_user_public_table_documents/up.yaml new file mode 100644 index 000000000..e7f9555ab --- /dev/null +++ b/hasura/migrations/1612478855295_update_permission_user_public_table_documents/up.yaml @@ -0,0 +1,35 @@ +- args: + role: user + table: + name: documents + schema: public + type: drop_insert_permission +- args: + permission: + check: + job: + bodyshop: + associations: + _and: + - user: + authid: + _eq: X-Hasura-User-Id + - active: + _eq: true + columns: + - billid + - created_at + - extension + - id + - jobid + - key + - name + - type + - updated_at + - uploaded_by + set: {} + role: user + table: + name: documents + schema: public + type: create_insert_permission diff --git a/hasura/migrations/1612478861357_update_permission_user_public_table_documents/down.yaml b/hasura/migrations/1612478861357_update_permission_user_public_table_documents/down.yaml new file mode 100644 index 000000000..bfe07f671 --- /dev/null +++ b/hasura/migrations/1612478861357_update_permission_user_public_table_documents/down.yaml @@ -0,0 +1,35 @@ +- args: + role: user + table: + name: documents + schema: public + type: drop_select_permission +- args: + permission: + allow_aggregations: false + columns: + - key + - name + - type + - uploaded_by + - created_at + - updated_at + - id + - billid + - jobid + computed_fields: [] + filter: + job: + bodyshop: + associations: + _and: + - user: + authid: + _eq: X-Hasura-User-Id + - active: + _eq: true + role: user + table: + name: documents + schema: public + type: create_select_permission diff --git a/hasura/migrations/1612478861357_update_permission_user_public_table_documents/up.yaml b/hasura/migrations/1612478861357_update_permission_user_public_table_documents/up.yaml new file mode 100644 index 000000000..791d121c3 --- /dev/null +++ b/hasura/migrations/1612478861357_update_permission_user_public_table_documents/up.yaml @@ -0,0 +1,36 @@ +- args: + role: user + table: + name: documents + schema: public + type: drop_select_permission +- args: + permission: + allow_aggregations: false + columns: + - billid + - created_at + - extension + - id + - jobid + - key + - name + - type + - updated_at + - uploaded_by + computed_fields: [] + filter: + job: + bodyshop: + associations: + _and: + - user: + authid: + _eq: X-Hasura-User-Id + - active: + _eq: true + role: user + table: + name: documents + schema: public + type: create_select_permission diff --git a/hasura/migrations/metadata.yaml b/hasura/migrations/metadata.yaml index 4d5209836..50cb592d2 100644 --- a/hasura/migrations/metadata.yaml +++ b/hasura/migrations/metadata.yaml @@ -1450,28 +1450,30 @@ tables: - active: _eq: true columns: - - id + - billid - created_at + - extension + - id + - jobid + - key + - name + - type - updated_at - uploaded_by - - jobid - - name - - key - - billid - - type select_permissions: - role: user permission: columns: + - billid + - created_at + - extension + - id + - jobid - key - name - type - - uploaded_by - - created_at - updated_at - - id - - billid - - jobid + - uploaded_by filter: job: bodyshop: