Merge branch 'main' into refactor/email-whitelisting

Author: Kritik-J

.changeset/orange-eggs-fold.md

@@ -117,6 +117,7 @@ export function RunOverview({ run, trigger, showRerun, paths, currentUser }: Run
             {showRerun && run.isFinished && (
               <RerunPopover
                 runId={run.id}
+                runPath={paths.run}
                 runsPath={paths.runsPath}
                 environmentType={run.environment.type}
                 status={run.basicStatus}
@@ -317,18 +318,20 @@ function BlankTasks({ status }: { status: RunBasicStatus }) {
 
 function RerunPopover({
   runId,
+  runPath,
   runsPath,
   environmentType,
   status,
 }: {
   runId: string;
+  runPath: string;
   runsPath: string;
   environmentType: RuntimeEnvironmentType;
   status: RunBasicStatus;
 }) {
   const lastSubmission = useActionData();
 
-  const [form, { successRedirect }] = useForm({
+  const [form, { successRedirect, failureRedirect }] = useForm({
     id: "rerun",
     // TODO: type this
     lastSubmission: lastSubmission as any,
@@ -347,6 +350,7 @@ function RerunPopover({
       <PopoverContent className="flex min-w-[20rem] max-w-[20rem] flex-col gap-2 p-0" align="end">
         <Form method="post" action={`/resources/runs/${runId}/rerun`} {...form.props}>
           <input {...conform.input(successRedirect, { type: "hidden" })} defaultValue={runsPath} />
+          <input {...conform.input(failureRedirect, { type: "hidden" })} defaultValue={runPath} />
           {environmentType === "PRODUCTION" && (
             <div className="px-4 pt-4">
               <Callout variant="warning">

apps/webapp/app/components/run/RunOverview.tsx

@@ -77,11 +77,11 @@ export function RunsTable({
       <TableBody>
         {total === 0 && !hasFilters ? (
           <TableBlankRow colSpan={showJob ? 10 : 9}>
-            <NoRuns title="No runs found" />
+            {!isLoading && <NoRuns title="No runs found" />}
           </TableBlankRow>
         ) : runs.length === 0 ? (
           <TableBlankRow colSpan={showJob ? 10 : 9}>
-            <NoRuns title="No runs match your filters" />
+            {!isLoading && <NoRuns title="No runs match your filters" />}
           </TableBlankRow>
         ) : (
           runs.map((run) => {

apps/webapp/app/components/runs/RunsTable.tsx

@@ -38,7 +38,7 @@ export type ClientEndpoint =
       state: "configured";
       id: string;
       slug: string;
-      url: string;
+      url: string | null;
       indexWebhookPath: string;
       latestIndex?: {
         status: EndpointIndexStatus;
@@ -102,6 +102,11 @@ export class EnvironmentsPresenter {
               },
             },
           },
+          where: {
+            url: {
+              not: null,
+            },
+          },
         },
       },
       where: {

apps/webapp/app/presenters/EnvironmentsPresenter.server.ts

@@ -9,6 +9,7 @@ import { Project } from "~/models/project.server";
 import { User } from "~/models/user.server";
 import { z } from "zod";
 import { projectPath } from "~/utils/pathBuilder";
+import { JobRunStatus } from "@trigger.dev/database";
 
 export type ProjectJob = Awaited<ReturnType<JobListPresenter["call"]>>[0];
 
@@ -43,14 +44,6 @@ export class JobListPresenter {
         id: true,
         slug: true,
         title: true,
-        runs: {
-          select: {
-            createdAt: true,
-            status: true,
-          },
-          take: 1,
-          orderBy: [{ createdAt: "desc" }],
-        },
         integrations: {
           select: {
             key: true,
@@ -105,6 +98,37 @@ export class JobListPresenter {
       orderBy: [{ title: "asc" }],
     });
 
+    let latestRuns = [] as {
+      createdAt: Date;
+      status: JobRunStatus;
+      jobId: string;
+      rn: BigInt;
+    }[];
+
+    if (jobs.length > 0) {
+      latestRuns = await this.#prismaClient.$queryRaw<
+        {
+          createdAt: Date;
+          status: JobRunStatus;
+          jobId: string;
+          rn: BigInt;
+        }[]
+      >`
+        SELECT * FROM (
+          SELECT 
+              "id", 
+              "createdAt", 
+              "status", 
+              "jobId",
+              ROW_NUMBER() OVER(PARTITION BY "jobId" ORDER BY "createdAt" DESC) as rn
+          FROM 
+              "public"."JobRun" 
+          WHERE 
+              "jobId" IN (${Prisma.join(jobs.map((j) => j.id))})
+      ) t
+      WHERE rn = 1;`;
+    }
+
     return jobs
       .flatMap((job) => {
         const version = job.versions.at(0);
@@ -132,6 +156,8 @@ export class JobListPresenter {
           properties = [...properties, ...versionProperties];
         }
 
+        const latestRun = latestRuns.find((r) => r.jobId === job.id);
+
         return [
           {
             id: job.id,
@@ -155,7 +181,7 @@ export class JobListPresenter {
               (i) => i.setupStatus === "MISSING_FIELDS"
             ),
             environment: version.environment,
-            lastRun: job.runs.at(0),
+            lastRun: latestRun,
             properties,
             projectSlug: job.project.slug,
           },

apps/webapp/app/presenters/JobListPresenter.server.ts

@@ -111,7 +111,7 @@ export function ConfigureEndpointSheet({ slug, endpoint, onClose }: ConfigureEnd
                 <Input
                   className="rounded-r-none"
                   {...conform.input(url, { type: "url" })}
-                  defaultValue={"url" in endpoint ? endpoint.url : ""}
+                  defaultValue={"url" in endpoint ? endpoint.url ?? "" : ""}
                   placeholder="URL for your Trigger API route"
                 />
                 <Button

apps/webapp/app/routes/_app.orgs.$organizationSlug.projects.$projectParam.environments/ConfigureEndpointSheet.tsx

@@ -5,8 +5,8 @@ import { cn } from "~/utils/cn";
 
 type List = {
   pagination: {
-    next: string | undefined;
-    previous: string | undefined;
+    next?: string | undefined;
+    previous?: string | undefined;
   };
 };
 

apps/webapp/app/routes/_app.orgs.$organizationSlug.projects.$projectParam.jobs.$jobParam._index/ListPagination.tsx

@@ -1,5 +1,5 @@
-import { useLocation, useNavigate, useNavigation } from "@remix-run/react";
-import { LoaderFunctionArgs } from "@remix-run/server-runtime";
+import { Await, useLoaderData, useLocation, useNavigate, useNavigation } from "@remix-run/react";
+import { LoaderFunctionArgs, defer } from "@remix-run/server-runtime";
 import { typedjson, useTypedLoaderData } from "remix-typedjson";
 import { PageBody, PageContainer } from "~/components/layout/AppLayout";
 import { LinkButton } from "~/components/primitives/Buttons";
@@ -20,6 +20,8 @@ import { ProjectParamSchema, docsPath, projectPath } from "~/utils/pathBuilder";
 import { ListPagination } from "../_app.orgs.$organizationSlug.projects.$projectParam.jobs.$jobParam._index/ListPagination";
 import { RunListSearchSchema } from "~/components/runs/RunStatuses";
 import { RunsFilters } from "~/components/runs/RunFilters";
+import { Suspense } from "react";
+import { Spinner } from "~/components/primitives/Spinner";
 
 export const loader = async ({ request, params }: LoaderFunctionArgs) => {
   const userId = await requireUserId(request);
@@ -31,7 +33,7 @@ export const loader = async ({ request, params }: LoaderFunctionArgs) => {
 
   const presenter = new RunListPresenter();
 
-  const list = await presenter.call({
+  const list = presenter.call({
     userId,
     filterEnvironment: searchParams.environment,
     filterStatus: searchParams.status,
@@ -44,13 +46,13 @@ export const loader = async ({ request, params }: LoaderFunctionArgs) => {
     to: searchParams.to,
   });
 
-  return typedjson({
+  return defer({
     list,
   });
 };
 
 export default function Page() {
-  const { list } = useTypedLoaderData<typeof loader>();
+  const { list } = useLoaderData<typeof loader>();
   const navigation = useNavigation();
   const isLoading = navigation.state !== "idle";
   const organization = useOrganization();
@@ -79,18 +81,49 @@ export default function Page() {
         <div className="h-full overflow-y-auto p-4 scrollbar-thin scrollbar-track-transparent scrollbar-thumb-slate-700">
           <div className="mb-2 flex items-center justify-between gap-x-2">
             <RunsFilters />
-            <ListPagination list={list} />
+            <Suspense fallback={<></>}>
+              <Await resolve={list}>{(data) => <ListPagination list={data} />}</Await>
+            </Suspense>
           </div>
-          <RunsTable
-            total={list.runs.length}
-            hasFilters={false}
-            showJob={true}
-            runs={list.runs}
-            isLoading={isLoading}
-            runsParentPath={projectPath(organization, project)}
-            currentUser={user}
-          />
-          <ListPagination list={list} className="mt-2 justify-end" />
+          <Suspense
+            fallback={
+              <RunsTable
+                total={0}
+                hasFilters={false}
+                showJob={true}
+                runs={[]}
+                isLoading={true}
+                runsParentPath={projectPath(organization, project)}
+                currentUser={user}
+              />
+            }
+          >
+            <Await resolve={list}>
+              {(data) => {
+                const runs = data.runs.map((run) => ({
+                  ...run,
+                  startedAt: run.startedAt ? new Date(run.startedAt) : null,
+                  completedAt: run.completedAt ? new Date(run.completedAt) : null,
+                  createdAt: new Date(run.createdAt),
+                }));
+
+                return (
+                  <>
+                    <RunsTable
+                      total={data.runs.length}
+                      hasFilters={false}
+                      showJob={true}
+                      runs={runs}
+                      isLoading={isLoading}
+                      runsParentPath={projectPath(organization, project)}
+                      currentUser={user}
+                    />
+                    <ListPagination list={data} className="mt-2 justify-end" />
+                  </>
+                );
+              }}
+            </Await>
+          </Suspense>
         </div>
       </PageBody>
     </PageContainer>

apps/webapp/app/routes/_app.orgs.$organizationSlug.projects.$projectParam.runs/route.tsx

@@ -1,12 +1,18 @@
 import { parse } from "@conform-to/zod";
 import { ActionFunction, json } from "@remix-run/node";
 import { z } from "zod";
-import { redirectBackWithErrorMessage, redirectWithSuccessMessage } from "~/models/message.server";
+import {
+  redirectBackWithErrorMessage,
+  redirectWithErrorMessage,
+  redirectWithSuccessMessage,
+} from "~/models/message.server";
 import { ContinueRunService } from "~/services/runs/continueRun.server";
 import { ReRunService } from "~/services/runs/reRun.server";
+import { rootPath, runPath } from "~/utils/pathBuilder";
 
 export const schema = z.object({
   successRedirect: z.string(),
+  failureRedirect: z.string(),
 });
 
 const ParamSchema = z.object({
@@ -20,7 +26,11 @@ export const action: ActionFunction = async ({ request, params }) => {
   const submission = parse(formData, { schema });
 
   if (!submission.value) {
-    return json(submission);
+    return redirectWithErrorMessage(
+      rootPath(),
+      request,
+      submission.error ? JSON.stringify(submission.error) : "Invalid form"
+    );
   }
 
   try {
@@ -29,7 +39,11 @@ export const action: ActionFunction = async ({ request, params }) => {
       const run = await rerunService.call({ runId });
 
       if (!run) {
-        return redirectBackWithErrorMessage(request, "Unable to retry run");
+        return redirectWithErrorMessage(
+          submission.value.failureRedirect,
+          request,
+          "Unable to retry run"
+        );
       }
 
       return redirectWithSuccessMessage(
@@ -48,6 +62,10 @@ export const action: ActionFunction = async ({ request, params }) => {
       );
     }
   } catch (error: any) {
-    return json({ errors: { body: error.message } }, { status: 400 });
+    return redirectWithErrorMessage(
+      submission.value.failureRedirect,
+      request,
+      error instanceof Error ? error.message : JSON.stringify(error)
+    );
   }
 };

apps/webapp/app/routes/resources.runs.$runId.rerun.ts

@@ -9,7 +9,10 @@ export class DeleteEndpointIndexService {
   }
 
   public async call(id: string, userId: string): Promise<void> {
-    await this.#prismaClient.endpoint.delete({
+    await this.#prismaClient.endpoint.update({
+      data: {
+        url: null,
+      },
       where: {
         id,
         organization: {

apps/webapp/app/services/endpoints/deleteEndpointService.ts

@@ -54,6 +54,13 @@ export class PerformEndpointIndexService {
 
     logger.debug("Performing endpoint index", endpointIndex);
 
+    if (!endpointIndex.endpoint.url) {
+      logger.debug("Endpoint URL is not set", endpointIndex);
+      return updateEndpointIndexWithError(this.#prismaClient, id, {
+        message: "Endpoint URL is not set",
+      });
+    }
+
     // Make a request to the endpoint to fetch a list of jobs
     const client = new EndpointApi(
       endpointIndex.endpoint.environment.apiKey,

apps/webapp/app/services/endpoints/performEndpointIndexService.ts

@@ -29,6 +29,13 @@ export class ProbeEndpointService {
       id,
     });
 
+    if (!endpoint.url) {
+      logger.debug(`Endpoint has no url`, {
+        id,
+      });
+      return;
+    }
+
     const client = new EndpointApi(endpoint.environment.apiKey, endpoint.url);
 
     const { response, durationInMs } = await client.probe(MAX_RUN_CHUNK_EXECUTION_LIMIT);

apps/webapp/app/services/endpoints/probeEndpoint.server.ts

@@ -16,6 +16,9 @@ export class RecurringEndpointIndexService {
 
     const endpoints = await this.#prismaClient.endpoint.findMany({
       where: {
+        url: {
+          not: null,
+        },
         environment: {
           type: {
             in: [RuntimeEnvironmentType.PRODUCTION, RuntimeEnvironmentType.STAGING],