publish button works

Author: dentonwong

app/src/components/top/NavBar.tsx

@@ -1,4 +1,4 @@
-import React, { useState } from 'react';
+import React, { useEffect, useState } from 'react';
 import { Link } from 'react-router-dom';
 import Avatar from '@mui/material/Avatar';
 import Button from '@mui/material/Button';
@@ -23,6 +23,10 @@ const NavBar = () => {
     (state: RootState) => state.darkMode.isDarkMode
   );
 
+  useEffect(()=>{
+    setProjectName(state.name)
+  }, [state.name])//update the ProjectName after state.name changes due to loading projects
+
   const buttonContainerStyle = {
     display: 'flex',
     alignItems: 'center',
@@ -57,22 +61,24 @@ const NavBar = () => {
   };
 
   const handlePublish = () => {
+    console.log('projectName', projectName)
+    console.log('state.name', state.name)
     if (state.isLoggedIn === true && projectName === '') {
       setInvalidProjectName(true);
       setPublishModalOpen(true);
       return;
     }
 
-    if (state.name === '') { 
-      publishProject(state, projectName)
-        .then(() => {
-          console.log('Project published successfully');
-          setPublishModalOpen(false);
-        })
-        .catch((error) => {
-          console.error('Error publishing project:', error.message);
-        });
-      }
+
+    publishProject(state, projectName)
+      .then((promise) => {
+        console.log('Project published successfully', promise);
+        setPublishModalOpen(false);
+      })
+      .catch((error) => {
+        console.error('Error publishing project:', error.message);
+      });
+      
   };
 
   return (

app/src/helperFunctions/projectGetSaveDel.ts

@@ -83,7 +83,7 @@ export const publishProject = (
   const publishedProject = response
     .then((res) => res.json())
     .then((data) => {
-      return data.project;
+      return {_id: data._id, ...data.project};
     })
     .catch((err) => {
       console.log(`Error publishing project ${err}`);

app/src/redux/reducers/slice/appStateSlice.ts

@@ -15,7 +15,6 @@ export const initialState: State = {
   name: '',
   _id: '',
   forked: false,
-  _id: '',
   isLoggedIn: false,
   // config: { saveFlag: true, saveTimer: false },
   components: [

server/controllers/marketplaceController.ts

@@ -1,6 +1,7 @@
 import Project from '../graphQL/resolvers/query';
 import { MarketplaceController } from '../interfaces';
 import { Projects, Users } from '../models/reactypeModels';
+import mongoose from 'mongoose';
 
 // array of objects, objects inside
 type Projects = { project: {} }[];
@@ -33,36 +34,39 @@ const marketplaceController: MarketplaceController = {
   /**
    * 
    * Middleware function that publishes (and saves) a project to the database
-   * @return sends the updated project to the frontend
+   * @return sends the updated entire project document to the frontend
    */
-  publishProject: (req, res, next) => {
+  publishProject: async (req, res, next) => {
     const { _id, project, comments, userId, username, name } = req.body;
     const createdAt = Date.now();
+    console.log('Publish Project', _id, project, comments, userId, username, name )
+
     if (userId === req.cookies.ssid) {
-      Projects.findOneAndUpdate(
-        // looks in projects collection for project by Mongo id
-        { _id },
-        // update or insert the project
-        { project, createdAt, published: true, comments, name, userId, username },
-        // Options:
-        // upsert: true - if none found, inserts new project, otherwise updates it
-        // new: true - returns updated document not the original one
-        { upsert: true, new: true },
-        (err, result) => {
-          if (err) {
-            return next({
-              log: `Error in marketplaceController.publishProject: ${err}`,
-              message: {
-                err: 'Error in marketplaceController.publishProject, check server logs for details'
-              }
-            });
-          }
-          res.locals.publishedProject = result; //returns the entire document
-          return next();
-        }
-      );
+
+      if (mongoose.isValidObjectId(_id)) {
+        const publishedProject = await Projects.findOneAndUpdate
+          (        // looks in projects collection for project by Mongo id
+            { _id },
+            // update or insert the project
+            { project, createdAt, published: true, comments, name, userId, username },
+            // Options:
+            // upsert: true - if none found, inserts new project, otherwise updates it
+            // new: true - returns updated document not the original one
+            { upsert: true, new: true }
+          );
+        res.locals.publishedProject = publishedProject;
+        return next();
+      }else{
+        const noId = {...project};
+        delete noId._id; //removing the empty string _id from project
+        const publishedProject = await Projects.create( { project: noId, createdAt, published: true, comments, name, userId, username });
+        res.locals.publishedProject = publishedProject.toObject({ minimize: false }); 
+        console.log('published backend new', res.locals.publishedProject)
+        return next();
+      }
     }
     else {
+      console.log('userId did not match')
       // we should not expect a user to be able to access another user's id, but included error handling for unexpected errors
       return next({
         log: 'Error in marketplaceController.publishProject',