Image retrieval from server

client/src/app/components/molecules/PrincipalContent/ImageContainer/ImageContainer.js

@@ -1,29 +1,33 @@
 import React from 'react';
 import PropTypes from 'prop-types';
+import {connect} from 'react-redux'
+import {createGetSelector} from 'reselect-immutable-helpers'
+import {getImages} from './../../../../pages/Home/selectors'
 import ImageCard from './Image'
 import Image from './../../../../models/image.model'
 
 class ImageContainer extends React.Component {
 
   render() {
-    const images = [
-      new Image('dragonfly1', '/images/GUD_1.JPG', 'Guddu 1'),
-      new Image('dragonfly2', '/images/GUD_2.JPG', 'sampleDesc2'),
-      new Image('dragonfly3', '/images/GUD_3.JPG', 'sampleDesc3'),
-      new Image('dragonfly4', '/images/GUD_4.JPG', 'sampleDesc4'),
-      new Image('dragonfly1', '/images/GUD_5.JPG', 'sampleDesc1'),
-      new Image('dragonfly2', '/images/GUD_6.JPG', 'sampleDesc2'),
-      new Image('dragonfly3', '/images/GUD_7.JPG', 'sampleDesc3'),
-      new Image('dragonfly4', '/images/GUD_8.JPG', 'sampleDesc4'),
-      new Image('dragonfly1', '/images/GUD_9.JPG', 'sampleDesc1'),
-      new Image('dragonfly2', '/images/GUD_10.JPG', 'sampleDesc2'),
-      new Image('dragonfly3', '/images/GUD_11.JPG', 'sampleDesc3'),
-      new Image('dragonfly4', '/images/GUD_12.JPG', 'sampleDesc4'),
-      new Image('dragonfly1', '/images/GUD_4.JPG', 'sampleDesc1'),
-      new Image('dragonfly2', '/images/GUD_3.JPG', 'sampleDesc2'),
-      new Image('dragonfly3', '/images/GUD_2.JPG', 'sampleDesc3'),
-      new Image('dragonfly4', '/images/GUD_1.JPG', 'sampleDesc4')
-    ]
+    // const images = [
+    //   new Image('dragonfly1', '/images/GUD_1.JPG', 'Guddu 1'),
+    //   new Image('dragonfly2', '/images/GUD_2.JPG', 'sampleDesc2'),
+    //   new Image('dragonfly3', '/images/GUD_3.JPG', 'sampleDesc3'),
+    //   new Image('dragonfly4', '/images/GUD_4.JPG', 'sampleDesc4'),
+    //   new Image('dragonfly1', '/images/GUD_5.JPG', 'sampleDesc1'),
+    //   new Image('dragonfly2', '/images/GUD_6.JPG', 'sampleDesc2'),
+    //   new Image('dragonfly3', '/images/GUD_7.JPG', 'sampleDesc3'),
+    //   new Image('dragonfly4', '/images/GUD_8.JPG', 'sampleDesc4'),
+    //   new Image('dragonfly1', '/images/GUD_9.JPG', 'sampleDesc1'),
+    //   new Image('dragonfly2', '/images/GUD_10.JPG', 'sampleDesc2'),
+    //   new Image('dragonfly3', '/images/GUD_11.JPG', 'sampleDesc3'),
+    //   new Image('dragonfly4', '/images/GUD_12.JPG', 'sampleDesc4'),
+    //   new Image('dragonfly1', '/images/GUD_4.JPG', 'sampleDesc1'),
+    //   new Image('dragonfly2', '/images/GUD_3.JPG', 'sampleDesc2'),
+    //   new Image('dragonfly3', '/images/GUD_2.JPG', 'sampleDesc3'),
+    //   new Image('dragonfly4', '/images/GUD_1.JPG', 'sampleDesc4')
+    // ]
+    const {images} = this.props
     const imageRenders = images.map((image, index) => {
       return <ImageCard image={image} key={index} />
     })
@@ -41,4 +45,11 @@ ImageContainer.propTypes = {
   images: PropTypes.array
 };
 
-export default ImageContainer;
+const mapStateToProps = createGetSelector({
+  images: getImages
+})
+
+export default connect(
+  mapStateToProps,
+  null
+)(ImageContainer)

client/src/app/components/molecules/common/CommandPrompt/CommandPrompt.component.scss

@@ -31,6 +31,7 @@
 		border: none;
 		border-radius: 0 5px 5px 0;
 		// margin-bottom: 40px;
+		width: 97%;
 		box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.1);
 	}
 	

