diff --git a/client/package.json b/client/package.json index aa7e414ee..62bb32fc2 100644 --- a/client/package.json +++ b/client/package.json @@ -21,6 +21,7 @@ "graphql": "^14.6.0", "i18next": "^19.3.4", "node-sass": "^4.13.1", + "pica": "^5.1.0", "query-string": "^6.11.1", "react": "^16.13.1", "react-apollo": "^3.1.3", diff --git a/client/src/components/documents-upload/documents-upload.container.jsx b/client/src/components/documents-upload/documents-upload.container.jsx index a6bc966af..4b234b853 100644 --- a/client/src/components/documents-upload/documents-upload.container.jsx +++ b/client/src/components/documents-upload/documents-upload.container.jsx @@ -43,9 +43,9 @@ export function DocumentsUploadContainer({ } else { Resizer.imageFileResizer( ev.file, - 3000, - 3000, - "PNG", + 2500, + 2500, + "JPEG", 75, 0, (uri) => { @@ -57,6 +57,7 @@ export function DocumentsUploadContainer({ ); } }; + const uploadToS3 = ( fileName, fileType, @@ -65,84 +66,185 @@ export function DocumentsUploadContainer({ onSuccess, onProgress ) => { + let timestamp = Math.floor(Date.now() / 1000); + console.log("timestamp", timestamp); + //Actually upload to cloudinary + axios - .post("/sign_s3", { - fileName, - fileType, + .post("/media/upload", { + eager: "w_200,h_200,c_fill", + public_id: timestamp, + timestamp: timestamp, }) .then((response) => { - var returnData = response.data.data.returnData; - var signedRequest = returnData.signedRequest; - var url = returnData.url; - // setState({ ...state, url: url }); - // Put the fileType in the headers for the upload + var signature = response.data; + console.log("signature", signature); var options = { - headers: { - "Content-Type": fileType, - }, + headers: { "X-Requested-With": "XMLHttpRequest" }, onUploadProgress: (e) => { onProgress({ percent: (e.loaded / e.total) * 100 }); }, }; + const formData = new FormData(); + formData.append("file", file); + formData.append("eager", "w_200,h_200,c_fill"); + formData.append("api_key", "473322739956866"); + formData.append("public_id", timestamp); + formData.append("timestamp", timestamp); + formData.append("signature", signature); axios - .put(signedRequest, file, options) + .post( + "https://api.cloudinary.com/v1_1/bodyshop/image/upload", + formData, + options + ) .then((response) => { - insertNewDocument({ - variables: { - docInput: [ - { - jobid: jobId, - uploaded_by: currentUser.email, - url, - thumb_url: - fileType === "application/pdf" - ? "application/pdf" - : generateCdnThumb(fileName), - key: fileName, - invoiceid: invoiceId, - }, - ], - }, - }).then((r) => { - onSuccess({ - uid: r.data.insert_documents.returning[0].id, - url: r.data.insert_documents.returning[0].thumb_url, - name: r.data.insert_documents.returning[0].name, - status: "done", - full_url: r.data.insert_documents.returning[0].url, - key: r.data.insert_documents.returning[0].key, - }); - notification["success"]({ - message: t("documents.successes.insert"), - }); - if (callbackAfterUpload) { - callbackAfterUpload(); - } - console.log("ref", UploadRef.current.state.fileList); - if (onChange) { - //Used in a form. - onChange(UploadRef.current.state.fileList); - } - }); + console.log("response", response); + // insertNewDocument({ + // variables: { + // docInput: [ + // { + // jobid: jobId, + // uploaded_by: currentUser.email, + // url, + // thumb_url: + // fileType === "application/pdf" + // ? "application/pdf" + // : generateCdnThumb(fileName), + // key: fileName, + // invoiceid: invoiceId, + // }, + // ], + // }, + // }).then((r) => { + // onSuccess({ + // uid: r.data.insert_documents.returning[0].id, + // url: r.data.insert_documents.returning[0].thumb_url, + // name: r.data.insert_documents.returning[0].name, + // status: "done", + // full_url: r.data.insert_documents.returning[0].url, + // key: r.data.insert_documents.returning[0].key, + // }); + // notification["success"]({ + // message: t("documents.successes.insert"), + // }); + // if (callbackAfterUpload) { + // callbackAfterUpload(); + // } + // console.log("ref", UploadRef.current.state.fileList); + // if (onChange) { + // //Used in a form. + // onChange(UploadRef.current.state.fileList); + // } + // }); }) - .catch((error) => { - onError(error); - notification["error"]({ - message: t("documents.errors.insert", { - message: JSON.stringify(error), - }), - }); - }); + .catch((error) => console.log("error", error)); + // .catch((error) => { + // onError(error); + // notification["error"]({ + // message: t("documents.errors.insert", { + // message: JSON.stringify(error), + // }), + // }); + // }); }) .catch((error) => { - notification["error"]({ - message: t("documents.errors.getpresignurl", { - message: JSON.stringify(error), - }), - }); + console.log("error", error); + // notification["error"]({ + // message: t("documents.errors.getpresignurl", { + // message: JSON.stringify(error), + // }), + // }); }); }; + + // const uploadToS3 = ( + // fileName, + // fileType, + // file, + // onError, + // onSuccess, + // onProgress + // ) => { + // axios + // .post("/sign_s3", { + // fileName, + // fileType, + // }) + // .then((response) => { + // var returnData = response.data.data.returnData; + // var signedRequest = returnData.signedRequest; + // var url = returnData.url; + // // setState({ ...state, url: url }); + // // Put the fileType in the headers for the upload + // var options = { + // headers: { + // "Content-Type": fileType, + // }, + // onUploadProgress: (e) => { + // onProgress({ percent: (e.loaded / e.total) * 100 }); + // }, + // }; + + // axios + // .put(signedRequest, file, options) + // .then((response) => { + // insertNewDocument({ + // variables: { + // docInput: [ + // { + // jobid: jobId, + // uploaded_by: currentUser.email, + // url, + // thumb_url: + // fileType === "application/pdf" + // ? "application/pdf" + // : generateCdnThumb(fileName), + // key: fileName, + // invoiceid: invoiceId, + // }, + // ], + // }, + // }).then((r) => { + // onSuccess({ + // uid: r.data.insert_documents.returning[0].id, + // url: r.data.insert_documents.returning[0].thumb_url, + // name: r.data.insert_documents.returning[0].name, + // status: "done", + // full_url: r.data.insert_documents.returning[0].url, + // key: r.data.insert_documents.returning[0].key, + // }); + // notification["success"]({ + // message: t("documents.successes.insert"), + // }); + // if (callbackAfterUpload) { + // callbackAfterUpload(); + // } + // console.log("ref", UploadRef.current.state.fileList); + // if (onChange) { + // //Used in a form. + // onChange(UploadRef.current.state.fileList); + // } + // }); + // }) + // .catch((error) => { + // onError(error); + // notification["error"]({ + // message: t("documents.errors.insert", { + // message: JSON.stringify(error), + // }), + // }); + // }); + // }) + // .catch((error) => { + // notification["error"]({ + // message: t("documents.errors.getpresignurl", { + // message: JSON.stringify(error), + // }), + // }); + // }); + // }; return ( { setgalleryImages( data - .filter(item => item.thumb_url !== "application/pdf") + .filter((item) => item.thumb_url !== "application/pdf") .reduce((acc, value) => { acc.push({ src: value.url, thumbnail: value.thumb_url, thumbnailHeight: 150, thumbnailWidth: 150, - isSelected: false + isSelected: false, }); return acc; }, []) @@ -33,14 +33,14 @@ function JobsDocumentsComponent({ data, jobId, refetch }) { useEffect(() => { setPdfDocuments( data - .filter(item => item.thumb_url === "application/pdf") + .filter((item) => item.thumb_url === "application/pdf") .reduce((acc, value) => { acc.push({ src: value.url, thumbnail: value.thumb_url, thumbnailHeight: 150, thumbnailWidth: 150, - isSelected: false + isSelected: false, }); return acc; }, []) @@ -50,17 +50,6 @@ function JobsDocumentsComponent({ data, jobId, refetch }) { return (
- diff --git a/client/yarn.lock b/client/yarn.lock index 513c31565..8f51cc99d 100644 --- a/client/yarn.lock +++ b/client/yarn.lock @@ -6346,6 +6346,11 @@ globule@^1.0.0: lodash "~4.17.12" minimatch "~3.0.2" +glur@^1.1.2: + version "1.1.2" + resolved "https://registry.yarnpkg.com/glur/-/glur-1.1.2.tgz#f20ea36db103bfc292343921f1f91e83c3467689" + integrity sha1-8g6jbbEDv8KSNDkh8fkeg8NGdok= + graceful-fs@^4.1.11, graceful-fs@^4.1.15, graceful-fs@^4.1.2, graceful-fs@^4.1.6, graceful-fs@^4.2.0, graceful-fs@^4.2.2: version "4.2.3" resolved "https://registry.yarnpkg.com/graceful-fs/-/graceful-fs-4.2.3.tgz#4a12ff1b60376ef09862c2093edd908328be8423" @@ -8734,6 +8739,14 @@ multicast-dns@^6.0.1: dns-packet "^1.3.1" thunky "^1.0.2" +multimath@^2.0.0: + version "2.0.0" + resolved "https://registry.yarnpkg.com/multimath/-/multimath-2.0.0.tgz#0d37acf67c328f30e3d8c6b0d3209e6082710302" + integrity sha512-toRx66cAMJ+Ccz7pMIg38xSIrtnbozk0dchXezwQDMgQmbGpfxjtv68H+L00iFL8hxDaVjrmwAFSb3I6bg8Q2g== + dependencies: + glur "^1.1.2" + object-assign "^4.1.1" + mute-stream@0.0.8: version "0.0.8" resolved "https://registry.yarnpkg.com/mute-stream/-/mute-stream-0.0.8.tgz#1630c42b2251ff81e2a283de96a5497ea92e5e0d" @@ -9642,6 +9655,16 @@ performance-now@^2.1.0: resolved "https://registry.yarnpkg.com/performance-now/-/performance-now-2.1.0.tgz#6309f4e0e5fa913ec1c69307ae364b4b377c9e7b" integrity sha1-Ywn04OX6kT7BxpMHrjZLSzd8nns= +pica@^5.1.0: + version "5.1.0" + resolved "https://registry.yarnpkg.com/pica/-/pica-5.1.0.tgz#042d58730f32f3f014eb099e7d204474f7d14e49" + integrity sha512-1sr5HOypUfWT+oP/PXEZaF+kOBxhr+iMo4MEBSTNIHSjF/aGOCIWcjHjKTa0FKZ+BsPx5LmxYuNf4FoCckI3lQ== + dependencies: + inherits "^2.0.3" + multimath "^2.0.0" + object-assign "^4.1.1" + webworkify "^1.5.0" + picomatch@^2.0.4, picomatch@^2.0.7: version "2.2.1" resolved "https://registry.yarnpkg.com/picomatch/-/picomatch-2.2.1.tgz#21bac888b6ed8601f831ce7816e335bc779f0a4a" @@ -13800,6 +13823,11 @@ websocket-extensions@>=0.1.1: resolved "https://registry.yarnpkg.com/websocket-extensions/-/websocket-extensions-0.1.3.tgz#5d2ff22977003ec687a4b87073dfbbac146ccf29" integrity sha512-nqHUnMXmBzT0w570r2JpJxfiSD1IzoI+HGVdd3aZ0yNi3ngvQ4jv1dtHt5VGxfI2yj5yqImPhOK4vmIh2xMbGg== +webworkify@^1.5.0: + version "1.5.0" + resolved "https://registry.yarnpkg.com/webworkify/-/webworkify-1.5.0.tgz#734ad87a774de6ebdd546e1d3e027da5b8f4a42c" + integrity sha512-AMcUeyXAhbACL8S2hqqdqOLqvJ8ylmIbNwUIqQujRSouf4+eUFaXbG6F1Rbu+srlJMmxQWsiU7mOJi0nMBfM1g== + whatwg-encoding@^1.0.1, whatwg-encoding@^1.0.3, whatwg-encoding@^1.0.5: version "1.0.5" resolved "https://registry.yarnpkg.com/whatwg-encoding/-/whatwg-encoding-1.0.5.tgz#5abacf777c32166a51d085d6b4f3e7d27113ddb0" diff --git a/download-images.js b/download-images.js deleted file mode 100644 index b6600dcd0..000000000 --- a/download-images.js +++ /dev/null @@ -1,24 +0,0 @@ -//var JSZip = require("jszip"); -const axios = require("axios"); // to get the images -require("dotenv").config(); - -module.exports.downloadImages = async function(req, res) { - if (process.env.NODE_ENV !== "production") { - console.log("[IMAGES] Incoming Images to Download", req.body); - } - // const zip = new JSZip(); - // //res.json({ success: true }); - // req.body.images.forEach(i => { - // axios.get(i).then(r => zip.file(r)); - // // const buffer = await response.buffer(); - // // zip.file(file, buffer); - // }); - // // // Set the name of the zip file in the download - // res.setHeader("Content-Type", "application/zip"); - - // zip.generateAsync({ type: "nodebuffer" }).then( - // function(content) { - // res.send(content); - // }.bind(res) - // ); -}; diff --git a/package.json b/package.json index dfd82a874..b0a27e334 100644 --- a/package.json +++ b/package.json @@ -19,6 +19,7 @@ "apollo-cache-persist": "^0.1.1", "aws-sdk": "^2.630.0", "body-parser": "^1.18.3", + "cloudinary": "^1.21.0", "compression": "^1.7.4", "cors": "2.8.5", "dotenv": "8.2.0", diff --git a/server.js b/server.js index d85d643d0..bec304466 100644 --- a/server.js +++ b/server.js @@ -11,8 +11,8 @@ const https = require("https"); const fs = require("fs"); const app = express(); -//const port = process.env.PORT || 5000; -const port = 5000; +const port = process.env.PORT || 5000; +//const port = 5000; app.use(compression()); app.use(bodyParser.json()); @@ -20,18 +20,20 @@ app.use(bodyParser.urlencoded({ extended: true })); //app.use(enforce.HTTPS({ trustProtoHeader: true })); app.use(cors()); -var s3upload = require("./s3upload"); -app.post("/sign_s3", s3upload.sign_s3); -app.get("/sign_s3", s3upload.get_s3); -app.post("/delete_s3", s3upload.delete_s3); - +//Email Based Paths. var sendEmail = require("./sendemail.js"); app.post("/sendemail", sendEmail.sendEmail); -app.get("/test", function(req, res) { +//Test route to ensure Express is responding. +app.get("/test", function (req, res) { res.json({ success: true }); }); +//Cloudinary Media Paths +var media = require("./server/media/media"); +app.post("/media/upload", media.createSignedUploadURL); + +//SMS/Twilio Paths var smsReceive = require("./server/sms/receive"); app.post( "/sms/receive", @@ -47,12 +49,11 @@ app.post( smsStatus.status ); -var downloadImages = require("./download-images"); -app.get("/downloadImages", downloadImages.downloadImages); - +//Handlebars Paths for Email/Report Rendering var renderHandlebars = require("./server/render/renderHandlebars"); app.post("/render", renderHandlebars.render); +//Serve React App if in Production if (process.env.NODE_ENV === "production") { app.use(express.static(path.join(__dirname, "client/build"))); @@ -60,13 +61,13 @@ if (process.env.NODE_ENV === "production") { res.sendFile(path.resolve(__dirname, "..", "build", "service-worker.js")); }); - app.get("*", function(req, res) { + app.get("*", function (req, res) { res.sendFile(path.join(__dirname, "client/build", "index.html")); }); } if (process.env.NODE_ENV === "production") { - app.listen(port, error => { + app.listen(port, (error) => { if (error) throw error; console.log("[PRODUCTION] Server running on port " + port); }); @@ -76,11 +77,11 @@ if (process.env.NODE_ENV === "production") { { key: fs.readFileSync("./key.pem"), cert: fs.readFileSync("./cert.pem"), - passphrase: "Wl0d8k@!" + passphrase: "Wl0d8k@!", }, app ) - .listen(port, error => { + .listen(port, (error) => { if (error) throw error; console.log("[DEV/STAGING] Mock HTTPS Server running on port " + port); }); diff --git a/server/media/media.js b/server/media/media.js new file mode 100644 index 000000000..e242c32f2 --- /dev/null +++ b/server/media/media.js @@ -0,0 +1,19 @@ +require("dotenv").config(); + +var cloudinary = require("cloudinary").v2; +cloudinary.config(process.env.CLOUDINARY_URL); + +exports.createSignedUploadURL = (req, res) => { + console.log("Requrest to create signed upload URL for Cloudinary.", req.body); + + console.log( + "cloudinary.config.api_secret", + process.env.CLOUDINARY_API_SECRET + ); + res.send( + cloudinary.utils.api_sign_request( + req.body, + process.env.CLOUDINARY_API_SECRET + ) + ); +}; diff --git a/yarn.lock b/yarn.lock index fe454a5ba..def2a309b 100644 --- a/yarn.lock +++ b/yarn.lock @@ -835,6 +835,14 @@ clone@^1.0.2: resolved "https://registry.yarnpkg.com/clone/-/clone-1.0.4.tgz#da309cc263df15994c688ca902179ca3c7cd7c7e" integrity sha1-2jCcwmPfFZlMaIypAheco8fNfH4= +cloudinary@^1.21.0: + version "1.21.0" + resolved "https://registry.yarnpkg.com/cloudinary/-/cloudinary-1.21.0.tgz#9c30935190f49f2e9a0e26a16cd8ade580f675cc" + integrity sha512-am8wpHbHl8bcpy9oGSlWrpWLNQ9szkW/jmhcJdEpMjaL23BYt05V1frWyrXDlo8Jt7aCo5NE6EO0CM9Zaynd5g== + dependencies: + lodash "^4.17.11" + q "^1.5.1" + color-convert@^1.9.0: version "1.9.3" resolved "https://registry.yarnpkg.com/color-convert/-/color-convert-1.9.3.tgz#bb71850690e1f136567de629d2d5471deda4c1e8" @@ -3421,6 +3429,11 @@ q@2.0.x: pop-iterate "^1.0.1" weak-map "^1.0.5" +q@^1.5.1: + version "1.5.1" + resolved "https://registry.yarnpkg.com/q/-/q-1.5.1.tgz#7e32f75b41381291d04611f1bf14109ac00651d7" + integrity sha1-fjL3W0E4EpHQRhHxvxQQmsAGUdc= + qs@6.7.0: version "6.7.0" resolved "https://registry.yarnpkg.com/qs/-/qs-6.7.0.tgz#41dc1a015e3d581f1621776be31afb2876a9b1bc"