💄 create and prefetch certificates for redirects

server/routers/redirect/listRedirects.ts

@@ -28,6 +28,7 @@ export type ListRedirectsResponse = PaginatedResponse<{
         resourceName: string | null;
         resourceNiceId: string | null;
         resourceFullDomain: string | null;
+        resourceDomainId: string | null;
         domainId: string | null;
         baseDomain: string | null;
     }>;
@@ -150,6 +151,7 @@ export async function listRedirects(
                 resourceName: resources.name,
                 resourceNiceId: resources.niceId,
                 resourceFullDomain: resources.fullDomain,
+                resourceDomainId: resources.domainId,
                 domainId: redirects.domainId,
                 baseDomain: domains.baseDomain
             })

src/app/[orgId]/settings/redirects/page.tsx

@@ -2,6 +2,8 @@ import RedirectsTable from "@app/components/RedirectsTable";
 import SettingsSectionTitle from "@app/components/SettingsSectionTitle";
 import { internal } from "@app/lib/api";
 import { authCookieHeader } from "@app/lib/api/cookies";
+import { build } from "@server/build";
+import type { GetBatchedCertificateResponse } from "@server/routers/certificates/types";
 import type { ListRedirectsResponse } from "@server/routers/redirect";
 import type { AxiosResponse } from "axios";
 import type { Metadata } from "next";
@@ -42,16 +44,7 @@ export default async function RedirectIndexPage(props: RedirectIndexPageProps) {
         // empty list on error
     }
 
-    return (
+    const redirectRows = redirects.map((redirect) => ({
-        <>
-            <SettingsSectionTitle
-                title={t("redirectsTitle")}
-                description={t("redirectsDescription")}
-            />
-
-            <RedirectsTable
-                orgId={orgId}
-                redirects={redirects.map((redirect) => ({
         redirectId: redirect.redirectId,
         niceId: redirect.niceId,
         name: redirect.name,
@@ -67,14 +60,60 @@ export default async function RedirectIndexPage(props: RedirectIndexPageProps) {
         resourceName: redirect.resourceName,
         resourceNiceId: redirect.resourceNiceId,
         resourceFullDomain: redirect.resourceFullDomain,
+        resourceDomainId: redirect.resourceDomainId,
         domainId: redirect.domainId,
         baseDomain: redirect.baseDomain
-                }))}
+    }));
+
+    // Prefetched in one batched call so the table doesn't fire a separate
+    // certificate request per visible row once it mounts on the client.
+    const certDomains = Array.from(
+        new Set(
+            redirectRows
+                .map((r) => {
+                    const domainHost = r.baseDomain
+                        ? [r.subdomain, r.baseDomain].filter(Boolean).join(".")
+                        : null;
+                    return r.resourceFullDomain ?? domainHost;
+                })
+                .filter((host): host is string => Boolean(host))
+        )
+    );
+
+    let initialCertificates: GetBatchedCertificateResponse | undefined;
+    if (build !== "oss" && certDomains.length > 0) {
+        try {
+            const certSearchParams = new URLSearchParams(
+                certDomains.map((domain) => ["domains", domain])
+            );
+            const certRes = await internal.get<
+                AxiosResponse<GetBatchedCertificateResponse>
+            >(
+                `/org/${orgId}/batched-certificates?${certSearchParams.toString()}`,
+                await authCookieHeader()
+            );
+            initialCertificates = certRes.data.data;
+        } catch {
+            // leave undefined so each row falls back to fetching its own
+        }
+    }
+
+    return (
+        <>
+            <SettingsSectionTitle
+                title={t("redirectsTitle")}
+                description={t("redirectsDescription")}
+            />
+
+            <RedirectsTable
+                orgId={orgId}
+                redirects={redirectRows}
                 rowCount={pagination.total}
                 pagination={{
                     pageIndex: pagination.page - 1,
                     pageSize: pagination.pageSize
                 }}
+                initialCertificates={initialCertificates}
             />
         </>
     );

src/components/RedirectsTable.tsx

@@ -14,10 +14,12 @@ import {
     ControlledDataTable,
     type ExtendedColumnDef
 } from "@app/components/ui/controlled-data-table";
+import { ResourceAccessCertIndicator } from "@app/components/ResourceAccessCertIndicator";
 import { useEnvContext } from "@app/hooks/useEnvContext";
 import { useNavigationContext } from "@app/hooks/useNavigationContext";
 import { toast } from "@app/hooks/useToast";
 import { createApiClient, formatAxiosError } from "@app/lib/api";
+import type { GetBatchedCertificateResponse } from "@server/routers/certificates/types";
 import type { PaginationState } from "@tanstack/react-table";
 import {
     ArrowRight,
@@ -48,6 +50,7 @@ export type RedirectRow = {
     resourceName: string | null;
     resourceNiceId: string | null;
     resourceFullDomain: string | null;
+    resourceDomainId: string | null;
     domainId: string | null;
     baseDomain: string | null;
 };
@@ -57,13 +60,15 @@ type RedirectsTableProps = {
     orgId: string;
     pagination: PaginationState;
     rowCount: number;
+    initialCertificates?: GetBatchedCertificateResponse;
 };
 
 export default function RedirectsTable({
     redirects,
     orgId,
     pagination,
-    rowCount
+    rowCount,
+    initialCertificates
 }: RedirectsTableProps) {
     const router = useRouter();
     const t = useTranslations();
@@ -263,8 +268,24 @@ export default function RedirectsTable({
                               .join(".")
                         : null;
                     const host = redirect.resourceFullDomain ?? domainHost;
+                    // The cert lives on whichever domain actually terminates
+                    // TLS: the resource's domain when attached to a resource,
+                    // otherwise the redirect's own domain.
+                    const certDomainId =
+                        redirect.resourceDomainId ?? redirect.domainId;
 
                     return (
+                        <div className="flex items-center gap-2 min-w-0">
+                            {certDomainId && host ? (
+                                <ResourceAccessCertIndicator
+                                    orgId={orgId}
+                                    domainId={certDomainId}
+                                    fullDomain={host}
+                                    initialCertValue={
+                                        initialCertificates?.[host]
+                                    }
+                                />
+                            ) : null}
                             <code className="text-sm truncate">
                                 {host ?? ""}
                                 <span className="text-muted-foreground">
@@ -273,6 +294,7 @@ export default function RedirectsTable({
                                         : redirect.matchPath}
                                 </span>
                             </code>
+                        </div>
                     );
                 }
             },
@@ -371,7 +393,7 @@ export default function RedirectsTable({
                 )
             }
         ],
-        [orgId, t]
+        [orgId, t, initialCertificates]
     );
 
     return (