preprocess groupphoto images

.gitignore

@@ -10,4 +10,4 @@ temp/*
 # ignore files in folder
 uploads/*
 # except
-!uploads/README.md
+!uploads/README.md

client/src/pages/GroupPhoto/GroupPhoto.js

@@ -2,6 +2,7 @@ import React, { useEffect, useState } from 'react'
 import Button from '../../components/Button'
 import Page from '../../components/Page'
 import { downloadFromS3 } from '../../utils/download'
+import { onWsEvent } from '../../websockets'
 import './GroupPhoto.css'
 
 const GroupPhoto = () => {
@@ -11,15 +12,12 @@ const GroupPhoto = () => {
 
   const createGroupPhoto = async () => {
     setIsGenerating(true)
-    const res = await fetch('/createGroupPhoto', {
+    fetch('/createGroupPhoto', {
       method: 'POST',
       headers: {
         'Content-Type': 'application/json',
       },
     })
-    const json = await res.json()
-    setFile(json)
-    setIsGenerating(false)
   }
 
   const getGroupPhoto = async () => {
@@ -36,6 +34,14 @@ const GroupPhoto = () => {
 
   useEffect(() => {
     getGroupPhoto()
+    onWsEvent('group-photo', (data) => {
+      if (data.status === 200) {
+        setFile(data.data)
+      } else {
+        console.log(data.message, data.error)
+      }
+      setIsGenerating(false)
+    })
   }, [])
 
   const header = <h1>Create Group Photo</h1>

client/src/websockets.js

@@ -0,0 +1,12 @@
+const HOST = window.location.origin.replace(/^http/, 'ws')
+
+if (process.env.NODE_ENV === 'development') HOST.replace('3000', '3001')
+
+export const ws = new WebSocket(HOST)
+
+export const onWsEvent = (eventId, callback) => {
+  ws.onmessage = (event) => {
+    const data = JSON.parse(event.data)
+    if (data.id === eventId) callback(data)
+  }
+}

package.json

@@ -17,14 +17,15 @@
   "license": "ISC",
   "dependencies": {
     "aws-sdk": "^2.729.0",
-    "axios": "^0.20.0",
     "concurrently": "^5.2.0",
     "dotenv": "^8.2.0",
     "express": "^4.17.1",
     "express-basic-auth": "^1.2.0",
     "fluent-ffmpeg": "^2.1.2",
     "multer": "^1.4.2",
-    "sharp": "^0.26.0"
+    "sharp": "^0.26.0",
+    "uuid": "^8.3.0",
+    "ws": "^7.3.1"
   },
   "devDependencies": {
     "babel-eslint": "^10.0.1",
@@ -52,5 +53,9 @@
       "eslint --fix",
       "prettier --write"
     ]
+  },
+  "optionalDependencies": {
+    "bufferutil": "^4.0.1",
+    "utf-8-validate": "^5.0.2"
   }
 }