From 88b7064b66e03e465ed733a5b9284a8493370415 Mon Sep 17 00:00:00 2001
From: Austin Chen <akrolsmir@gmail.com>
Date: Thu, 6 Oct 2022 11:17:57 -0400
Subject: [PATCH] Clean up dream

---
 web/components/editor/image-modal.tsx | 58 +++++++++++++--------------
 web/pages/api/v0/dream.ts             | 10 ++---
 2 files changed, 32 insertions(+), 36 deletions(-)

diff --git a/web/components/editor/image-modal.tsx b/web/components/editor/image-modal.tsx
index bef785f0..cf1c8346 100644
--- a/web/components/editor/image-modal.tsx
+++ b/web/components/editor/image-modal.tsx
@@ -22,35 +22,32 @@ export function ImageModal(props: {
   const { upload, open, setOpen } = props
   return (
     <Modal open={open} setOpen={setOpen}>
-      <Col className="gap-2 rounded bg-white p-6">
-        <Tabs
-          tabs={[
-            {
-              title: 'Upload file',
-              content: (
-                <Col>
-                  <FileUploadButton
-                    onFiles={(files) => {
-                      setOpen(false)
-                      upload.mutate(files)
-                    }}
-                    className="relative block w-full rounded-lg border-2 border-dashed border-gray-300 p-12 text-center hover:border-gray-400 focus:outline-none focus:ring-2 focus:ring-indigo-500 focus:ring-offset-2"
-                  >
-                    <UploadIcon className="mx-auto h-12 w-12 text-gray-400" />
-                    <span className="mt-2 block text-sm font-medium text-gray-400">
-                      Upload an image file
-                    </span>
-                  </FileUploadButton>
-                </Col>
-              ),
-            },
-            {
-              title: 'Dream',
-              content: <DreamTab {...props} />,
-            },
-          ]}
-        />
-      </Col>
+      <Tabs
+        className="gap-2 rounded bg-white p-6"
+        tabs={[
+          {
+            title: 'Upload file',
+            content: (
+              <FileUploadButton
+                onFiles={(files) => {
+                  setOpen(false)
+                  upload.mutate(files)
+                }}
+                className="relative block w-full rounded-lg border-2 border-dashed border-gray-300 p-12 text-center hover:border-gray-400 focus:outline-none focus:ring-2 focus:ring-indigo-500 focus:ring-offset-2"
+              >
+                <UploadIcon className="mx-auto h-12 w-12 text-gray-400" />
+                <span className="mt-2 block text-sm font-medium text-gray-400">
+                  Upload an image file
+                </span>
+              </FileUploadButton>
+            ),
+          },
+          {
+            title: 'Dream',
+            content: <DreamTab {...props} />,
+          },
+        ]}
+      />
     </Modal>
   )
 }
@@ -85,7 +82,7 @@ function DreamTab(props: {
       apiKey: API_KEY,
     }
     const headers = {
-      'api-key': 'quickstart-QUdJIGlzIGNvbWluZy4uLi4K',
+      'Content-Type': 'application/json',
     }
     const response = await fetch(url, {
       method: 'POST',
@@ -128,7 +125,6 @@ function DreamTab(props: {
       {/* Show the current imageUrl */}
       {imageUrl && (
         <>
-          {' '}
           <img src={imageUrl} alt="Image" />
           <Row className="gap-2">
             <Button
diff --git a/web/pages/api/v0/dream.ts b/web/pages/api/v0/dream.ts
index 2bee6c0e..6b809a81 100644
--- a/web/pages/api/v0/dream.ts
+++ b/web/pages/api/v0/dream.ts
@@ -18,13 +18,13 @@ export default async function route(req: NextApiRequest, res: NextApiResponse) {
     methods: 'POST',
   })
 
-  const body = JSON.parse(req.body)
+  // const body = JSON.parse(req.body)
   // Check that prompt and apiKey are included in the body
-  if (!body.prompt) {
+  if (!req.body.prompt) {
     res.status(400).json({ message: 'Missing prompt' })
     return
   }
-  if (!body.apiKey) {
+  if (!req.body.apiKey) {
     res.status(400).json({ message: 'Missing apiKey' })
     return
   }
@@ -50,7 +50,7 @@ export default async function route(req: NextApiRequest, res: NextApiResponse) {
     // eslint-disable-next-line @typescript-eslint/ban-ts-comment
     // @ts-ignore
     const { _dreamResponse, images } = await generateAsync({
-      ...body,
+      ...req.body,
       // Don't actually write to disk, because we're going to upload it to Firestore
       noStore: true,
     })
@@ -59,7 +59,7 @@ export default async function route(req: NextApiRequest, res: NextApiResponse) {
 
     res.status(200).json({ url })
   } catch (e) {
-    res.status(501).json({ message: `Error running code: ${e}` })
+    res.status(500).json({ message: `Error running code: ${e}` })
   }
 }