Merge branch 'arcade-gallery' of https://github.com/claynicholson/site into pr/1312

components/arcade/showcase/cohort-card.js

@@ -4,23 +4,40 @@ import styles from './cohort-card.module.css'
 import { useState } from 'react'
 import { Button } from 'theme-ui'
 
-const CohortCard = ({ id, title = "Title Not Found", desc = "Description Not Found", slack = "Slack Not Found", scrapbook = "", playLink = "", images = [], githubProf, githubLink = "", draggable = false, personal = false}) => {
+const CohortCard = ({ id, title = "Title Not Found", desc = "Description Not Found", slack = "Slack Not Found", scrapbook = "", playLink = "", images = [], githubProf, githubLink = "", draggable = false, personal = false, reload}) => {
   const [isHovered, setIsHovered] = useState(false);
 
 
-  const handleDelete = async () => {
-    const { status, formProps, useField, data } = useForm(
-    `/api/arcade/showcase/projects/${project.id}/edit`,
-    publishedChanges,
-    {
-      method: 'PATCH',
-      initData: { ...project, recordId: project.id },
-      bearer: window.localStorage.getItem('arcade.authToken')
-    }
-  )
-    return;
+  async function handleDelete() {
+    try {
+      const authToken = window.localStorage.getItem('arcade.authToken');
+
+      if (!authToken) {
+          throw new Error('Authorization token is missing.');
+      }
+
+      const response = await fetch(`/api/arcade/showcase/projects/${id}/delete`, {
+          method: 'PATCH',
+          headers: {
+              'Authorization': `Bearer ${authToken}`,
+              'Content-Type': 'application/json'
+          },
+          body: JSON.stringify({}) // Empty body since your API expects some body content
+      });
+
+      if (!response.ok) {
+          throw new Error(`Failed to delete project with ID ${id}: ${response.statusText}`);
+      }
+
+      console.log(`Project with ID ${id} marked as deleted.`);
+  } catch (error) {
+      console.error('Error deleting project:', error);
   }
 
+  reload();
+}
+
+
   const firstImage = images[0] || "https://picsum.photos/200" 
 
 

components/arcade/showcase/project-edit.js

@@ -20,7 +20,7 @@ const ProjectEditForm = ({ project }) => {
       bearer: window.localStorage.getItem('arcade.authToken')
     }
   )
-    console.log()
+
   return (
     <Box sx={{
       width: '90vw',

pages/api/arcade/showcase/projects/[projectID]/delete.js

@@ -1,44 +1,34 @@
 import AirtablePlus from "airtable-plus";
 import { ensureAuthed } from "../../login/test";
-import { DefaultLegendContent } from "recharts";
 
 export default async function handler(req, res) {
-  const user = await ensureAuthed(req)
+  const user = await ensureAuthed(req);
   if (user.error) {
-    return res.status(401).json(user)
+    return res.status(401).json(user);
   }
 
-  const body = req.body
+  const body = req.body;
   if (!body) {
-    return res.status(400).json({ error: "No body provided" })
+    return res.status(400).json({ error: "No body provided" });
   }
 
-  const updatedFields = {}
-  updatedFields['deleted'] = true;
+  const updatedFields = { deleted: true };
 
   const airtable = new AirtablePlus({
     apiKey: process.env.AIRTABLE_API_KEY,
     baseID: 'app4kCWulfB02bV8Q',
     tableName: "Showcase"
-  })
+  });
 
-  const { projectID } = req.query
+  const { projectID } = req.query;
 
-  const project = await airtable.update(projectID, updatedFields )
+  try {
+    await airtable.update(projectID, updatedFields);
 
-  const results = {
-    id: project.id,
-    title: project.fields['Name'] || '',
-    desc: project.fields['Description'] || '',
-    slackLink: project.fields['Slack Link'] || '',
-    codeLink: project.fields['Code Link'] || '',
-    slackLink: project.fields['Slack Link'] || '',
-    playLink: project.fields['Play Link'] || '',
-    images: (project.fields['Screenshot'] || []).map(i => i.url),
-    githubProf: project.fields['Github Profile'] || '',
-    user: user.fields['Name'],
-    deleted: project.fields['deleted'] || ''
+    // No content returned, only status code 204 for success
+    return res.status(204).end();
+  } catch (error) {
+    console.error("Error updating project:", error);
+    return res.status(500).json({ error: "Failed to update project" });
   }
-
-  return res.status(200).json({ project: results })
-}
+}

pages/arcade/showcase/my.js

@@ -61,7 +61,8 @@ a {
 }
 `
 
-const ProjectGallery = ({ projects }) => {
+const ProjectGallery = ({ projects, loadProjects}) => {
+
   return (
     <div className={styles.feed}>
       <div className={styles.container}>
@@ -103,6 +104,8 @@ const ProjectGallery = ({ projects }) => {
           playLink={project.playLink}
           images={project.images}
           githubProf={project.githubProf}
+          personal={true}
+          reload={loadProjects}
         />
       ))}
     </div>
@@ -174,7 +177,7 @@ const my = () => {
     return () => window.removeEventListener('mousemove', handler)
   }, [])
 
-  useEffect(async () => {
+  const loadProjects = async () => {
     const token = window.localStorage.getItem('arcade.authToken')
     const response = await fetch('/api/arcade/showcase/projects/my', {
       method: 'GET',
@@ -195,6 +198,10 @@ const my = () => {
       setName(data.name)
       setStatus('success')
     }
+  }
+
+  useEffect(async () => {
+    loadProjects();
   }, [])
 
   return (