add delete button and functionality

Author: slhoehn

app/src/Dashboard/Project.jsx

@@ -3,9 +3,10 @@ import { gql, useMutation } from '@apollo/client';
 import PropTypes from 'prop-types';
 
 
-const Project = ({ name, likes, id, userId, username }) => {
-
-  // IMPORTANT: 
+const Project = ({
+  name, likes, id, userId, username,
+}) => {
+  // IMPORTANT:
   // 1) schema change projId => id to allows Apollo Client cache auto-update. Only works with 'id'
   // 2) always request the 'id' in a mutation request
 
@@ -28,9 +29,18 @@ const Project = ({ name, likes, id, userId, username }) => {
       id
     }
   }`;
-  
-  const [ makeCopy ] = useMutation(MAKE_COPY);
 
+  const [makeCopy] = useMutation(MAKE_COPY);
+
+  const DELETE_PROJECT = gql`
+  mutation DeleteProject($projId: ID!) {
+    deleteProject(projId: $projId) 
+    {
+      id
+    }
+  }`;
+
+  const [deleteProject] = useMutation(DELETE_PROJECT);
 
   function handleLike(e) {
     e.preventDefault();
@@ -67,6 +77,17 @@ const Project = ({ name, likes, id, userId, username }) => {
     makeCopy(myVar);
   }
 
+  function handleDelete(e) {
+    e.preventDefault();
+    const myVar = {
+      variables:
+      {
+        projId: id,
+      },
+    };
+    deleteProject(myVar);
+  }
+
   return (
   <div className = 'project'>
     <h2>Project: { name }</h2>
@@ -76,6 +97,7 @@ const Project = ({ name, likes, id, userId, username }) => {
     <div>
       <button onClick={ handleLike }>like me!</button>
       <button onClick={ handleDownload }>download me!</button>
+      <button onClick={ handleDelete }>delete</button>
     </div>
   </div>
   );

app/src/index.js

@@ -16,7 +16,6 @@ import {
   Switch,
 } from 'react-router-dom';
 
-
 /*
 *  Dashboard
 */

server/graphQL/resolvers/mutation.js

@@ -19,9 +19,9 @@ const Test = {
     const update = { name: args.name, likes: args.likes };
     const options = { new: true };
     const resp = await Tests.findOneAndUpdate(filter, update, options);
-  
+
     console.log('Updated database with', resp);
-  
+
     if (resp) return { description: resp.name, id: resp._id, likes: resp.likes };
     return { description: 'Error updating', id: resp._id, likes: 0 };
   },
@@ -36,20 +36,21 @@ const Test = {
 
 
 const Project = {
-  addLike: async (parent, { projId, likes}) => {
+  addLike: async (parent, { projId, likes }) => {
     const filter = { _id: projId };
     const update = { likes };
     const options = { new: true };
     const resp = await Projects.findOneAndUpdate(filter, update, options);
-    
+
     if (resp) {
       return ({
         name: resp.name,
         id: resp._id,
         userId: resp.userId,
         username: resp.username,
         likes: resp.likes,
-      })} 
+      });
+    }
 
     // TODO: Go back to this to see how to handle error later
     return {
@@ -81,7 +82,8 @@ const Project = {
         userId: resp.userId,
         username: resp.username,
         likes: resp.likes,
-      })}
+      });
+    }
 
     // TODO: Go back to this to see how to handle error later
     return {
@@ -92,6 +94,29 @@ const Project = {
       likes: -1,
     };
   },
+
+  deleteProject: async (parent, { projId }) => {
+    const filter = { _id: projId };
+    const options = { strict: true };
+    const resp = await Projects.findOneAndDelete(filter, options);
+    console.log("resp", resp);
+    if (resp) {
+      return ({
+        name: resp.name,
+        likes: resp.likes,
+        id: resp._id,
+        userId: resp.userId,
+        username: resp.username,
+      });
+    }
+    return {
+      name: 'Error',
+      id: 'Error',
+      userId: 'Error',
+      username: 'Error',
+      likes: -1,
+    };
+  },
 };
 
 module.exports = {

server/graphQL/typeDefs.js

@@ -30,6 +30,7 @@ const Project = gql`
   type Mutation {
     addLike(projId: ID!, likes: Int!): Project
     makeCopy(projId: ID!, userId: ID!, username: String!): Project
+    deleteProject(projId: ID!): Project
   }
 
   type Project {