small changes

backend/database/src/index.ts

@@ -222,6 +222,13 @@ export default {
 
 				const res = await db.insert(user).values({ id, name, email }).returning().get();
 				return json({ res });
+			} else if (method === "DELETE") {
+				const params = url.searchParams;
+				if (params.has("id")) {
+					const id = params.get("id") as string;
+					await db.delete(user).where(eq(user.id, id));
+					return success;
+				} else return invalidRequest;
 			} else {
 				return methodNotAllowed;
 			}

frontend/app/globals.css

@@ -76,19 +76,31 @@
 }
 
 .gradient-button-bg {
-  background: radial-gradient(circle at top, #a5b4fc 0%, #3730a3 50%); /* violet 300 -> 800 */
+  background: radial-gradient(
+    circle at top,
+    #a5b4fc 0%,
+    #3730a3 50%
+  ); /* violet 300 -> 800 */
 }
 
 .gradient-button {
-  background: radial-gradient(circle at bottom, #312e81 -10%, hsl(0 0% 3.9%) 50%); /* violet 900 -> bg */
+  background: radial-gradient(
+    circle at bottom,
+    #312e81 -10%,
+    hsl(0 0% 3.9%) 50%
+  ); /* violet 900 -> bg */
 }
 
 .gradient-button-bg > div:hover {
-  background: radial-gradient(circle at bottom, #312e81 -10%, hsl(0 0% 3.9%) 80%); /* violet 900 -> bg */
+  background: radial-gradient(
+    circle at bottom,
+    #312e81 -10%,
+    hsl(0 0% 3.9%) 80%
+  ); /* violet 900 -> bg */
 }
 
 .inline-decoration::before {
-  content: 'Generate';
+  content: "Generate";
   color: #525252;
   /* border: 1px solid #525252; */
   /* padding: 2px 4px; */
@@ -96,7 +108,7 @@
   margin-left: 36px;
 }
 .inline-decoration::after {
-  content: '⌘G';
+  content: "⌘G";
   color: #525252;
   border: 1px solid #525252;
   border-bottom-width: 2px;

frontend/app/page.tsx

@@ -1,62 +1,13 @@
-import Image from "next/image"
+import { currentUser } from "@clerk/nextjs";
-import Logo from "@/assets/logo.svg"
+import { redirect } from "next/navigation";
-import XLogo from "@/assets/x.svg"
+import Landing from "@/components/landing";
-import Button from "@/components/ui/customButton"
-import { ChevronRight } from "lucide-react"
-import Link from "next/link"
-import { currentUser } from "@clerk/nextjs"
-import { redirect } from "next/navigation"
 
 export default async function Home() {
-  const user = await currentUser()
+  const user = await currentUser();
 
   if (user) {
-    redirect("/dashboard")
+    redirect("/dashboard");
   }
 
-  return (
+  return <Landing />;
-    <div className="w-screen h-screen flex justify-center overflow-hidden overscroll-none">
-      <div className="w-full max-w-screen-md px-8 flex flex-col items-center">
-        <div className="w-full flex items-center justify-between py-8">
-          <div className="flex items-center font-medium">
-            <Image
-              src={Logo}
-              alt="Logo"
-              width={36}
-              height={36}
-              className="mr-2"
-            />
-          </div>
-          <div className="flex items-center space-x-4">
-            <a href="https://www.x.com/ishaandey_" target="_blank">
-              <Image src={XLogo} alt="X Logo" width={18} height={18} />
-            </a>
-          </div>
-        </div>
-        <h1 className="text-2xl font-medium text-center mt-16">
-          A Collaborative, AI-Powered, Auto-Scaling Code Editor
-        </h1>
-        <div className="text-muted-foreground mt-4 text-center ">
-          Sandbox is an open-source cloud-based code editing environment with
-          custom AI code autocompletion and real-time collaboration. The
-          infrastructure runs on Docker and Kubernetes to scale automatically
-          based on resource usage.
-        </div>
-        <div className="mt-8 flex space-x-4">
-          <Link href="/sign-up">
-            <Button>Go To App</Button>
-          </Link>
-          <a
-            href="https://github.com/ishaan1013/sandbox"
-            target="_blank"
-            className="group h-9 px-4 py-2 inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50"
-          >
-            GitHub Repository
-            <ChevronRight className="h-4 w-4 ml-1 transition-all group-hover:translate-x-1" />
-          </a>
-        </div>
-        <div className="aspect-video w-full rounded-lg bg-neutral-800 mt-12"></div>
-      </div>
-    </div>
-  )
 }

frontend/components/dashboard/about.tsx

@@ -1,4 +1,4 @@
-"use client"
+"use client";
 
 import {
   Dialog,
@@ -7,19 +7,19 @@ import {
   DialogHeader,
   DialogTitle,
   DialogTrigger,
-} from "@/components/ui/dialog"
+} from "@/components/ui/dialog";
-import Image from "next/image"
+import Image from "next/image";
-import { useState } from "react"
+import { useState } from "react";
 
-import { Button } from "../ui/button"
+import { Button } from "../ui/button";
-import { ChevronRight } from "lucide-react"
+import { ChevronRight } from "lucide-react";
 
 export default function AboutModal({
   open,
   setOpen,
 }: {
-  open: boolean
+  open: boolean;
-  setOpen: (open: boolean) => void
+  setOpen: (open: boolean) => void;
 }) {
   return (
     <Dialog open={open} onOpenChange={setOpen}>
@@ -30,10 +30,10 @@ export default function AboutModal({
         <div className="text-sm text-muted-foreground">
           Sandbox is an open-source cloud-based code editing environment with
           custom AI code autocompletion and real-time collaboration. The
-          infrastructure runs on Docker and Kubernetes to scale automatically
+          infrastructure runs on Docker and AWS ECS to scale automatically based
-          based on resource usage.
+          on resource usage.
         </div>
       </DialogContent>
     </Dialog>
-  )
+  );
 }

frontend/components/dashboard/index.tsx

@@ -117,7 +117,11 @@ export default function Dashboard({
           </div>
         </div>
         {screen === "projects" ? (
-          <DashboardProjects sandboxes={sandboxes} q={q} />
+          <>
+            {sandboxes ? (
+              <DashboardProjects sandboxes={sandboxes} q={q} />
+            ) : null}
+          </>
         ) : screen === "shared" ? (
           <DashboardSharedWithMe shared={shared} />
         ) : screen === "settings" ? null : null}

frontend/components/landing/index.tsx

@@ -0,0 +1,54 @@
+import Image from "next/image";
+import Logo from "@/assets/logo.svg";
+import XLogo from "@/assets/x.svg";
+import Button from "@/components/ui/customButton";
+import { ChevronRight } from "lucide-react";
+import Link from "next/link";
+
+export default function Landing() {
+  return (
+    <div className="w-screen h-screen flex justify-center overflow-hidden overscroll-none">
+      <div className="w-full max-w-screen-md px-8 flex flex-col items-center relative">
+        <div className="w-full flex items-center justify-between py-8">
+          <div className="flex items-center font-medium">
+            <Image
+              src={Logo}
+              alt="Logo"
+              width={36}
+              height={36}
+              className="mr-2"
+            />
+          </div>
+          <div className="flex items-center space-x-4">
+            <a href="https://www.x.com/ishaandey_" target="_blank">
+              <Image src={XLogo} alt="X Logo" width={18} height={18} />
+            </a>
+          </div>
+        </div>
+        <h1 className="text-2xl font-medium text-center mt-16">
+          A Collaborative, AI-Powered, Auto-Scaling Code Editor
+        </h1>
+        <div className="text-muted-foreground mt-4 text-center ">
+          Sandbox is an open-source cloud-based code editing environment with
+          custom AI code autocompletion and real-time collaboration. The
+          infrastructure runs on Docker and AWS ECS to scale automatically based
+          on resource usage.
+        </div>
+        <div className="mt-8 flex space-x-4">
+          <Link href="/sign-up">
+            <Button>Go To App</Button>
+          </Link>
+          <a
+            href="https://github.com/ishaan1013/sandbox"
+            target="_blank"
+            className="group h-9 px-4 py-2 inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50"
+          >
+            GitHub Repository
+            <ChevronRight className="h-4 w-4 ml-1 transition-all group-hover:translate-x-1" />
+          </a>
+        </div>
+        <div className="aspect-video w-full rounded-lg bg-neutral-800 mt-12"></div>
+      </div>
+    </div>
+  );
+}