From a6ae18d7e8f1af07fa47f5a1d4a10643256cca64 Mon Sep 17 00:00:00 2001 From: Max Wofford Date: Sun, 18 Aug 2024 21:50:17 -0400 Subject: [PATCH] Attempt to fix project previews --- components/arcade/showcase/project-edit.js | 12 +++++++----- components/arcade/showcase/project-view.js | 2 +- .../arcade/showcase/project-view.module.css | 3 ++- .../showcase/projects/[projectID]/edit.js | 13 +++++-------- .../showcase/projects/[projectID]/index.js | 13 +++++++------ .../arcade/showcase/project/[projectID]/edit.js | 5 ++++- .../showcase/project/[projectID]/index.js | 17 ++++++++--------- 7 files changed, 34 insertions(+), 31 deletions(-) diff --git a/components/arcade/showcase/project-edit.js b/components/arcade/showcase/project-edit.js index e5dd3d9b..e49ffa8d 100644 --- a/components/arcade/showcase/project-edit.js +++ b/components/arcade/showcase/project-edit.js @@ -4,11 +4,11 @@ import useForm from '../../../lib/use-form' import Submit from '../../submit' import { useState } from 'react' import Icon from '@hackclub/icons' -import FileInput from '../../../pages/api/arcade/showcase/projects/[projectID]/file-input' +// import FileInput from '../../../pages/api/arcade/showcase/projects/[projectID]/file-input' /** @jsxImportSource theme-ui */ const ProjectEditForm = ({ project }) => { - const [previewProject, setPreviewProject] = useState(project) + // const [previewProject, setPreviewProject] = useState(project) const [screenshot, setScreenshot] = useState(project.screenshot) const [newScreenshot, setNewScreenshot] = useState('') @@ -17,11 +17,9 @@ const ProjectEditForm = ({ project }) => { function publishedChanges(e) { console.log('published changes', e) - - console.log(color) } const { status, formProps, useField, data } = useForm( - `/api/arcade/showcase/projects/${project.id}/edit`, + `/api/arcade/showcase/projects/${project.id}/edit/`, publishedChanges, { method: 'PATCH', @@ -63,6 +61,10 @@ const ProjectEditForm = ({ project }) => { setNewVideo(e.target.value) } + const previewProject = { + ...data + } + return ( - {screenshot.map((image, index) => ( + {imagesList.map((image, index) => (
({ url: i })) updatedFields['color'] = body.color updatedFields['textColor'] = body.textColor - updatedFields['ScreenshotLinks'] = body.screenshot - updatedFields['VideoLinks'] = body.video - - console.log(body.color) + updatedFields['ScreenshotLinks'] = JSON.stringify(body.screenshot || []) + updatedFields['VideoLinks'] = JSON.stringify(body.video || []) const airtable = new AirtablePlus({ apiKey: process.env.AIRTABLE_API_KEY, @@ -51,9 +49,8 @@ export default async function handler(req, res) { githubProf: project.fields['Github Profile'] || '', color: project.fields['color'] || '', textColor: project.fields['textColor'] || '', - screenshot: JSON.parse(p.fields['ScreenshotLinks']) || [], - video: JSON.parse(p.fields['VideoLinks']) || [], - + screenshot: project.fields['ScreenshotLinks'] || [], + video: project.fields['VideoLinks'] || [], } return res.status(200).json({ project: results }) diff --git a/pages/api/arcade/showcase/projects/[projectID]/index.js b/pages/api/arcade/showcase/projects/[projectID]/index.js index 0a202794..c2cbd395 100644 --- a/pages/api/arcade/showcase/projects/[projectID]/index.js +++ b/pages/api/arcade/showcase/projects/[projectID]/index.js @@ -15,18 +15,19 @@ export default async function handler(req, res) { const { projectID } = req.query - const project = await airtable.read({ + const projects = await airtable.read({ filterByFormula: `AND({User} = '${user.fields['Name']}', RECORD_ID() = '${projectID}')`, maxRecords: 1 }) + const p = projects[0] let screenshot - try { screenshot = JSON.parse(project.fields['ScreenshotLinks']) } catch { screenshot = [] } + try { screenshot = JSON.parse(p.fields['ScreenshotLinks']) } catch(e) { screenshot = [] } let video - try { video = JSON.parse(project.fields['VideoLinks']) } catch { video = [] } + try { video = JSON.parse(p.fields['VideoLinks']) } catch(e) { video = [] } - const results = project.map(p => ({ + const results = { id: p.id, title: p.fields['Name'] || '', desc: p.fields['Description'] || '', @@ -41,6 +42,6 @@ export default async function handler(req, res) { textColor: p.fields['textColor'] || '', screenshot, video, - })) - return res.status(200).json({ project: results[0] }) + } + return res.status(200).json({ project: results }) } diff --git a/pages/arcade/showcase/project/[projectID]/edit.js b/pages/arcade/showcase/project/[projectID]/edit.js index dcd6f513..fd1dbe3c 100644 --- a/pages/arcade/showcase/project/[projectID]/edit.js +++ b/pages/arcade/showcase/project/[projectID]/edit.js @@ -65,10 +65,13 @@ const Showcase = ({ projectID }) => { }) .then(res => res.json()) .then(data => { - setProject(data.project) if (data.error) { throw new Error(data.error) } + if (data.project === null) { + throw new Error('Project not found') + } + setProject(data.project) setStatus('success') }) .catch(e => { diff --git a/pages/arcade/showcase/project/[projectID]/index.js b/pages/arcade/showcase/project/[projectID]/index.js index 71725e6c..a415fb1b 100644 --- a/pages/arcade/showcase/project/[projectID]/index.js +++ b/pages/arcade/showcase/project/[projectID]/index.js @@ -82,16 +82,15 @@ const ProjectShowPage = ({ projectID }) => { }} />
- {/* { - status == 'loading' && - } + { + status == 'loading' && + } - { - status == 'error' && - } */} + { + status == 'error' && + } - {/* { - status == 'success' && */} + { status == 'success' && ( { screenshot={project.screenshot} video={project.video} /> - {/* } */} + )}