Project Editing

Author: raulclassico7

app/src/components/marketplace/MarketplaceCard.tsx

@@ -17,11 +17,13 @@ import { MoreVert } from '@mui/icons-material';
 import React from 'react';
 import imageSrc from '../../../../resources/marketplace_images/marketplace_image.png';
 import { red } from '@mui/material/colors';
+import axios from 'axios';
 import {useDispatch, useSelector} from 'react-redux'
 import { RootState } from '../../redux/store';
 import { saveProject } from '../../helperFunctions/projectGetSaveDel';
 
 interface Project {
+  forked: String,
   comments: string[]
   createdAt: Date
   likes: number
@@ -42,6 +44,15 @@ const MarketplaceCard = ({proj} :{proj: Project}) => {
   const handleClick = (event: React.MouseEvent<HTMLElement>) => {
     setAnchorEl(event.currentTarget);
   };
+  const handleClone = async () => { // creates a copy of the project 
+    const updatedProject: Project = JSON.parse(JSON.stringify(proj)); // creates a deep copy
+    updatedProject.forked = `Forked from ${updatedProject.username}`;
+    await axios.post('/cloneProject', {
+      updatedProject
+    });
+    alert('Project cloned!');
+    setAnchorEl(null);
+  };
   const handleClose = () => {
     setAnchorEl(null);
   };
@@ -97,7 +108,7 @@ const MarketplaceCard = ({proj} :{proj: Project}) => {
           }}
         >
           <MenuItem
-            onClick={handleClose}
+            onClick={handleClone}
             sx={{
               color: '#C6C6C6'
             }}

server/controllers/cookieController.ts

@@ -10,6 +10,18 @@ const cookieController: CookieController = {
       secure: true
     });
     return next();
+  }, 
+
+  /**
+   * Stores the current user's username in cookie (for use in cloning projects)
+   */
+  setUserCookie: (req, res, next) => {
+    res.cookie('username', res.locals.username, {
+      httpOnly: true, 
+      sameSite: 'none', 
+      secure: true
+    });
+    return next();
   }
 };
 

server/controllers/marketplaceController.ts

@@ -102,6 +102,39 @@ const marketplaceController: MarketplaceController = {
       })
 
     }
-  }
+  }, 
+
+  /**
+   * Middleware function that clones and saves project to user's library
+   * 
+   */
+  cloneProject: (req, res, next) => {
+    // pulls cookies from request
+    const userId = req.cookies.ssid;
+    const username = req.cookies.username;
+    const { updatedProject } = req.body;
+    updatedProject.userId = userId;
+    updatedProject.username = username;
+    updatedProject.project.forked = true; // updated the forked tag
+    delete updatedProject._id; // removes the old project id from the object
+    updatedProject.createdAt = Date.now();
+
+    Projects.create(
+      // creates a copy of the project to the user's library
+      updatedProject,
+      (err, result) => {
+        if (err) {
+          return next({
+            log: `Error in marketplaceController.cloneProject: ${err}`,
+            message: {
+              err: 'Error in marketplaceController.cloneProject, check server logs for details'
+            }
+          });
+        }
+        res.locals.clonedProject = result;
+        return next();
+      }
+    );
+  },
 };
 export default marketplaceController;

server/controllers/userController.ts

@@ -75,6 +75,9 @@ const userController: UserController = {
         }
         // if no error found when creating a new user, send back user ID in res.locals
         res.locals.id = newUser.id;
+        // send back username to store on cookies for forking projects
+        console.log(username);
+        res.locals.username = username;
         return next();
       }
     );
@@ -114,6 +117,7 @@ const userController: UserController = {
           if (isMatch) {
             // if password matches, save user id for following middleware
             res.locals.id = user.id;
+            res.locals.username = username;
             return next();
           }
           // if hashed password is not matched saved password in db, send 400 response

server/interfaces.ts

@@ -3,6 +3,7 @@ import { Document, NativeError } from 'mongoose';
 
 export interface CookieController {
   setSSIDCookie: RequestHandler;
+  setUserCookie: RequestHandler;
 }
 
 export interface ProjectController {
@@ -15,6 +16,7 @@ export interface MarketplaceController {
   publishProject: RequestHandler;
   getPublishedProjects: RequestHandler;
   unpublishProject: RequestHandler;
+  cloneProject: RequestHandler;
 }
 
 export interface RequestId extends Request {

server/server.ts

@@ -159,6 +159,7 @@ app.post(
   '/signup',
   userController.createUser,
   cookieController.setSSIDCookie,
+  cookieController.setUserCookie,
   sessionController.startSession,
   (req, res) => res.status(200).json({ sessionId: res.locals.ssid })
 );
@@ -167,6 +168,7 @@ app.post(
   '/login',
   userController.verifyUser,
   cookieController.setSSIDCookie,
+  cookieController.setUserCookie,
   sessionController.startSession,
   (req, res) => res.status(200).json({ sessionId: res.locals.ssid })
 );
@@ -217,6 +219,13 @@ app.get(
   (req, res) => res.status(200).json(res.locals.publishedProjects)
 );
 
+// Clone from marketplace
+app.post(
+  '/cloneProject',
+  marketplaceController.cloneProject, 
+  (req, res) => res.status(200).json(res.locals.clonedProject)
+);
+
 // serve index.html on the route '/'
 const isDocker = process.env.IS_DOCKER === 'true';
 console.log('this is running on docker: ', isDocker);