client/src/app/components/molecules/common/Dropzone/Dropzone.js

@@ -20,9 +20,6 @@ class Dropzone extends React.Component {
 
   onFilesAdded(evt) {
     if (this.props.disabled) return;
-    console.log(evt.target.files)
-    console.log(evt.target.result)
-
     const files = evt.target.files;
     if (this.props.onFilesAdded) {
       const array = this.fileListToArray(files);

client/src/app/components/molecules/common/Uploader/Uploader.js

@@ -113,6 +113,7 @@ class Uploader extends React.Component {
         const img = new Image();
         img.src = event.target.result;
         img.onload = () => {
+          fileVariants.push(file)
           const elem = document.createElement('canvas');
           elem.width = width;
           elem.height = height;
@@ -156,15 +157,17 @@ class Uploader extends React.Component {
 
   sendRequest(files) {
     return new Promise((resolve, reject) => {
-      const req = new XMLHttpRequest();
-
       const formData = new FormData();
       files.forEach((file) => {
         formData.append("file", file, file.name);
       })
-
-      req.open("POST", "http://localhost:3001/upload");
-      req.send(formData);
+      fetch('http://localhost:3001/upload', {
+        method: 'post',
+        body: formData
+      })
+      .then(response => response.json())
+      .then(jsonData => resolve(console.log(jsonData)))
+      .catch(err => reject(err))
     });
   }
 

client/src/app/pages/Home/actions.js

@@ -1,4 +1,7 @@
+import DataService from './../../services/data.service.ts'
+
 export const HOME_DATA_STATE_RECEIVED = 'HOME_DATA_STATE_RECEIVED'
+export const SAVE_RETRIEVED_IMAGES = 'SAVE_RETRIEVED_IMAGES'
 export const UPDATE_FORM_VALUES = 'UPDATE_BILLING_FORM_VALUES'
 export const UPDATE_FORM_ERRORS = 'UPDATE_BILLING_FORM_ERRORS'
 export const UPDATE_BACKGROUND = 'UPDATE_BACKGROUND'
@@ -6,15 +9,24 @@ export const UPDATE_MODAL_STATE = 'UPDATE_MODAL_STATE'
 export const UPDATE_UPLOAD_MODAL_STATE = 'UPDATE_UPLOAD_MODAL_STATE'
 
 export const updateHomeDataState = (payload) => ({type: HOME_DATA_STATE_RECEIVED, payload})
-
+const ds = new DataService()
 export const initializeHome = () => (dispatch) => {
     // return Promise.all([
     //     dispatch(initializeApp())
     // ])
     // .then(() => ({statusCode: 200}))
     // .catch((err) => ({statusCode: err.statusCode || 500}))
+    ds.getFeaturedImages().then(res => {
+        dispatch(saveRetrievedImages(res))
+    })
 }
 
+export const saveRetrievedImages = (images) => {
+    return {
+        type: SAVE_RETRIEVED_IMAGES,
+        payload: {images}
+    }
+}
 export const updateFormValues = (formValues) => {
     return {
         type: UPDATE_FORM_VALUES,

client/src/app/pages/Home/reducer.js

@@ -2,6 +2,7 @@ import Immutable from 'immutable'
 
 import {
     HOME_DATA_STATE_RECEIVED,
+    SAVE_RETRIEVED_IMAGES,
     UPDATE_FORM_ERRORS,
     UPDATE_FORM_VALUES,
     UPDATE_BACKGROUND,
@@ -17,6 +18,7 @@ const initialState = Immutable.Map({
 const reducer = (state = initialState, action) => {
     switch (action.type) {
         case HOME_DATA_STATE_RECEIVED:
+        case SAVE_RETRIEVED_IMAGES:
         case UPDATE_FORM_ERRORS:
         case UPDATE_FORM_VALUES:
         case UPDATE_BACKGROUND:

client/src/app/pages/Home/selectors.js

@@ -15,3 +15,4 @@ export const getModalState = createGetSelector(getHome, 'modalOpened')
 export const getUploadModalState = createGetSelector(getHome, 'uploadModalOpened')
 export const getFormValues = createGetSelector(getHome, 'formValues')
 export const getFormErrors = createGetSelector(getHome, 'formErrors')
+export const getImages = createGetSelector(getHome, 'images')

client/src/app/services/data.service.ts

@@ -1,4 +1,10 @@
-export class DataService {
+export default class DataService {
 
   constructor() { }
+
+  getFeaturedImages() {
+    fetch('/images/featured')
+    .then(res => res.json())
+    .catch(err => console.log(err))
+  }
 }

package.json

@@ -14,6 +14,5 @@
   },
   "devDependencies": {
     "npm-run-all": "^4.1.5"
-  },
-  "proxy": "http://localhost:3001"
+  }
 }

server/filesManager/download.js

@@ -0,0 +1,33 @@
+const fs = require('fs')
+var path = require('path');
+var multer = require('multer');
+
+var EXTENSION = '.txt';
+
+var storage = multer.diskStorage({
+    destination: function (req, file, cb) {
+    cb(null, 'image_uploads')
+  },
+  filename: function (req, file, cb) {
+    cb(null, Date.now() + '-' +file.originalname )
+  }
+})
+
+var download = () => {
+    var dirpath = './../image_uploads/'
+    fs.readdir(dirpath, function(err, files) {
+        files.forEach(file => {
+            console.log(file.originalname)
+        })
+        var targetFiles = files.filter(function(file) {
+            return path.extname(file).toLowerCase() === EXTENSION;
+        });
+        targetFiles.forEach(file => {
+            console.log(file.originalname)
+        })
+    })
+}
+
+// var upload = multer({ storage: storage }).array('file')
+
+module.exports = download

server/filesManager/upload.js

@@ -0,0 +1,14 @@
+var multer = require('multer');
+
+var storage = multer.diskStorage({
+    destination: function (req, file, cb) {
+    cb(null, 'image_uploads')
+  },
+  filename: function (req, file, cb) {
+    cb(null, Date.now() + '-' +file.originalname )
+  }
+})
+
+var upload = multer({ storage: storage }).array('file')
+
+module.exports = upload

server/index.js

@@ -2,25 +2,31 @@ const express = require('express');
 const bodyParser = require('body-parser');
 const pino = require('express-pino-logger')();
 const cors = require('cors')
-const upload = require('./upload/upload')
+const upload = require('./filesManager/upload')
+const download = require('./filesManager/download')
+const multer = require('multer')
 
 const app = express();
-var corsOptions = {
-  origin: '*',
-  optionsSuccessStatus: 200,
-}
+var corsOptions = {origin: '*', optionsSuccessStatus: 200,}
 
 app.use(cors(corsOptions))
 app.use(bodyParser.urlencoded({ extended: false }));
 app.use(pino);
 
-app.get('/api/greeting', (req, res) => {
-  const name = req.query.name || 'World';
-  res.setHeader('Content-Type', 'application/json');
-  res.send(JSON.stringify({ greeting: `Hello ${name}!` }));
-});
+app.get('/images/:type', download)
 
-app.post('/upload', upload)
+app.post('/upload', (req, res) => {
+  upload(req, res, err => {
+    if (err instanceof multer.MulterError) {
+      console.log(err)
+      return res.status(500).json(err)
+    } else if (err) {
+      console.log(err)
+      return res.status(500).json(err)
+    }
+    return res.status(200).send(req.file)
+  })
+})
 
 app.listen(3001, () =>
   console.log('Express server is running on localhost:3001')

server/package-lock.json

@@ -962,6 +962,11 @@
         "normalize-path": "^2.1.1"
       }
     },
+    "append-field": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/append-field/-/append-field-1.0.0.tgz",
+      "integrity": "sha1-HjRA6RXwsSA9I3SOeO3XubW0PlY="
+    },
     "arr-diff": {
       "version": "4.0.0",
       "resolved": "https://registry.npmjs.org/arr-diff/-/arr-diff-4.0.0.tgz",
@@ -1252,6 +1257,20 @@
         "node-releases": "^1.1.36"
       }
     },
+    "buffer-from": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/buffer-from/-/buffer-from-1.1.1.tgz",
+      "integrity": "sha512-MQcXEUbCKtEo7bhqEs6560Hyd4XaovZlO/k9V3hjVUF/zwW7KBVdSK4gIt/bzwS9MbR5qob+F5jusZsb0YQK2A=="
+    },
+    "busboy": {
+      "version": "0.2.14",
+      "resolved": "https://registry.npmjs.org/busboy/-/busboy-0.2.14.tgz",
+      "integrity": "sha1-bCpiLvz0fFe7vh4qnDetNseSVFM=",
+      "requires": {
+        "dicer": "0.2.5",
+        "readable-stream": "1.1.x"
+      }
+    },
     "cache-base": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/cache-base/-/cache-base-1.0.1.tgz",
@@ -1431,6 +1450,41 @@
       "integrity": "sha1-2Klr13/Wjfd5OnMDajug1UBdR3s=",
       "dev": true
     },
+    "concat-stream": {
+      "version": "1.6.2",
+      "resolved": "https://registry.npmjs.org/concat-stream/-/concat-stream-1.6.2.tgz",
+      "integrity": "sha512-27HBghJxjiZtIk3Ycvn/4kbJk/1uZuJFfuPEns6LaEvpvG1f0hTea8lilrouyo9mVc2GWdcEZ8OLoGmSADlrCw==",
+      "requires": {
+        "buffer-from": "^1.0.0",
+        "inherits": "^2.0.3",
+        "readable-stream": "^2.2.2",
+        "typedarray": "^0.0.6"
+      },
+      "dependencies": {
+        "readable-stream": {
+          "version": "2.3.6",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.6.tgz",
+          "integrity": "sha512-tQtKA9WIAhBF3+VLAseyMqZeBjW0AHJoxOtYqSUZNJxauErmLbVm2FW1y+J/YA9dUrAC39ITejlZWhVIwawkKw==",
+          "requires": {
+            "core-util-is": "~1.0.0",
+            "inherits": "~2.0.3",
+            "isarray": "~1.0.0",
+            "process-nextick-args": "~2.0.0",
+            "safe-buffer": "~5.1.1",
+            "string_decoder": "~1.1.1",
+            "util-deprecate": "~1.0.1"
+          }
+        },
+        "string_decoder": {
+          "version": "1.1.1",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.1.1.tgz",
+          "integrity": "sha512-n/ShnvDi6FHbbVfviro+WojiFzv+s8MPMHBczVePfUpDJLwoLT0ht1l4YwBCbi8pJAveEEdnkHyPyTP/mzRfwg==",
+          "requires": {
+            "safe-buffer": "~5.1.0"
+          }
+        }
+      }
+    },
     "configstore": {
       "version": "3.1.2",
       "resolved": "https://registry.npmjs.org/configstore/-/configstore-3.1.2.tgz",
@@ -1511,8 +1565,7 @@
     "core-util-is": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/core-util-is/-/core-util-is-1.0.2.tgz",
-      "integrity": "sha1-tf1UIgqivFq1eqtxQMlAdUUDwac=",
-      "dev": true
+      "integrity": "sha1-tf1UIgqivFq1eqtxQMlAdUUDwac="
     },
     "cors": {
       "version": "2.8.5",
@@ -1654,6 +1707,15 @@
       "integrity": "sha1-l4hXRCxEdJ5CBmE+N5RiBYJqvYA=",
       "dev": true
     },
+    "dicer": {
+      "version": "0.2.5",
+      "resolved": "https://registry.npmjs.org/dicer/-/dicer-0.2.5.tgz",
+      "integrity": "sha1-WZbAhrszIYyBLAkL3cCc0S+stw8=",
+      "requires": {
+        "readable-stream": "1.1.x",
+        "streamsearch": "0.1.2"
+      }
+    },
     "dot-prop": {
       "version": "4.2.0",
       "resolved": "https://registry.npmjs.org/dot-prop/-/dot-prop-4.2.0.tgz",
@@ -1672,8 +1734,7 @@
     "ee-first": {
       "version": "1.1.1",
       "resolved": "https://registry.npmjs.org/ee-first/-/ee-first-1.1.1.tgz",
-      "integrity": "sha1-WQxhFWsK4vTwJVcyoViyZrxWsh0=",
-      "dev": true
+      "integrity": "sha1-WQxhFWsK4vTwJVcyoViyZrxWsh0="
     },
     "electron-to-chromium": {
       "version": "1.3.293",
@@ -2117,8 +2178,7 @@
         "ansi-regex": {
           "version": "2.1.1",
           "bundled": true,
-          "dev": true,
-          "optional": true
+          "dev": true
         },
         "aproba": {
           "version": "1.2.0",
@@ -2139,14 +2199,12 @@
         "balanced-match": {
           "version": "1.0.0",
           "bundled": true,
-          "dev": true,
-          "optional": true
+          "dev": true
         },
         "brace-expansion": {
           "version": "1.1.11",
           "bundled": true,
           "dev": true,
-          "optional": true,
           "requires": {
             "balanced-match": "^1.0.0",
             "concat-map": "0.0.1"
@@ -2161,20 +2219,17 @@
         "code-point-at": {
           "version": "1.1.0",
           "bundled": true,
-          "dev": true,
-          "optional": true
+          "dev": true
         },
         "concat-map": {
           "version": "0.0.1",
           "bundled": true,
-          "dev": true,
-          "optional": true
+          "dev": true
         },
         "console-control-strings": {
           "version": "1.1.0",
           "bundled": true,
-          "dev": true,
-          "optional": true
+          "dev": true
         },
         "core-util-is": {
           "version": "1.0.2",
@@ -2291,8 +2346,7 @@
         "inherits": {
           "version": "2.0.3",
           "bundled": true,
-          "dev": true,
-          "optional": true
+          "dev": true
         },
         "ini": {
           "version": "1.3.5",
@@ -2304,7 +2358,6 @@
           "version": "1.0.0",
           "bundled": true,
           "dev": true,
-          "optional": true,
           "requires": {
             "number-is-nan": "^1.0.0"
           }
@@ -2319,7 +2372,6 @@
           "version": "3.0.4",
           "bundled": true,
           "dev": true,
-          "optional": true,
           "requires": {
             "brace-expansion": "^1.1.7"
           }
@@ -2327,14 +2379,12 @@
         "minimist": {
           "version": "0.0.8",
           "bundled": true,
-          "dev": true,
-          "optional": true
+          "dev": true
         },
         "minipass": {
           "version": "2.3.5",
           "bundled": true,
           "dev": true,
-          "optional": true,
           "requires": {
             "safe-buffer": "^5.1.2",
             "yallist": "^3.0.0"
@@ -2353,7 +2403,6 @@
           "version": "0.5.1",
           "bundled": true,
           "dev": true,
-          "optional": true,
           "requires": {
             "minimist": "0.0.8"
           }
@@ -2434,8 +2483,7 @@
         "number-is-nan": {
           "version": "1.0.1",
           "bundled": true,
-          "dev": true,
-          "optional": true
+          "dev": true
         },
         "object-assign": {
           "version": "4.1.1",
@@ -2447,7 +2495,6 @@
           "version": "1.4.0",
           "bundled": true,
           "dev": true,
-          "optional": true,
           "requires": {
             "wrappy": "1"
           }
@@ -2533,8 +2580,7 @@
         "safe-buffer": {
           "version": "5.1.2",
           "bundled": true,
-          "dev": true,
-          "optional": true
+          "dev": true
         },
         "safer-buffer": {
           "version": "2.1.2",
@@ -2570,7 +2616,6 @@
           "version": "1.0.2",
           "bundled": true,
           "dev": true,
-          "optional": true,
           "requires": {
             "code-point-at": "^1.0.0",
             "is-fullwidth-code-point": "^1.0.0",
@@ -2590,7 +2635,6 @@
           "version": "3.0.1",
           "bundled": true,
           "dev": true,
-          "optional": true,
           "requires": {
             "ansi-regex": "^2.0.0"
           }
@@ -2634,14 +2678,12 @@
         "wrappy": {
           "version": "1.0.2",
           "bundled": true,
-          "dev": true,
-          "optional": true
+          "dev": true
         },
         "yallist": {
           "version": "3.0.3",
           "bundled": true,
-          "dev": true,
-          "optional": true
+          "dev": true
         }
       }
     },
@@ -2833,8 +2875,7 @@
     "inherits": {
       "version": "2.0.4",
       "resolved": "https://registry.npmjs.org/inherits/-/inherits-2.0.4.tgz",
-      "integrity": "sha512-k/vGaX4/Yla3WzyMCvTQOXYeIHvqOKtnqBduzTHpzpQZzAskKMhZ2K+EnBiSM9zGSoIFeMpXKxa4dYeZIQqewQ==",
-      "dev": true
+      "integrity": "sha512-k/vGaX4/Yla3WzyMCvTQOXYeIHvqOKtnqBduzTHpzpQZzAskKMhZ2K+EnBiSM9zGSoIFeMpXKxa4dYeZIQqewQ=="
     },
     "ini": {
       "version": "1.3.5",
@@ -3027,8 +3068,7 @@
     "isarray": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
-      "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE=",
-      "dev": true
+      "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
     },
     "isexe": {
       "version": "2.0.0",
@@ -3201,8 +3241,7 @@
     "media-typer": {
       "version": "0.3.0",
       "resolved": "https://registry.npmjs.org/media-typer/-/media-typer-0.3.0.tgz",
-      "integrity": "sha1-hxDXrwqmJvj/+hzgAWhUUmMlV0g=",
-      "dev": true
+      "integrity": "sha1-hxDXrwqmJvj/+hzgAWhUUmMlV0g="
     },
     "mem": {
       "version": "4.3.0",
@@ -3267,14 +3306,12 @@
     "mime-db": {
       "version": "1.40.0",
       "resolved": "https://registry.npmjs.org/mime-db/-/mime-db-1.40.0.tgz",
-      "integrity": "sha512-jYdeOMPy9vnxEqFRRo6ZvTZ8d9oPb+k18PKoYNYUe2stVEBPPwsln/qWzdbmaIvnhZ9v2P+CuecK+fpUfsV2mA==",
-      "dev": true
+      "integrity": "sha512-jYdeOMPy9vnxEqFRRo6ZvTZ8d9oPb+k18PKoYNYUe2stVEBPPwsln/qWzdbmaIvnhZ9v2P+CuecK+fpUfsV2mA=="
     },
     "mime-types": {
       "version": "2.1.24",
       "resolved": "https://registry.npmjs.org/mime-types/-/mime-types-2.1.24.tgz",
       "integrity": "sha512-WaFHS3MCl5fapm3oLxU4eYDw77IQM2ACcxQ9RIxfaC3ooc6PFuBMGZZsYpvoXS5D5QTWPieo1jjLdAm3TBP3cQ==",
-      "dev": true,
       "requires": {
         "mime-db": "1.40.0"
       }
@@ -3319,7 +3356,6 @@
       "version": "0.5.1",
       "resolved": "https://registry.npmjs.org/mkdirp/-/mkdirp-0.5.1.tgz",
       "integrity": "sha1-MAV0OOrGz3+MR2fzhkjWaX11yQM=",
-      "dev": true,
       "requires": {
         "minimist": "0.0.8"
       },
@@ -3327,8 +3363,7 @@
         "minimist": {
           "version": "0.0.8",
           "resolved": "https://registry.npmjs.org/minimist/-/minimist-0.0.8.tgz",
-          "integrity": "sha1-hX/Kv8M5fSYluCKCYuhqp6ARsF0=",
-          "dev": true
+          "integrity": "sha1-hX/Kv8M5fSYluCKCYuhqp6ARsF0="
         }
       }
     },
@@ -3338,6 +3373,21 @@
       "integrity": "sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w==",
       "dev": true
     },
+    "multer": {
+      "version": "1.4.2",
+      "resolved": "https://registry.npmjs.org/multer/-/multer-1.4.2.tgz",
+      "integrity": "sha512-xY8pX7V+ybyUpbYMxtjM9KAiD9ixtg5/JkeKUTD6xilfDv0vzzOFcCp4Ljb1UU3tSOM3VTZtKo63OmzOrGi3Cg==",
+      "requires": {
+        "append-field": "^1.0.0",
+        "busboy": "^0.2.11",
+        "concat-stream": "^1.5.2",
+        "mkdirp": "^0.5.1",
+        "object-assign": "^4.1.1",
+        "on-finished": "^2.3.0",
+        "type-is": "^1.6.4",
+        "xtend": "^4.0.0"
+      }
+    },
     "nan": {
       "version": "2.14.0",
       "resolved": "https://registry.npmjs.org/nan/-/nan-2.14.0.tgz",
@@ -3755,7 +3805,6 @@
       "version": "2.3.0",
       "resolved": "https://registry.npmjs.org/on-finished/-/on-finished-2.3.0.tgz",
       "integrity": "sha1-IPEzZIGwg811M3mSoWlxqi2QaUc=",
-      "dev": true,
       "requires": {
         "ee-first": "1.1.1"
       }
@@ -4015,8 +4064,7 @@
     "process-nextick-args": {
       "version": "2.0.1",
       "resolved": "https://registry.npmjs.org/process-nextick-args/-/process-nextick-args-2.0.1.tgz",
-      "integrity": "sha512-3ouUOpQhtgrbOa17J7+uxOTpITYWaGP7/AhoR3+A+/1e9skrzelGi/dXzEYyvbxubEF6Wn2ypscTKiKJFFn1ag==",
-      "dev": true
+      "integrity": "sha512-3ouUOpQhtgrbOa17J7+uxOTpITYWaGP7/AhoR3+A+/1e9skrzelGi/dXzEYyvbxubEF6Wn2ypscTKiKJFFn1ag=="
     },
     "proxy-addr": {
       "version": "2.0.5",
@@ -4102,6 +4150,24 @@
         }
       }
     },
+    "readable-stream": {
+      "version": "1.1.14",
+      "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.1.14.tgz",
+      "integrity": "sha1-fPTFTvZI44EwhMY23SB54WbAgdk=",
+      "requires": {
+        "core-util-is": "~1.0.0",
+        "inherits": "~2.0.1",
+        "isarray": "0.0.1",
+        "string_decoder": "~0.10.x"
+      },
+      "dependencies": {
+        "isarray": {
+          "version": "0.0.1",
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-0.0.1.tgz",
+          "integrity": "sha1-ihis/Kmo9Bd+Cav8YDiTmwXR7t8="
+        }
+      }
+    },
     "readdirp": {
       "version": "2.2.1",
       "resolved": "https://registry.npmjs.org/readdirp/-/readdirp-2.2.1.tgz",
@@ -4277,8 +4343,7 @@
     "safe-buffer": {
       "version": "5.1.2",
       "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.1.2.tgz",
-      "integrity": "sha512-Gd2UZBJDkXlY7GbJxfsE8/nvKkUEU1G38c1siN6QP6a9PT9MmHB8GnpscSmMJSoF8LOIrt8ud/wPtojys4G6+g==",
-      "dev": true
+      "integrity": "sha512-Gd2UZBJDkXlY7GbJxfsE8/nvKkUEU1G38c1siN6QP6a9PT9MmHB8GnpscSmMJSoF8LOIrt8ud/wPtojys4G6+g=="
     },
     "safe-regex": {
       "version": "1.1.0",
@@ -4640,6 +4705,11 @@
       "integrity": "sha1-Fhx9rBd2Wf2YEfQ3cfqZOBR4Yow=",
       "dev": true
     },
+    "streamsearch": {
+      "version": "0.1.2",
+      "resolved": "https://registry.npmjs.org/streamsearch/-/streamsearch-0.1.2.tgz",
+      "integrity": "sha1-gIudDlb8Jz2Am6VzOOkpkZoanxo="
+    },
     "string-width": {
       "version": "2.1.1",
       "resolved": "https://registry.npmjs.org/string-width/-/string-width-2.1.1.tgz",
@@ -4661,6 +4731,11 @@
         }
       }
     },
+    "string_decoder": {
+      "version": "0.10.31",
+      "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-0.10.31.tgz",
+      "integrity": "sha1-YuIDvEF2bGwoyfyEMB2rHFMQ+pQ="
+    },
     "strip-eof": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/strip-eof/-/strip-eof-1.0.0.tgz",
@@ -4828,12 +4903,16 @@
       "version": "1.6.18",
       "resolved": "https://registry.npmjs.org/type-is/-/type-is-1.6.18.tgz",
       "integrity": "sha512-TkRKr9sUTxEH8MdfuCSP7VizJyzRNMjj2J2do2Jr3Kym598JVdEksuzPQCnlFPW4ky9Q+iA+ma9BGm06XQBy8g==",
-      "dev": true,
       "requires": {
         "media-typer": "0.3.0",
         "mime-types": "~2.1.24"
       }
     },
+    "typedarray": {
+      "version": "0.0.6",
+      "resolved": "https://registry.npmjs.org/typedarray/-/typedarray-0.0.6.tgz",
+      "integrity": "sha1-hnrHTjhkGHsdPUfZlqeOxciDB3c="
+    },
     "undefsafe": {
       "version": "2.0.2",
       "resolved": "https://registry.npmjs.org/undefsafe/-/undefsafe-2.0.2.tgz",
@@ -5026,8 +5105,7 @@
     "util-deprecate": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/util-deprecate/-/util-deprecate-1.0.2.tgz",
-      "integrity": "sha1-RQ1Nyfpw3nMnYvvS1KKJgUGaDM8=",
-      "dev": true
+      "integrity": "sha1-RQ1Nyfpw3nMnYvvS1KKJgUGaDM8="
     },
     "utils-merge": {
       "version": "1.0.1",
@@ -5090,8 +5168,7 @@
     "xtend": {
       "version": "4.0.2",
       "resolved": "https://registry.npmjs.org/xtend/-/xtend-4.0.2.tgz",
-      "integrity": "sha512-LKYU1iAXJXUgAXn9URjiu+MWhyUXHsvfp7mcuYm9dSUKK0/CjtrUwFAxD82/mCWbtLsGjFIad0wIsod4zrTAEQ==",
-      "dev": true
+      "integrity": "sha512-LKYU1iAXJXUgAXn9URjiu+MWhyUXHsvfp7mcuYm9dSUKK0/CjtrUwFAxD82/mCWbtLsGjFIad0wIsod4zrTAEQ=="
     },
     "yallist": {
       "version": "2.1.2",

server/package.json

@@ -4,7 +4,8 @@
   "private": true,
   "dependencies": {
     "cors": "^2.8.5",
-    "formidable": "^1.2.1"
+    "formidable": "^1.2.1",
+    "multer": "^1.4.2"
   },
   "scripts": {
     "start": "node-env-run --exec nodemon | pino-colada"
@@ -28,6 +29,5 @@
     "node-env-run": "^3.0.2",
     "nodemon": "^1.19.4",
     "pino-colada": "^1.4.5"
-  },
-  "proxy": "http://localhost:3001"
+  }
 }

server/upload/upload.js

@@ -1,21 +0,0 @@
-const IncomingForm = require('formidable').IncomingForm
-const fs = require('fs')
-var path = require('path');
-
-module.exports = function upload(req, res) {
-    var form = new IncomingForm()
-    form.on('file', (field, file) => {
-        var oldpath = file.path;
-        // var newpath = __dirname  + file.name;
-        var newpath = path.join(__dirname, '..', 'image_uploads', file.name);
-        fs.rename(oldpath, newpath, function (err) {
-            if (err) throw err;
-            res.write('File uploaded and moved!');
-            res.end();
-        });
-    })
-    form.on('end', () => {
-        res.json()
-    })
-    form.parse(req)
-}