Add parks images to cloudinary

.prettierignore

@@ -1,3 +1,4 @@
 node_modules
 package.json
 package-lock.json
+frontend

controllers/app-config.js

@@ -11,6 +11,7 @@ const mongoUtils = require('../nodejs/mongo-utils');
 const scheduler = require('../nodejs/scheduler');
 const { agenda } = require('../nodejs/agenda');
 const parksList = require('../config/parks');
+const parks = require('../nodejs/parks');
 const statesList = require('../config/states');
 const countriesList = require('../config/countries');
 const appModules = require('../nodejs/app-modules');
@@ -73,13 +74,18 @@ exports.getConfig = async (req, res) => {
  * POST /app-config
  * Save application config
  */
-exports.saveConfig = (req, res, next) => {
+exports.saveConfig = async (req, res, next) => {
   const data = req.body;
 
   if (!data) {
     return next('No config data to save');
   }
 
+  if (data.appName === 'parks') {
+    // eslint-disable-next-line no-underscore-dangle
+    await parks.save(req.user._id);
+  }
+
   if (data.parks && data.parks.visited) {
     data.parks.visited = data.parks.visited.map((x) => x.value);
   }

frontend/src/pages/app-settings/app-settings.tsx

@@ -72,7 +72,10 @@ const AppSettings: React.FC = () => {
     setSaveSuccess(false);
 
     try {
-      const { data: response }: ServerResponse = await Request.post({ url: '/app-config/config', body });
+      const { data: response }: ServerResponse = await Request.post({
+        url: '/app-config/config',
+        body: { ...body, appName },
+      });
       setData(response.data);
       setSaveSuccess(true);
     } catch (e: any) {

frontend/src/pages/app-settings/parks-settings.tsx

@@ -1,16 +1,21 @@
 import React, { useEffect, useState } from 'react';
 import { useForm } from 'react-hook-form';
+import { makeStyles } from '@material-ui/core/styles';
 
-import { Button, Form, MultiSelect2 } from '@schulzetenberg/component-library';
+import { Button, Form, MultiSelect2, SwitchForm2 } from '@schulzetenberg/component-library';
+
+const useStyles = makeStyles(() => ({
+  textCenter: { textAlign: 'center' },
+}));
 
 type FormData = {
   visited: { value: string; label: string }[];
   options: { value: string; label: string }[];
-  schedule: string;
   cloudinaryUpload: boolean;
 };
 
 const ParksSettings: React.FC<{ data: FormData; isLoading: boolean; submit: any }> = ({ data, isLoading, submit }) => {
+  const classes = useStyles();
   const [options, setOptions] = useState<{ value: string; label: string }[]>([]);
 
   const {
@@ -26,14 +31,17 @@ const ParksSettings: React.FC<{ data: FormData; isLoading: boolean; submit: any
     if (data) {
       setOptions(data.options);
 
-      const { visited } = data;
-      reset({ visited });
+      const { visited, cloudinaryUpload } = data;
+      reset({ visited, cloudinaryUpload });
     }
   }, [data, reset]);
 
   return (
     <Form disabled={formProps.disabled} onSubmit={handleSubmit(submit)}>
       <MultiSelect2 name="visited" options={options} {...formProps} />
+      <div className={classes.textCenter}>
+        <SwitchForm2 {...formProps} name="cloudinaryUpload" label="Upload Images to Cloudinary" />
+      </div>
       <Button {...formProps} type="submit">
         Save
       </Button>

models/app-config.js

@@ -83,8 +83,6 @@ const appConfigSchema = new mongoose.Schema(
       cloudinaryUpload: { type: Boolean, default: false },
     },
     parks: {
-      active: { type: Boolean, default: false },
-      schedule: { type: String, default: '10 10 0 * * 1' },
       cloudinaryUpload: { type: Boolean, default: false },
       visited: { type: [] },
     },

models/parks-model.js

@@ -1,14 +1,18 @@
 const mongoose = require('mongoose');
 
-module.exports = mongoose.model('parks', {
-  userId: { type: mongoose.Schema.Types.ObjectId, ref: 'user', required: true },
-  parks: [
-    {
-      name: String,
-      imageUrl: String,
-      State: String,
-      location: String,
-    },
-  ],
-  timestamp: { type: Date, default: Date.now, expires: 60 * 60 * 24 * 90 }, // Delete documents after 90 days
-});
+const parksSchema = new mongoose.Schema(
+  {
+    userId: { type: mongoose.Schema.Types.ObjectId, ref: 'user', required: true },
+    parks: [
+      {
+        name: String,
+        imageUrl: String,
+        State: String,
+        location: String,
+      },
+    ],
+  },
+  { timestamps: true }
+);
+
+module.exports = mongoose.model('parks', parksSchema);

nodejs/goodreads.js

@@ -105,6 +105,7 @@ async function uploadImage({ config, data }) {
   try {
     const response = await cloudinaryUploadAsync(data.img, {
       folder: 'books',
+      // TODO: Use userId in public_id
       // Assign a public id so that when we upload an image with the same id, it will replace the previous one
       public_id: `${data.title}-book`
         .replace(/ /g, '-')

nodejs/instagram.js

@@ -78,6 +78,7 @@ async function uploadImages({ config, image }) {
   try {
     const response = await cloudinaryUploadAsync(image.imgUrl, {
       folder: 'instagram',
+      // TODO: Use userId in public_id
       // Assign a public id so that when we upload an image with the same id, it will replace the previous one
       public_id: `${image.id}-instagram`,
       transformation: [{ flags: 'force_strip', height: 160, width: 160, quality: 'auto:good', crop: 'fill' }],

nodejs/music.js

@@ -148,6 +148,7 @@ function getSpotifyArtist(config, artist) {
       try {
         const response = await cloudinaryUploadAsync(data.img, {
           folder: 'music',
+          // TODO: Use userId in public_id
           // Assign a public id so that when we upload an image with the same id, it will replace the previous one
           public_id: `${data.artist}-artist`
             .replace(/ /g, '-')

nodejs/parks.js

@@ -24,20 +24,26 @@ exports.get = (userId) =>
 exports.save = (userId) =>
   appConfig
     .get(userId)
-    .then(uploadAllImages)
-    .then((parks) => {
-      const doc = new ParksModel({ parks, userId });
-      return doc.save();
-    });
+    .then((config) => uploadAllImages(config, userId))
+    .then((parks) =>
+      // Keep only 1 questions document in the DB per user. Override the existing doc if it exists
+      ParksModel.findOneAndUpdate(
+        { userId },
+        { parks, userId },
+        {
+          new: true,
+          upsert: true,
+        }
+      ).lean()
+    );
 
-function uploadAllImages(config) {
-  const parkPromises = parksList.map((park) => uploadImage(config, park));
+function uploadAllImages(config, userId) {
+  const parkPromises = parksList.map((park) => uploadImage(config, park, userId));
 
   return Promise.all(parkPromises);
 }
 
-async function uploadImage(config, park) {
-  // NOTE: This config is not availible yet, so we will never upload any images
+async function uploadImage(config, park, userId) {
   if (!config.parks.cloudinaryUpload) {
     return park;
   }
@@ -46,12 +52,17 @@ async function uploadImage(config, park) {
     const response = await cloudinaryUploadAsync(park.imageUrl, {
       folder: 'parks',
       // Assign a public id so that when we upload an image with the same id, it will replace the previous one
-      public_id: `${park.name}-park`
+      public_id: `${userId}-${park.name}-park`
         .replace(/ /g, '-')
         .replace(/[^a-zA-Z0-9-_]/g, '')
         .toLowerCase()
         .substring(0, 100),
       transformation: [
+        {
+          width: 140,
+          height: 140,
+          crop: 'lfill',
+        },
         {
           background: '#786262',
           effect: 'colorize:40',

nodejs/player-fm.js

@@ -99,6 +99,7 @@ function getArtwork({ config, podcast }) {
       try {
         const response = await cloudinaryUploadAsync(data.imgUrl, {
           folder: 'podcasts',
+          // TODO: Use userId in public_id
           // Assign a public id so that when we upload an image with the same id, it will replace the previous one
           public_id: `${data.title}-podcast`
             .replace(/ /g, '-')