minor fixes

diggerhq · Jul 26, 2024 · 3d288e8 · 3d288e8
1 parent 005e0c4
commit 3d288e8
Show file tree

Hide file tree

Showing 5 changed files with 38 additions and 29 deletions.
diff --git a/...]/(specific-project-pages)/RunDetails.tsx → ...pecific-project-pages)/AllRunsDetails.tsx b/...]/(specific-project-pages)/RunDetails.tsx → ...pecific-project-pages)/AllRunsDetails.tsx
@@ -3,9 +3,9 @@
 import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card";
 import { Tables } from "@/lib/database.types";
 import { motion } from "framer-motion";
-import { RunsTable } from "./RunsTable";
+import { AllRunsTable } from "./AllRunsTable";
 
-export default function RunsDetails({ runs, project }: { runs: Tables<'digger_runs'>[], project: Tables<'projects'> }) {
+export default function AllRunsDetails({ runs, project }: { runs: Tables<'digger_runs'>[], project: Tables<'projects'> }) {
     return (
         <motion.div
             initial={{ opacity: 0, y: 10 }}
@@ -32,7 +32,7 @@ export default function RunsDetails({ runs, project }: { runs: Tables<'digger_ru
                         animate={{ opacity: 1 }}
                         transition={{ duration: 0.15, delay: 0.2 }}
                     >
-                        <RunsTable runs={runs} projectSlug={project.slug} />
+                        <AllRunsTable runs={runs} projectSlug={project.slug} />
                     </motion.div>
                 </CardContent>
             </Card>

diff --git a/...g]/(specific-project-pages)/RunsTable.tsx → ...(specific-project-pages)/AllRunsTable.tsx b/...g]/(specific-project-pages)/RunsTable.tsx → ...(specific-project-pages)/AllRunsTable.tsx
@@ -4,26 +4,36 @@ import { AnimatePresence, motion } from "framer-motion";
 import { Activity } from "lucide-react";
 import moment from "moment";
 import Link from "next/link";
+import { runStageEnum } from "./enums";
 
 export type StatusColor = {
     [key: string]: string;
 };
 
+const statusOrder = [
+    runStageEnum.running,
+    runStageEnum.queued,
+    runStageEnum.pending_approval,
+    runStageEnum.pending_apply,
+    runStageEnum.succeeded,
+    runStageEnum.rejected,
+    runStageEnum.failed
+];
+
 export const statusColors: StatusColor = {
     queued: 'bg-yellow-200/50 text-yellow-800 dark:bg-yellow-900/50 dark:text-yellow-200',
-    'pending_approval': 'bg-blue-200/50 text-blue-800 dark:bg-blue-900/50 dark:text-blue-200',
+    pending_approval: 'bg-blue-200/50 text-blue-800 dark:bg-blue-900/50 dark:text-blue-200',
     running: 'bg-purple-200/50 text-purple-800 dark:bg-purple-900/50 dark:text-purple-200',
-    approved: 'bg-green-200/50 text-green-800 dark:bg-green-900/50 dark:text-green-200',
+    pending_apply: 'bg-green-200/50 text-green-800 dark:bg-green-900/50 dark:text-green-200',
     succeeded: 'bg-green-200/50 text-green-800 dark:bg-green-900/50 dark:text-green-200',
     failed: 'bg-red-200/50 text-red-800 dark:bg-red-900/50 dark:text-red-200',
 };
 
-const statusOrder = ['running', 'queued', 'pending_approval', 'approved', 'succeeded', 'failed'];
 
-export const RunsTable = ({ runs, projectSlug }: { runs: Tables<'digger_runs'>[], projectSlug: string }) => {
+export const AllRunsTable = ({ runs, projectSlug }: { runs: Tables<'digger_runs'>[], projectSlug: string }) => {
     const sortedRuns = [...runs].sort((a, b) => {
-        const statusA = statusOrder.indexOf(a.status.toLowerCase());
-        const statusB = statusOrder.indexOf(b.status.toLowerCase());
+        const statusA = statusOrder.indexOf(a.status.toLowerCase() as runStageEnum);
+        const statusB = statusOrder.indexOf(b.status.toLowerCase() as runStageEnum);
         if (statusA !== statusB) return statusA - statusB;
         return moment(b.created_at).valueOf() - moment(a.created_at).valueOf();
     });

diff --git a/...icated-pages)/(application-pages)/project/[projectSlug]/(specific-project-pages)/enums.ts b/...icated-pages)/(application-pages)/project/[projectSlug]/(specific-project-pages)/enums.ts
@@ -0,0 +1,9 @@
+export enum runStageEnum {
+  running = 'running',
+  queued = 'queued',
+  pending_approval = 'pending_approval',
+  pending_apply = 'pending_apply',
+  succeeded = 'succeeded',
+  rejected = 'rejected',
+  failed = 'failed',
+}
diff --git a/...icated-pages)/(application-pages)/project/[projectSlug]/(specific-project-pages)/page.tsx b/...icated-pages)/(application-pages)/project/[projectSlug]/(specific-project-pages)/page.tsx
@@ -24,7 +24,7 @@ export async function generateMetadata({
 
 
 import { getRunsByProjectId } from "@/data/user/runs";
-import RunDetails from "./RunDetails";
+import AllRunsDetails from "./AllRunsDetails";
 
 // const dummyRuns: Run[] = [
 //   {
@@ -96,7 +96,7 @@ export default async function ProjectPage({ params }: { params: unknown }) {
 
   return (
     <div className="flex flex-col space-y-4 max-w-5xl mt-2">
-      <RunDetails
+      <AllRunsDetails
         project={project}
         runs={runs}
       />

diff --git a/...cated-pages)/(application-pages)/project/[projectSlug]/runs/[runId]/ProjectRunDetails.tsx b/...cated-pages)/(application-pages)/project/[projectSlug]/runs/[runId]/ProjectRunDetails.tsx
@@ -13,9 +13,7 @@ import { CheckCircle2, Clock, GitPullRequest, Loader2, Play, XCircle } from 'luc
 import Image from 'next/image';
 import { useRouter } from 'next/navigation';
 import React, { useEffect, useState } from 'react';
-import { statusColors } from "../../(specific-project-pages)/RunsTable";
-
-type RunStage = 'pending_approval' | 'pending_apply' | 'rejected' | 'applied';
+import { statusColors } from "../../(specific-project-pages)/AllRunsTable";
 
 
 const logEntries = [
@@ -75,7 +73,6 @@ const logEntries = [
     { time: "2024-07-27T14:33:29Z", author: "Siddharth Ponnapalli", title: "Configured EC2 instance user data for automation" }
 ];
 
-
 function RenderContent({
     activeStage,
     run,
@@ -128,12 +125,11 @@ export const ProjectRunDetails: React.FC<{
 }> = ({ run, loggedInUser, isUserOrgAdmin }) => {
     const router = useRouter();
     const [activeStage, setActiveStage] = useState<'plan' | 'apply'>('plan');
-    const [applyLogs, setApplyLogs] = useState<string[]>([]);
 
     useEffect(() => {
         if (run.status === 'pending_apply') {
             const timer = setTimeout(async () => {
-                await changeRunStatus(run.id, 'applied');
+                await changeRunStatus(run.id, 'succeeded');
                 setActiveStage('apply');
                 router.refresh();
             }, 5000);
@@ -142,12 +138,6 @@ export const ProjectRunDetails: React.FC<{
         }
     }, [run.status, run.id, router]);
 
-    useEffect(() => {
-        if (run.apply_logs) {
-            setApplyLogs(run.apply_logs.split('\n'));
-        }
-    }, [run.apply_logs]);
-
     const { mutate: approveMutation, isLoading: isApproving } = useSAToastMutation(
         async () => await approveRun(run.id, loggedInUser.id),
         {
@@ -199,7 +189,7 @@ export const ProjectRunDetails: React.FC<{
                 </CardContent>
 
                 <div className="space-y-2 flex-grow pt-8">
-                    <RunStage
+                    <RunStageSidebarItem
                         icon={<GitPullRequest />}
                         name="Plan"
                         isActive={activeStage === 'plan'}
@@ -221,11 +211,11 @@ export const ProjectRunDetails: React.FC<{
                             </CardContent>
                         </Card>
                     )}
-                    <RunStage
+                    <RunStageSidebarItem
                         icon={<Play />}
                         name="Apply"
                         isActive={activeStage === 'apply'}
-                        isComplete={run.status === 'applied'}
+                        isComplete={run.status === 'succeeded'}
                         isDisabled={run.status === 'pending_approval' || run.status === 'rejected'}
                         onClick={() => setActiveStage('apply')}
                     />
@@ -242,13 +232,13 @@ export const ProjectRunDetails: React.FC<{
                         </motion.div>
                     )}
                 </div>
-                {run.is_approved && run.status !== 'rejected' || 'pending_approval' && (
+                {run.status === 'succeeded' && (
                     <T.Small className="flex items-center"><CheckCircle2 className="size-5 text-green-500 mr-2" /> Approved by: </T.Small>
                 )}
                 {run.status === 'rejected' && (
                     <p className="flex items-center"><XCircle className="text-red-500 mr-2" /> Rejected by: </p>
                 )}
-                {(run.status === 'pending_apply' || run.status === 'applied' || run.status === 'rejected') && (
+                {(run.status === 'succeeded' || run.status === 'rejected') && (
                     <motion.div
                         className="pt-4 mt-auto"
                         initial={{ opacity: 0, y: 50 }}
@@ -312,7 +302,7 @@ export const ProjectRunDetails: React.FC<{
     );
 };
 
-const RunStage: React.FC<{
+const RunStageSidebarItem: React.FC<{
     icon: React.ReactNode,
     name: string,
     isActive: boolean,