new workflow page and few changes

radityaharya · May 3, 2024 · a2727e4 · a2727e4
1 parent 0e9c0ab
commit a2727e4
Show file tree

Hide file tree

Showing 15 changed files with 875 additions and 44 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -55,6 +55,7 @@
     "console-feed": "^3.6.0",
     "date-fns": "^3.6.0",
     "drizzle-orm": "latest",
+    "html-to-image": "^1.11.11",
     "ioredis": "^5.4.1",
     "lodash": "^4.17.21",
     "lucide-react": "^0.371.0",
@@ -100,7 +101,7 @@
     "@typescript-eslint/parser": "^7.2.0",
     "autoprefixer": "^10.4.18",
     "dotenv-cli": "^7.4.1",
-    "drizzle-kit": "^0.20.14",
+    "drizzle-kit": "^0.20.17",
     "eslint": "^8.57.0",
     "express": "^4.19.2",
     "postcss": "^8.4.35",

diff --git a/src/app/api/user/[uid]/workflows/route.ts b/src/app/api/user/[uid]/workflows/route.ts
@@ -1,8 +1,10 @@
 import { Logger } from "@/lib/log";
 import { authOptions } from "@/server/auth";
 import { db } from "@/server/db";
+import Redis from "ioredis";
 import { getServerSession } from "next-auth";
 import { type NextRequest, NextResponse } from "next/server";
+import { env } from "~/env";
 
 const log = new Logger("/api/workflow/[id]");
 
@@ -16,27 +18,73 @@ export async function GET(
 ) {
   const session = (await getServerSession({ req: request, ...authOptions }))!;
 
+  let redis: Redis | null = null;
+  try {
+    redis = new Redis(env.REDIS_URL, {
+      maxRetriesPerRequest: null,
+    });
+  } catch (error) {
+    log.error("Failed to connect to Redis", error);
+  }
+
+  let cachedData;
+  if (redis) {
+    cachedData = await redis.get(`api:workflows:${session.user.id}`);
+    if (cachedData) {
+      return NextResponse.json(JSON.parse(cachedData), {
+        headers: {
+          "X-Cache": "HIT",
+        },
+      });
+    }
+  }
+
   const workflows = await db.query.workflowJobs.findMany({
-    where: (workflowJobs, { eq }) => eq(workflowJobs.userId, session.user.id),
+    where: (workflowJobs, { eq, or, isNull }) =>
+      eq(workflowJobs.userId, session.user.id) &&
+      or(isNull(workflowJobs.deleted), eq(workflowJobs.deleted, false)),
     with: {
-      workflowRuns: true,
+      workflowRuns: {
+        columns: {
+          id: true,
+          status: true,
+          startedAt: true,
+          returnValues: false,
+          completedAt: true,
+          error: true,
+        },
+      },
     },
   });
 
   if (!workflows.length) {
     return NextResponse.json([], { status: 200 });
   }
 
-  const res = workflows.map(
-    ({ id, cron, workflow, createdAt, workflowRuns }) => ({
+  const res = await Promise.all(
+    workflows.map(async ({ id, cron, workflow, createdAt, workflowRuns }) => ({
       id,
       cron,
       workflow: workflow && JSON.parse(workflow),
       createdAt: createdAt?.getTime(),
       lastRunAt: workflowRuns[0]?.startedAt?.getTime(),
-    }),
-  ) as Workflow.WorkflowResponse[];
+      runs: workflowRuns
+    })),
+  );
+
+  if (redis) {
+    await redis.set(
+      `api:workflows:${session.user.id}`,
+      JSON.stringify(res),
+      "EX",
+      5,
+    );
+  }
 
   log.info(`Returning workflows for user ${session.user.id}`);
-  return NextResponse.json(res);
+  return NextResponse.json(res, {
+    headers: {
+      "X-Cache": "MISS",
+    },
+  });
 }
diff --git a/src/app/layout.tsx b/src/app/layout.tsx
@@ -4,6 +4,9 @@ import { Toaster } from "@/components/ui/sonner";
 import { Inter } from "next/font/google";
 import { SiteNav } from "~/components/main-nav";
 import NextAuthProvider from "~/providers/NextAuthProvider";
+import SWRCacheProvider from "~/providers/SWRCacheProvider";
+import { getServerSession } from 'next-auth';
+
 const inter = Inter({
   subsets: ["latin"],
   variable: "--font-sans",
@@ -16,18 +19,23 @@ export const metadata = {
   icons: [{ rel: "icon", url: "/favicon.ico" }],
 };
 
-export default function RootLayout({
+export default async function RootLayout({
   children,
 }: {
   children: React.ReactNode;
 }) {
+
+  const session = await getServerSession();
+
   return (
     <html lang="en">
       <body className={`font-sans ${inter.variable} dark`}>
         <NextAuthProvider>
-          <SiteNav />
-          {children}
-          <Toaster expand={true} richColors />
+          <SWRCacheProvider>
+            <SiteNav session={session} />
+            {children}
+            <Toaster expand={true} richColors />
+          </SWRCacheProvider>
         </NextAuthProvider>
       </body>
     </html>

diff --git a/src/app/utils/saveWorkflow.ts b/src/app/utils/saveWorkflow.ts
@@ -21,7 +21,7 @@ export async function saveWorkflow() {
 
   toast.promise(responsePromise, {
     loading: "Saving workflow...",
-    success: (_data) => `${workflow.name} saved successfully`,
+    success: (_data) => `${workflow.workflow.name} saved successfully`,
     error: "Error saving workflow",
   });