feat: deploying project to s3 via ui

.gitignore

@@ -1 +1,4 @@
-/node_modules
+/node_modules
+*test/
+*dist/
+*build/

core/actions/db/user.ts

@@ -1,4 +1,6 @@
 import { prisma } from "@/db";
+import { validateLogsZod } from "@/types/project";
+import { getServerSession } from "next-auth";
 
 export async function getUserIdByEmail(email: string) {
   if (!email) return undefined;
@@ -17,3 +19,55 @@ export async function getUserIdByEmail(email: string) {
     return undefined;
   }
 }
+
+export async function getProjects() {
+  const session = await getServerSession();
+  if (!session) throw new Error("Session not found");
+
+  const userId = await getUserIdByEmail(session.user.email);
+  if (!userId) throw new Error("User not found");
+
+  const projects = await prisma.project.findMany({
+    where: {
+      userId,
+    },
+    select: {
+      id: true,
+      name: true,
+      repoName: true,
+      repoOwner: true,
+      branch: true,
+      updatedAt: true,
+      slug: true,
+    },
+  });
+
+  return projects;
+}
+
+export async function getProjectDetails(projectId: string) {
+  const session = await getServerSession();
+  if (!session) throw new Error("Session not found");
+
+  const userId = await getUserIdByEmail(session.user.email);
+  if (!userId) throw new Error("User not found");
+
+  const project = await prisma.project.findFirst({
+    where: {
+      userId,
+      id: projectId,
+    },
+  });
+  if (!project) return null;
+
+  const validateLogs = validateLogsZod.safeParse(project.logs);
+  if (validateLogs.success)
+    return {
+      ...project,
+      logs: validateLogs.data,
+    };
+  return {
+    ...project,
+    logs: [],
+  };
+}

core/actions/gh/import.ts

@@ -19,22 +19,6 @@ export async function importProject(importProject: ImportProjectType) {
   const accessToken = await getAccessTokenByEmail(session.user.email);
   const slug = generateSlug();
 
-  if (redis) {
-    console.log({
-      ...importProject,
-      GITHUB_TOKEN: accessToken,
-    });
-    const res = await redis.lpush(
-      "project_import_queue",
-      JSON.stringify({
-        ...importProject,
-        GITHUB_TOKEN: accessToken,
-        projectSlug: slug,
-      }),
-    );
-    console.log(res);
-  }
-
   const user = await prisma.user.findUnique({
     where: {
       email: session.user.email,
@@ -78,7 +62,24 @@ export async function importProject(importProject: ImportProjectType) {
     }),
   );
 
+  if (redis) {
+    console.log({
+      ...importProject,
+      GITHUB_TOKEN: accessToken,
+    });
+    await redis.lpush(
+      "project_import_queue",
+      JSON.stringify({
+        ...importProject,
+        GITHUB_TOKEN: accessToken,
+        projectSlug: slug,
+        dbId: newProject.id,
+      }),
+    );
+  }
+
   return {
     success: true,
+    id: newProject.id,
   };
 }

core/app/dashboard/page.tsx

@@ -1,4 +1,4 @@
-import { getProjects } from "@/actions/user/project";
+import { getProjects } from "@/actions/db/user";
 import New from "@/app/new/page";
 import Projects from "@/components/Dashboard/Projects";
 import ProtectRouteUI from "@/components/ProtectRoute";
@@ -12,7 +12,20 @@ export default async function Dashboard() {
         <ProtectRouteUI />
       </div>
     );
-  const projects = await getProjects();
+
+  let projects: Awaited<ReturnType<typeof getProjects>> = [];
+  try {
+    projects = await getProjects();
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+  } catch (e: any) {
+    if (e.message === "User not found") {
+      return (
+        <div className="flex h-screen w-screen items-center justify-center">
+          <ProtectRouteUI />
+        </div>
+      );
+    }
+  }
 
   if (projects.length === 0) return <New />;
 

core/app/import/ImportButton.tsx

@@ -0,0 +1,24 @@
+"use client";
+
+import { Button } from "@/components/ui/button";
+import { importProject } from "@/actions/gh/import";
+import { ImportProjectType } from "@/types/project";
+import { useRouter } from "next/navigation";
+
+export default function ImportButton({
+  importProjectData,
+}: {
+  importProjectData: ImportProjectType;
+}) {
+  const router = useRouter();
+  async function handleImportProject() {
+    const { id } = await importProject(importProjectData);
+    if (id) router.push(`/project/${id}`);
+  }
+  return (
+    <Button className="w-full" onClick={handleImportProject}>
+      Deploy
+    </Button>
+  );
+}
+

core/app/project/[projectName]/page.tsx → core/app/project/[projectId]/page.tsx

@@ -1,13 +1,13 @@
-import { getProjectDetails } from "@/actions/user/project";
+import { getProjectDetails } from "@/actions/db/user";
 import ErroDiv from "@/components/ui/ErrorDiv";
 import ProtectRouteUI from "@/components/ProtectRoute";
 import { getServerSession } from "next-auth";
 import ProjectDetails from "@/components/ProjectDetails";
 
 export default async function ProjectDetailsPage({
-  projectName,
+  projectId,
 }: {
-  projectName: string;
+  projectId: string;
 }) {
   const session = await getServerSession();
   if (!session)
@@ -17,7 +17,18 @@ export default async function ProjectDetailsPage({
       </div>
     );
 
-  const project = await getProjectDetails(projectName);
+  let project: Awaited<ReturnType<typeof getProjectDetails>> = null;
+  try {
+    project = await getProjectDetails(projectId);
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+  } catch (e: any) {
+    console.log(e);
+    return (
+      <div className="flex h-screen w-screen items-center justify-center">
+        <ProtectRouteUI />
+      </div>
+    );
+  }
 
   if (!project) {
     return (

core/components/Dashboard/Project.tsx

@@ -8,7 +8,7 @@ import {
 } from "@/components/ui/card";
 import Link from "next/link";
 import { Button } from "@/components/ui/button";
-import { getProjects } from "@/actions/user/project";
+import { getProjects } from "@/actions/db/user";
 import { formatTimeAgo } from "@/lib/time";
 import { UpdateIcon } from "@radix-ui/react-icons";
 
@@ -26,7 +26,7 @@ export function Project({
         <div className="flex items-center text-sm text-muted-foreground">
           <GitFork className="mr-2 h-4 w-4" />
           <Link
-            href={`https://github.com/${project.repoOwner}/${project.repoName}`}
+            href={`https://github.com/${project.repoOwner}/${project.name}`}
             target="_blank"
             rel="noopener noreferrer"
             className="transition-colors hover:text-primary"
@@ -60,7 +60,7 @@ export function Project({
       </CardContent>
       <CardFooter>
         <Button asChild variant="outline" className="w-full">
-          <Link href={`/project/${project.name}`}>View Project</Link>
+          <Link href={`/project/${project.id}`}>View Project</Link>
         </Button>
       </CardFooter>
     </Card>

core/components/Dashboard/Projects.tsx

@@ -12,7 +12,7 @@ import {
   DropdownMenuTrigger,
 } from "@/components/ui/dropdown-menu";
 import { Project } from "@/components/Dashboard/Project";
-import { getProjects } from "@/actions/user/project";
+import { getProjects } from "@/actions/db/user";
 import { SORT_ORDER, VIEW_MODE } from "@/types/project";
 import { localValues } from "../../lib/localValues";
 

core/components/ImportProject/index.tsx

@@ -1,15 +1,14 @@
 "use client";
 
 import { Github } from "lucide-react";
-import { Button } from "@/components/ui/button";
 import { Input } from "@/components/ui/input";
 import Link from "next/link";
 import { ImportProjectType } from "@/types/project";
 import ChooseDir from "./ChooseDir";
 import BuilAndOutput from "./BuilAndOutput";
 import EnvironmentVariable from "./EnvironmentVariable";
 import ChooseBranch from "./ChooseBranch";
-import { importProject } from "@/actions/gh/import";
+import ImportButton from "@/app/import/ImportButton";
 
 export default function ImportProject({
   importProjectData,
@@ -18,11 +17,6 @@ export default function ImportProject({
   importProjectData: ImportProjectType;
   setImportProjectData: React.Dispatch<React.SetStateAction<ImportProjectType>>;
 }) {
-  async function handleImportProject() {
-    importProject(importProjectData);
-    console.log(importProjectData);
-  }
-
   return (
     <div className="flex h-full w-full flex-col items-center overflow-y-auto overflow-x-hidden bg-background pt-40 text-foreground">
       <main className="mx-auto max-w-6xl p-8 xl:w-[900px]">
@@ -105,9 +99,8 @@ export default function ImportProject({
                   importProjectData={importProjectData}
                   setImportProjectData={setImportProjectData}
                 />
-                <Button className="w-full" onClick={handleImportProject}>
-                  Deploy
-                </Button>
+
+                <ImportButton importProjectData={importProjectData} />
               </div>
             </div>
           </div>